@nolgard/svelte

Svelte components and utilities for Pinecone apps.

Config components

Component documentation lives in docs/components and is split into one file per component for easier maintenance.

Import from the config subpath:

<script>
  import { Panel, InputField, Checkbox, CheckboxGroup, CustomSelector } from '@nolgard/svelte/config'
</script>

InputField supports:

• id, label, description, type, name, required, disabled, readonly
• show, maxlength, maxlenght, pattern, rows, value

CustomSelector supports:

• id, label, description, name, placeholder
• options, searchable, removable, required, disabled, multiple, show, value

Example:

<Panel heading="Inställningar">
  <InputField name="text" label="Text" />

  <CustomSelector
    name="custom"
    label="Custom selector"
    options={[{ label: 'Värde 1', value: 'value1' }, { label: 'Värde 2', value: 'value2' }]}
  />
</Panel>

Label snippet:

<InputField name="text">
  {#snippet label()}
    Custom <strong>label</strong>
  {/snippet}
</InputField>

Description snippet:

<InputField name="text">
  {#snippet description()}
    Custom <strong>description</strong>
  {/snippet}
</InputField>

Option snippet:

<CustomSelector name="custom" options={[{ label: 'Värde 1', value: 'value1' }] }>
  {#snippet option({ option: item })}
    {item.label}
  {/snippet}
</CustomSelector>