le-kit 0.6.0 → 0.6.2

package/LLM_CONTEXT.md

@@ -30,6 +30,7 @@ This file is auto-generated and contains documentation for all Le-Kit web compon
 - [le-round-progress](#le-round-progress)
 - [le-scroll-progress](#le-scroll-progress)
 - [le-segmented-control](#le-segmented-control)
+- [le-select](#le-select)
 - [le-side-panel](#le-side-panel)
 - [le-side-panel-toggle](#le-side-panel-toggle)
 - [le-slot](#le-slot)
@@ -68,7 +69,7 @@ row and handles overflow according to the `overflow` prop.
 
 | Event | Type | Description |
 |-------|------|-------------|
-| `leBarOverflowChange` | `EventEmitter<LeBarOverflowChangeDetail>` | Emitted when overflow state changes. |
+| `leBarOverflowChange` | `EventEmitter<LeBarOverflowChangeDetail> \| undefined` | Emitted when overflow state changes. |
 
 ### Slots
 
@@ -323,17 +324,23 @@ A checkbox component with support for labels, descriptions, and external IDs.
 | Name | Type | Default | Description |
 |------|------|---------|-------------|
 | `el` | `HTMLElement` |  |  |
+| `id` | `string` | ``le-checkbox-${Math.random().toString(36).substring(2, 9)}`` | The ID of the checkbox input. This is used for linking the label to the input for accessibility. In case there is no ID provided, a random one will be generated internally. |
 | `checked` | `boolean` | `false` | Whether the checkbox is checked |
 | `disabled` | `boolean` | `false` | Whether the checkbox is disabled |
-| `name` | `string` |  | The name of the checkbox input |
-| `value` | `string` |  | The value of the checkbox input |
-| `externalId` | `string` |  | External ID for linking with external systems (e.g. database ID, PDF form field ID) |
+| `name` | `string \| undefined` |  | The name of the checkbox input |
+| `value` | `string \| undefined` |  | The value of the checkbox input |
+| `externalId` | `string \| undefined` |  | External ID for linking with external systems (e.g. database ID, PDF form field ID) |
 
 ### Events
 
 | Event | Type | Description |
 |-------|------|-------------|
-| `change` | `EventEmitter<{ checked: boolean; value: string; name: string; externalId: string }>` | Emitted when the checked state changes |
+| `change` | `EventEmitter<{
+    checked: boolean;
+    value?: string;
+    name?: string;
+    externalId?: string;
+  }>` | Emitted when the checked state changes |
 
 ### Slots
 
@@ -364,24 +371,24 @@ Supports standard copy/paste and range selection behaviors.
 |------|------|---------|-------------|
 | `el` | `HTMLElement` |  |  |
 | `value` | `string` | `''` | The value of the input |
-| `name` | `string` |  | The name of the input |
-| `label` | `string` |  | Label for the input |
+| `name` | `string \| undefined` |  | The name of the input |
+| `label` | `string \| undefined` |  | Label for the input |
 | `length` | `number` | `6` | Length of the code (number of characters) |
 | `description` | `string \| undefined` |  | Description text displayed below the input in case there is a more complex markup, it can be provided via slot as well |
 | `type` | `'text' \| 'number'` | `'text'` | The type of code (numeric or alphanumeric) This affects the keyboard layout on mobile devices. |
 | `disabled` | `boolean` | `false` | Whether the input is disabled |
 | `readonly` | `boolean` | `false` | Whether the input is read-only |
-| `externalId` | `string` |  | External ID for linking with external systems |
+| `externalId` | `string \| undefined` |  | External ID for linking with external systems |
 | `error` | `boolean` | `false` | Internal validation state (can be set externally manually or via simple check) |
 
 ### Events
 
 | Event | Type | Description |
 |-------|------|-------------|
-| `leChange` | `EventEmitter<{ value: string; name: string; externalId: string }>` | Emitted when the value changes (on blur or Enter) |
-| `leInput` | `EventEmitter<{ value: string; name: string; externalId: string }>` | Emitted when the input value changes (on keystroke) |
-| `leFocus` | `EventEmitter<void>` | Emitted when the input is focused |
-| `leBlur` | `EventEmitter<void>` | Emitted when the input is blurred |
+| `leChange` | `EventEmitter<{ value: string; name?: string; externalId?: string }> \| undefined` | Emitted when the value changes (on blur or Enter) |
+| `leInput` | `EventEmitter<{ value: string; name?: string; externalId?: string }> \| undefined` | Emitted when the input value changes (on keystroke) |
+| `leFocus` | `EventEmitter<void> \| undefined` | Emitted when the input is focused |
+| `leBlur` | `EventEmitter<void> \| undefined` | Emitted when the input is blurred |
 
 ### Slots
 
@@ -671,7 +678,7 @@ The header component updates that variable when it renders.
 | Name | Type | Default | Description |
 |------|------|---------|-------------|
 | `el` | `HTMLElement` |  |  |
-| `name` | `string` | `null` | Name of the icon to display. Corresponds to a JSON file in the assets folder. For example, "search" will load the "search.json" file. |
+| `name` | `string \| undefined` | `undefined` | Name of the icon to display. Corresponds to a JSON file in the assets folder. For example, "search" will load the "search.json" file. |
 | `size` | `number` | `16` | Size of the icon in pixels. Default is 16. |
 
 ---
@@ -771,10 +778,10 @@ A number input component with validation, keyboard controls, and custom spinners
 | Name | Type | Default | Description |
 |------|------|---------|-------------|
 | `el` | `HTMLElement` |  |  |
-| `value` | `number` |  | The value of the input |
-| `name` | `string` |  | The name of the input |
-| `label` | `string` |  | Label for the input |
-| `placeholder` | `string` |  | Placeholder text |
+| `value` | `number \| undefined` |  | The value of the input |
+| `name` | `string \| undefined` |  | The name of the input |
+| `label` | `string \| undefined` |  | Label for the input |
+| `placeholder` | `string \| undefined` |  | Placeholder text |
 | `min` | `number \| undefined` |  | Minimum allowed value |
 | `max` | `number \| undefined` |  | Maximum allowed value |
 | `step` | `number` | `1` | Step value for increment/decrement |
@@ -783,14 +790,24 @@ A number input component with validation, keyboard controls, and custom spinners
 | `readonly` | `boolean` | `false` | Whether the input is read-only |
 | `iconStart` | `string \| undefined` |  | Icon for the start icon |
 | `showSpinners` | `boolean` | `true` | Whether to show the spinner controls |
-| `externalId` | `string` |  | External ID for linking with external systems |
+| `externalId` | `string \| undefined` |  | External ID for linking with external systems |
 
 ### Events
 
 | Event | Type | Description |
 |-------|------|-------------|
-| `leChange` | `EventEmitter<{ value: number; name: string; externalId: string; isValid: boolean }>` | Emitted when the value changes (on blur or Enter) |
-| `leInput` | `EventEmitter<{ value: number; name: string; externalId: string; isValid: boolean }>` | Emitted when the input value changes (on keystroke/spin) |
+| `leChange` | `EventEmitter<{
+    value?: number;
+    name?: string;
+    externalId?: string;
+    isValid: boolean;
+  }> \| undefined` | Emitted when the value changes (on blur or Enter) |
+| `leInput` | `EventEmitter<{
+    value?: number;
+    name?: string;
+    externalId?: string;
+    isValid: boolean;
+  }> \| undefined` | Emitted when the input value changes (on keystroke/spin) |
 
 ### Slots
 
@@ -826,7 +843,7 @@ and other top-layer elements. Falls back gracefully in older browsers.
 | Name | Type | Default | Description |
 |------|------|---------|-------------|
 | `el` | `HTMLElement` |  |  |
-| `mode` | `'default' \| 'admin'` |  | Mode of the popover should be 'default' for internal use |
+| `mode` | `'default' \| 'admin'` | `'default'` | Mode of the popover should be 'default' for internal use |
 | `open` | `boolean` | `false` | Whether the popover is currently open |
 | `position` | `'top' \| 'bottom' \| 'left' \| 'right' \| 'auto'` | `'bottom'` | Position of the popover relative to its trigger |
 | `align` | `'start' \| 'center' \| 'end'` | `'start'` | Alignment of the popover |
@@ -844,8 +861,8 @@ and other top-layer elements. Falls back gracefully in older browsers.
 
 | Event | Type | Description |
 |-------|------|-------------|
-| `lePopoverOpen` | `EventEmitter<void>` | Emitted when the popover opens |
-| `lePopoverClose` | `EventEmitter<void>` | Emitted when the popover closes |
+| `lePopoverOpen` | `EventEmitter<void> \| undefined` | Emitted when the popover opens |
+| `lePopoverClose` | `EventEmitter<void> \| undefined` | Emitted when the popover closes |
 
 ### Slots
 
@@ -888,8 +905,8 @@ via leAlert(), leConfirm(), lePrompt().
 | Event | Type | Description |
 |-------|------|-------------|
 | `leConfirm` | `EventEmitter<PopupResult>` | Emitted when the popup is confirmed (OK clicked) |
-| `leCancel` | `EventEmitter<PopupResult>` | Emitted when the popup is cancelled (Cancel clicked or dismissed) |
-| `leOpen` | `EventEmitter<void>` | Emitted when the popup opens |
+| `leCancel` | `EventEmitter<PopupResult> \| undefined` | Emitted when the popup is cancelled (Cancel clicked or dismissed) |
+| `leOpen` | `EventEmitter<void> \| undefined` | Emitted when the popup opens |
 | `leClose` | `EventEmitter<PopupResult>` | Emitted when the popup closes |
 
 ### Slots
@@ -912,7 +929,6 @@ via leAlert(), leConfirm(), lePrompt().
 | `value` | `number` | `0` |  |
 | `padding` | `number` | `0` |  |
 | `paths` | `string` |  |  |
-| `progressPaths` | `any[]` |  |  |
 | `params` | `{
     width: number;
     diameter: number;
@@ -972,7 +988,7 @@ Perfect for toggling between a small set of related options.
 
 | Event | Type | Description |
 |-------|------|-------------|
-| `leChange` | `EventEmitter<LeOptionSelectDetail>` | Emitted when the selection changes. |
+| `leChange` | `EventEmitter<LeOptionSelectDetail> \| undefined` | Emitted when the selection changes. |
 
 ### CSS Variables
 
@@ -985,6 +1001,35 @@ Perfect for toggling between a small set of related options.
 
 ---
 
+## <le-select>
+
+A select dropdown component for single selection.
+
+### Properties
+
+| Name | Type | Default | Description |
+|------|------|---------|-------------|
+| `el` | `HTMLElement` |  |  |
+| `options` | `LeOption[] \| string` | `[]` | The options to display in the dropdown. |
+| `value` | `LeOptionValue \| undefined` |  | The currently selected value. |
+| `placeholder` | `string` | `'Select an option'` | Placeholder text when no option is selected. |
+| `disabled` | `boolean` | `false` | Whether the select is disabled. |
+| `required` | `boolean` | `false` | Whether selection is required. |
+| `name` | `string \| undefined` |  | Name attribute for form submission. |
+| `size` | `'small' \| 'medium' \| 'large'` | `'medium'` | Size variant of the select. |
+| `variant` | `'default' \| 'outlined' \| 'solid'` | `'default'` | Visual variant of the select. |
+| `open` | `boolean` | `false` | Whether the dropdown is currently open. |
+
+### Events
+
+| Event | Type | Description |
+|-------|------|-------------|
+| `leChange` | `EventEmitter<LeOptionSelectDetail> \| undefined` | Emitted when the selected value changes. |
+| `leOpen` | `EventEmitter<void> \| undefined` | Emitted when the dropdown opens. |
+| `leClose` | `EventEmitter<void> \| undefined` | Emitted when the dropdown closes. |
+
+---
+
 ## <le-side-panel>
 
 ### Properties
@@ -1032,7 +1077,7 @@ Perfect for toggling between a small set of related options.
 | `action` | `LeSidePanelToggleAction` | `'toggle'` | Action to emit. Default toggles the panel. |
 | `shortcut` | `string \| undefined` |  | Optional keyboard shortcut like `Mod+B` or `Alt+N`. |
 | `disabled` | `boolean` | `false` | Disables the toggle. |
-| `mode` | `'default' \| 'admin'` |  |  |
+| `mode` | `'default' \| 'admin'` | `'default'` |  |
 | `variant` | `'solid' \| 'outlined' \| 'clear' \| 'system'` | `'solid'` |  |
 | `color` | `'primary' \| 'secondary' \| 'success' \| 'warning' \| 'danger' \| 'info'` | `'primary'` |  |
 | `size` | `'small' \| 'medium' \| 'large'` | `'medium'` |  |
@@ -1142,39 +1187,41 @@ A text input component with support for labels, descriptions, icons, and externa
 |------|------|---------|-------------|
 | `el` | `HTMLElement` |  |  |
 | `inputRef` | `(el: HTMLInputElement) => void \| undefined` |  | Pass the ref of the input element to the parent component |
-| `mode` | `'default' \| 'admin'` |  | Mode of the popover should be 'default' for internal use |
-| `value` | `string` |  | The value of the input |
-| `name` | `string` |  | The name of the input |
-| `type` | `'text' \| 'email' \| 'password' \| 'tel' \| 'url'` | `'text'` | The type of the input (text, email, password, etc.) |
-| `label` | `string` |  | Label for the input |
-| `iconStart` | `string` |  | Icon for the start icon |
-| `iconEnd` | `string` |  | Icon for the end icon |
-| `placeholder` | `string` |  | Placeholder text |
-| `hideDescription` | `boolean` | `false` | Hide description slot |
+| `mode` | `'default' \| 'admin'` | `'default'` | Mode of the popover should be 'default' for internal use |
+| `value` | `string \| undefined` |  | The value of the input |
+| `name` | `string \| undefined` |  | The name of the input |
+| `type` | `'text' \| 'email' \| 'password' \| 'search' \| 'tel' \| 'url'` | `'text'` | The type of the input (text, email, password, etc.) |
+| `label` | `string \| undefined` |  | Label for the input |
+| `description` | `string \| undefined` |  | Description text displayed below the input |
+| `iconStart` | `string \| undefined` |  | Icon for the start icon |
+| `iconEnd` | `string \| undefined` |  | Icon for the end icon |
+| `placeholder` | `string \| undefined` |  | Placeholder text |
+| `clearable` | `boolean` | `false` | Whether the input can be cleared with a built-in clear button |
+| `autocomplete` | `string \| undefined` |  | Native autocomplete attribute forwarded to the input |
 | `disabled` | `boolean` | `false` | Whether the input is disabled |
 | `readonly` | `boolean` | `false` | Whether the input is read-only |
-| `externalId` | `string` |  | External ID for linking with external systems |
+| `externalId` | `string \| undefined` |  | External ID for linking with external systems |
 
 ### Events
 
 | Event | Type | Description |
 |-------|------|-------------|
-| `change` | `EventEmitter<{
-    value: string;
-    name: string;
-    externalId: string;
-  }>` | Emitted when the value changes (on blur or Enter) |
-| `input` | `EventEmitter<{
-    value: string;
-    name: string;
-    externalId: string;
-  }>` | Emitted when the input value changes (on keystroke) |
+| `leChange` | `EventEmitter<{
+    value?: string;
+    name?: string;
+    externalId?: string;
+  }> \| undefined` | Emitted when the value changes (on blur or Enter) |
+| `leInput` | `EventEmitter<{
+    value?: string;
+    name?: string;
+    externalId?: string;
+  }> \| undefined` | Emitted when the input value changes (on keystroke) |
 
 ### Slots
 
 | Name | Description |
 |------|-------------|
-| Default | The label text for the input |
+| `"label"` | The label content for the input |
 | `"description"` | Additional description text displayed below the input |
 | `"icon-start"` | Icon to display at the start of the input |
 | `"icon-end"` | Icon to display at the end of the input |
@@ -1201,7 +1248,7 @@ A flexible tab component with multiple variants and states.
 | Name | Type | Default | Description |
 |------|------|---------|-------------|
 | `el` | `HTMLElement` |  |  |
-| `mode` | `'default' \| 'admin'` |  | Mode of the popover should be 'default' for internal use |
+| `mode` | `'default' \| 'admin'` | `'default'` | Mode of the popover should be 'default' for internal use |
 | `label` | `string \| undefined` |  | Label if it is not provided via slot |
 | `value` | `string \| undefined` |  | Value of the tab, defaults to label if not provided |
 | `variant` | `'underlined' \| 'solid' \| 'pills' \| 'enclosed' \| 'icon-only'` | `'underlined'` | Tab variant style |
@@ -1223,7 +1270,7 @@ A flexible tab component with multiple variants and states.
 
 | Event | Type | Description |
 |-------|------|-------------|
-| `click` | `EventEmitter<PointerEvent>` | Emitted when the tab is clicked. This is a custom event that wraps the native click but ensures the target is the le-tab. |
+| `click` | `EventEmitter<PointerEvent> \| undefined` | Emitted when the tab is clicked. This is a custom event that wraps the native click but ensures the target is the le-tab. |
 
 ### Slots
 
@@ -1269,7 +1316,7 @@ use `le-tabs` instead.
 
 | Event | Type | Description |
 |-------|------|-------------|
-| `leTabChange` | `EventEmitter<LeOptionSelectDetail>` | Emitted when the selected tab changes. |
+| `leTabChange` | `EventEmitter<LeOptionSelectDetail> \| undefined` | Emitted when the selected tab changes. |
 
 ### CSS Variables
 
@@ -1342,7 +1389,7 @@ Full keyboard navigation and ARIA support included.
 
 | Event | Type | Description |
 |-------|------|-------------|
-| `leTabChange` | `EventEmitter<LeOptionSelectDetail>` | Emitted when the selected tab changes. |
+| `leTabChange` | `EventEmitter<LeOptionSelectDetail> \| undefined` | Emitted when the selected tab changes. |
 
 ### Slots
 
@@ -1371,8 +1418,8 @@ A tag/chip component for displaying labels with optional dismiss functionality.
 
 | Name | Type | Default | Description |
 |------|------|---------|-------------|
-| `label` | `string` |  | The text label to display in the tag. |
-| `mode` | `'default' \| 'admin'` |  | Mode of the popover should be 'default' for internal use |
+| `label` | `string \| undefined` |  | The text label to display in the tag. |
+| `mode` | `'default' \| 'admin' \| undefined` |  | Mode of the popover should be 'default' for internal use |
 | `icon` | `string \| undefined` |  | Icon to display before the label. Can be an emoji, URL, or icon name. |
 | `dismissible` | `boolean` | `false` | Whether the tag can be dismissed (shows close button). |
 | `disabled` | `boolean` | `false` | Whether the tag is disabled. |
@@ -1383,7 +1430,7 @@ A tag/chip component for displaying labels with optional dismiss functionality.
 
 | Event | Type | Description |
 |-------|------|-------------|
-| `leDismiss` | `EventEmitter<void>` | Emitted when the dismiss button is clicked. |
+| `leDismiss` | `EventEmitter<void> \| undefined` | Emitted when the dismiss button is clicked. |
 
 ### Slots
 
@@ -1449,12 +1496,12 @@ toolbar for bold, italic, links, and paragraph type selection.
 | `center` | `string` | `'center'` |  |
 | `value` | `number` | `0` |  |
 | `rotating` | `boolean` | `false` | Internal state  using properties instead of |
-| `centerX` | `number` |  |  |
-| `centerY` | `number` |  |  |
-| `pageX` | `number` |  |  |
-| `pageY` | `number` |  |  |
+| `centerX` | `number \| undefined` |  |  |
+| `centerY` | `number \| undefined` |  |  |
+| `pageX` | `number \| undefined` |  |  |
+| `pageY` | `number \| undefined` |  |  |
 | `currentAngle` | `number` | `0` |  |
-| `startAngle` | `number` |  |  |
+| `startAngle` | `number \| undefined` |  |  |
 
 ---
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "le-kit",
-  "version": "0.6.0",
+  "version": "0.6.2",
   "description": "Themable web components library with CMS admin mode support",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",