@appsbd/vue3-appsbd-ui 1.0.1 → 1.0.2

package/.ai/ai_ref_AbFilterPanel.md

@@ -1,71 +1,71 @@
-# AbFilterPanel — AI Reference
-
-Advanced filter panel for list and table views. Supports quick/advance modes, single-field search, date ranges, and an optional QR/barcode scan button.
-
-## Installation
-
-Globally registered by the plugin.
-
-## Usage
-
-```vue
-<template>
-  <ab-filter-panel
-    :filter-options="filterOptions"
-    is-advance
-    is-searchable
-    size="sm"
-    @search-filter="handleSearch"
-    @reset="handleReset"
-  />
-</template>
-
-<script setup>
-const filterOptions = [
-  { propName: 'name', label: 'Name', type: 'text' },
-  { propName: 'status', label: 'Status', type: 'select', options: [...] },
-  { propName: 'createdAt', label: 'Created', type: 'daterange' },
-];
-
-function handleSearch(data) {
-  // data: [{ propName, operators, value }, ...]
-}
-</script>
-```
-
-## Props
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| `isAdvance` | `Boolean` | `false` | Show all filters in an expanded layout. |
-| `isQuickAdvance` | `Boolean` | `false` | Quick advance mode. |
-| `isSingle` | `Boolean` | `false` | Single-field search mode. |
-| `isAllowed` | `Boolean` | `false` | Permission flag consumed by the template. |
-| `canScan` | `Boolean` | `false` | Show a QR / barcode scan button. |
-| `filterOptions` | `Array` | `[]` | Filter field definitions. |
-| `scanProps` | `String` | `""` | Property name to apply scan result to. |
-| `showScanFld` | `Boolean` | `false` | Force-show the scan field. |
-| `showDrGroupText` | `Boolean` | `true` | Show date-range group label. |
-| `dateFormat` | `String` | `"MMM DD,YYYY"` | Date display format. |
-| `isSearchable` | `Boolean` | `false` | Allow searching within option lists. |
-| `isMaxDate` | `Boolean` | `true` | Limit date pickers to today as max. |
-| `size` | `String` | `"xs"` | Control size. |
-| `advanceSearchInputContainerClass` | `String` | `"col-6"` | Grid column class for inputs in advance mode. |
-| `isQuickAdvanceAutoSearch` | `Boolean` | `false` | Fire search automatically on field change (quick advance). |
-
-## Events
-
-| Event | Payload | Description |
-| --- | --- | --- |
-| `searchFilter` | `Array<{ propName, operators, value }>` | User triggered a search. |
-| `reset` | — | Filter reset clicked. |
-| `ChangeSearchMode` | `showScan: Boolean` | Toggled between search and scan modes. |
-
-## Slots
-
-| Name | Description |
-| --- | --- |
-| `prefix` | Filter prefix. |
-| `postfix` | Filter postfix. |
-| `icon` | Filter icon. |
-| `hints` | Helper text. |
+# AbFilterPanel — AI Reference
+
+Advanced filter panel for list and table views. Supports quick/advance modes, single-field search, date ranges, and an optional QR/barcode scan button.
+
+## Installation
+
+Globally registered by the plugin.
+
+## Usage
+
+```vue
+<template>
+  <ab-filter-panel
+    :filter-options="filterOptions"
+    is-advance
+    is-searchable
+    size="sm"
+    @search-filter="handleSearch"
+    @reset="handleReset"
+  />
+</template>
+
+<script setup>
+const filterOptions = [
+  { propName: 'name', label: 'Name', type: 'text' },
+  { propName: 'status', label: 'Status', type: 'select', options: [...] },
+  { propName: 'createdAt', label: 'Created', type: 'daterange' },
+];
+
+function handleSearch(data) {
+  // data: [{ propName, operators, value }, ...]
+}
+</script>
+```
+
+## Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| `isAdvance` | `Boolean` | `false` | Show all filters in an expanded layout. |
+| `isQuickAdvance` | `Boolean` | `false` | Quick advance mode. |
+| `isSingle` | `Boolean` | `false` | Single-field search mode. |
+| `isAllowed` | `Boolean` | `false` | Permission flag consumed by the template. |
+| `canScan` | `Boolean` | `false` | Show a QR / barcode scan button. |
+| `filterOptions` | `Array` | `[]` | Filter field definitions. |
+| `scanProps` | `String` | `""` | Property name to apply scan result to. |
+| `showScanFld` | `Boolean` | `false` | Force-show the scan field. |
+| `showDrGroupText` | `Boolean` | `true` | Show date-range group label. |
+| `dateFormat` | `String` | `"MMM DD,YYYY"` | Date display format. |
+| `isSearchable` | `Boolean` | `false` | Allow searching within option lists. |
+| `isMaxDate` | `Boolean` | `true` | Limit date pickers to today as max. |
+| `size` | `String` | `"xs"` | Control size. |
+| `advanceSearchInputContainerClass` | `String` | `"col-6"` | Grid column class for inputs in advance mode. |
+| `isQuickAdvanceAutoSearch` | `Boolean` | `false` | Fire search automatically on field change (quick advance). |
+
+## Events
+
+| Event | Payload | Description |
+| --- | --- | --- |
+| `searchFilter` | `Array<{ propName, operators, value }>` | User triggered a search. |
+| `reset` | — | Filter reset clicked. |
+| `ChangeSearchMode` | `showScan: Boolean` | Toggled between search and scan modes. |
+
+## Slots
+
+| Name | Description |
+| --- | --- |
+| `prefix` | Filter prefix. |
+| `postfix` | Filter postfix. |
+| `icon` | Filter icon. |
+| `hints` | Helper text. |

package/.ai/ai_ref_AbFormCheck.md

@@ -1,75 +1,75 @@
-# AbFormCheck / AbRadioInput — AI Reference
-
-Checkbox or radio group with card, segmented, and pill visual variants. `AbRadioInput` is an alias export of `AbFormCheck` — both register to the same component.
-
-## Installation
-
-Globally registered by the plugin.
-
-## Usage
-
-```vue
-<template>
-  <!-- Checkbox group -->
-  <ab-form-check
-    v-model="selected"
-    name="features"
-    :options="[
-      { val: 'a', title: 'Email reports' },
-      { val: 'b', title: 'Slack notifications' },
-      { val: 'c', title: 'SMS alerts' },
-    ]"
-    label="Enable"
-  />
-
-  <!-- Radio group — card variant -->
-  <ab-form-check
-    v-model="plan"
-    type="radio"
-    name="plan"
-    variant="card"
-    :options="plans"
-  />
-</template>
-```
-
-## Props
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| `modelValue` | `any` | — | v-model binding (array for checkboxes, single value for radio). |
-| `label` | `String \| null` | `null` | Group label. |
-| `rules` | `String` | `""` | VeeValidate rules. |
-| `val` | `any` | `null` | Initial value. |
-| `type` | `String` | `"checkbox"` | `"checkbox"` or `"radio"`. |
-| `isInline` | `Boolean` | `false` | Render options inline. |
-| `options` | `Array` | `[]` | Each: `{ val, title, description?, icon?, img_src?, iconComponent?, disable? }`. |
-| `name` | `String` | **required** | Field name. |
-| `limit` | `Number` | `0` | Max selections (0 = unlimited). |
-| `containerClass` | `String` | `"mb-3"` | Wrapper class. |
-| `size` | `String` | `"md"` | Control size. |
-| `iconSize` | `String` | `"24px"` | Icon size (when option has an icon). |
-| `iconGap` | `String` | `"10px"` | Gap between icon and label. |
-| `variant` | `String` | `"default"` | `default`, `card`, `segmented`, `pill`. |
-
-## Events
-
-| Event | Payload | Description |
-| --- | --- | --- |
-| `update:modelValue` | `value` | v-model sync. |
-
-## Slots
-
-| Name | Description |
-| --- | --- |
-| `label` | Group label. |
-| `description` | Group description. |
-| `help-text` | Helper text. |
-| `input-img-{option.title}` | Per-option image slot. |
-| `input-icon-{option.title}` | Per-option icon component slot. |
-| `label-{option.title}` | Per-option label slot. |
-| `description-{option.title}` | Per-option description slot. |
-
-## v-model
-
-Yes.
+# AbFormCheck / AbRadioInput — AI Reference
+
+Checkbox or radio group with card, segmented, and pill visual variants. `AbRadioInput` is an alias export of `AbFormCheck` — both register to the same component.
+
+## Installation
+
+Globally registered by the plugin.
+
+## Usage
+
+```vue
+<template>
+  <!-- Checkbox group -->
+  <ab-form-check
+    v-model="selected"
+    name="features"
+    :options="[
+      { val: 'a', title: 'Email reports' },
+      { val: 'b', title: 'Slack notifications' },
+      { val: 'c', title: 'SMS alerts' },
+    ]"
+    label="Enable"
+  />
+
+  <!-- Radio group — card variant -->
+  <ab-form-check
+    v-model="plan"
+    type="radio"
+    name="plan"
+    variant="card"
+    :options="plans"
+  />
+</template>
+```
+
+## Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| `modelValue` | `any` | — | v-model binding (array for checkboxes, single value for radio). |
+| `label` | `String \| null` | `null` | Group label. |
+| `rules` | `String` | `""` | VeeValidate rules. |
+| `val` | `any` | `null` | Initial value. |
+| `type` | `String` | `"checkbox"` | `"checkbox"` or `"radio"`. |
+| `isInline` | `Boolean` | `false` | Render options inline. |
+| `options` | `Array` | `[]` | Each: `{ val, title, description?, icon?, img_src?, iconComponent?, disable? }`. |
+| `name` | `String` | **required** | Field name. |
+| `limit` | `Number` | `0` | Max selections (0 = unlimited). |
+| `containerClass` | `String` | `"mb-3"` | Wrapper class. |
+| `size` | `String` | `"md"` | Control size. |
+| `iconSize` | `String` | `"24px"` | Icon size (when option has an icon). |
+| `iconGap` | `String` | `"10px"` | Gap between icon and label. |
+| `variant` | `String` | `"default"` | `default`, `card`, `segmented`, `pill`. |
+
+## Events
+
+| Event | Payload | Description |
+| --- | --- | --- |
+| `update:modelValue` | `value` | v-model sync. |
+
+## Slots
+
+| Name | Description |
+| --- | --- |
+| `label` | Group label. |
+| `description` | Group description. |
+| `help-text` | Helper text. |
+| `input-img-{option.title}` | Per-option image slot. |
+| `input-icon-{option.title}` | Per-option icon component slot. |
+| `label-{option.title}` | Per-option label slot. |
+| `description-{option.title}` | Per-option description slot. |
+
+## v-model
+
+Yes.

package/.ai/ai_ref_AbImageRadioInput.md

@@ -1,63 +1,63 @@
-# AbImageRadioInput — AI Reference
-
-Radio-group variant that renders visual image / icon tiles for each option. Useful for theme pickers, layout pickers, and other visual-first choices.
-
-## Installation
-
-Globally registered by the plugin.
-
-## Usage
-
-```vue
-<template>
-  <ab-image-radio-input
-    v-model="theme"
-    :options="[
-      { val: 'light', label: 'Light', img_src: '/theme-light.png' },
-      { val: 'dark', label: 'Dark', img_src: '/theme-dark.png' },
-      { val: 'system', label: 'System', icon: 'bi bi-laptop' },
-    ]"
-  />
-</template>
-```
-
-## Props
-
-| Name | Type | Default | Description |
-| --- | --- | --- | --- |
-| `modelValue` | `any` | — | v-model binding. |
-| `width` | `String` | `"auto"` | Option width. |
-| `height` | `String` | `"auto"` | Option height. |
-| `maxWidth` | `String` | `"inherit"` | Max width. |
-| `maxImgWidth` | `String` | `"50%"` | Image max width. |
-| `borderRadius` | `String` | `"5px"` | Option border radius. |
-| `margin` | `String` | `"0 15px 15px 0"` | Option margin. |
-| `padding` | `String` | `"10px"` | Option padding. |
-| `selectorTop` | `String` | `"5px"` | Position of the checkmark indicator (top). |
-| `selectorLeft` | `String` | `"5px"` | Position of the checkmark indicator (left). |
-| `selectorColor` | `String` | `""` | Checkmark color. |
-| `iconSize` | `String` | `"inherit"` | Option icon size. |
-| `options` | `Array` | `[]` | Option objects — see shape below. |
-| `isInline` | `Boolean` | `false` | Inline (row) layout. |
-| `optionClass` | `String` | `""` | Class for each option wrapper. |
-| `labelBorder` | `String` | `"1px solid transparent"` | Option border. |
-
-**Option shape**: `{ val, label?, img_src?, icon?, iconComponent?, icon_ctnr_class?, class? }`
-
-## Events
-
-| Event | Payload | Description |
-| --- | --- | --- |
-| `update:modelValue` | `value` | v-model sync. |
-
-## Slots
-
-| Name | Scope | Description |
-| --- | --- | --- |
-| `icon_image` | `option` | Custom image/icon for each option. |
-| `label` | `option` | Custom label rendering. |
-| `label-{val}` | — | Custom label for a specific option by `val`. |
-
-## v-model
-
-Yes.
+# AbImageRadioInput — AI Reference
+
+Radio-group variant that renders visual image / icon tiles for each option. Useful for theme pickers, layout pickers, and other visual-first choices.
+
+## Installation
+
+Globally registered by the plugin.
+
+## Usage
+
+```vue
+<template>
+  <ab-image-radio-input
+    v-model="theme"
+    :options="[
+      { val: 'light', label: 'Light', img_src: '/theme-light.png' },
+      { val: 'dark', label: 'Dark', img_src: '/theme-dark.png' },
+      { val: 'system', label: 'System', icon: 'bi bi-laptop' },
+    ]"
+  />
+</template>
+```
+
+## Props
+
+| Name | Type | Default | Description |
+| --- | --- | --- | --- |
+| `modelValue` | `any` | — | v-model binding. |
+| `width` | `String` | `"auto"` | Option width. |
+| `height` | `String` | `"auto"` | Option height. |
+| `maxWidth` | `String` | `"inherit"` | Max width. |
+| `maxImgWidth` | `String` | `"50%"` | Image max width. |
+| `borderRadius` | `String` | `"5px"` | Option border radius. |
+| `margin` | `String` | `"0 15px 15px 0"` | Option margin. |
+| `padding` | `String` | `"10px"` | Option padding. |
+| `selectorTop` | `String` | `"5px"` | Position of the checkmark indicator (top). |
+| `selectorLeft` | `String` | `"5px"` | Position of the checkmark indicator (left). |
+| `selectorColor` | `String` | `""` | Checkmark color. |
+| `iconSize` | `String` | `"inherit"` | Option icon size. |
+| `options` | `Array` | `[]` | Option objects — see shape below. |
+| `isInline` | `Boolean` | `false` | Inline (row) layout. |
+| `optionClass` | `String` | `""` | Class for each option wrapper. |
+| `labelBorder` | `String` | `"1px solid transparent"` | Option border. |
+
+**Option shape**: `{ val, label?, img_src?, icon?, iconComponent?, icon_ctnr_class?, class? }`
+
+## Events
+
+| Event | Payload | Description |
+| --- | --- | --- |
+| `update:modelValue` | `value` | v-model sync. |
+
+## Slots
+
+| Name | Scope | Description |
+| --- | --- | --- |
+| `icon_image` | `option` | Custom image/icon for each option. |
+| `label` | `option` | Custom label rendering. |
+| `label-{val}` | — | Custom label for a specific option by `val`. |
+
+## v-model
+
+Yes.

package/.ai/ai_ref_AbKbd.md

@@ -1,35 +1,35 @@
-# AbKbd — AI Reference
-
-Styled `<kbd>`-like keyboard key chip. Compose multiple into a chord using `AbKbdGroup`.
-
-## Installation
-
-Globally registered by the plugin.
-
-## Usage
-
-```vue
-<template>
-  Press <ab-kbd>Esc</ab-kbd> to close.
-
-  <ab-kbd-group>
-    <ab-kbd>⌘</ab-kbd>
-    <ab-kbd>Shift</ab-kbd>
-    <ab-kbd>P</ab-kbd>
-  </ab-kbd-group>
-</template>
-```
-
-## Props
-
-No declared props.
-
-## Events
-
-None.
-
-## Slots
-
-| Name | Description |
-| --- | --- |
-| `default` | Key label (typically a single character or short word). |
+# AbKbd — AI Reference
+
+Styled `<kbd>`-like keyboard key chip. Compose multiple into a chord using `AbKbdGroup`.
+
+## Installation
+
+Globally registered by the plugin.
+
+## Usage
+
+```vue
+<template>
+  Press <ab-kbd>Esc</ab-kbd> to close.
+
+  <ab-kbd-group>
+    <ab-kbd>⌘</ab-kbd>
+    <ab-kbd>Shift</ab-kbd>
+    <ab-kbd>P</ab-kbd>
+  </ab-kbd-group>
+</template>
+```
+
+## Props
+
+No declared props.
+
+## Events
+
+None.
+
+## Slots
+
+| Name | Description |
+| --- | --- |
+| `default` | Key label (typically a single character or short word). |

package/.ai/ai_ref_AbKbdGroup.md

@@ -1,33 +1,33 @@
-# AbKbdGroup — AI Reference
-
-Visual grouping container for multiple `AbKbd` chips — typically used to render keyboard chords / shortcuts.
-
-## Installation
-
-Globally registered by the plugin.
-
-## Usage
-
-```vue
-<template>
-  <ab-kbd-group>
-    <ab-kbd>Ctrl</ab-kbd>
-    <ab-kbd>Alt</ab-kbd>
-    <ab-kbd>Del</ab-kbd>
-  </ab-kbd-group>
-</template>
-```
-
-## Props
-
-No declared props.
-
-## Events
-
-None.
-
-## Slots
-
-| Name | Description |
-| --- | --- |
-| `default` | One or more `AbKbd` children. |
+# AbKbdGroup — AI Reference
+
+Visual grouping container for multiple `AbKbd` chips — typically used to render keyboard chords / shortcuts.
+
+## Installation
+
+Globally registered by the plugin.
+
+## Usage
+
+```vue
+<template>
+  <ab-kbd-group>
+    <ab-kbd>Ctrl</ab-kbd>
+    <ab-kbd>Alt</ab-kbd>
+    <ab-kbd>Del</ab-kbd>
+  </ab-kbd-group>
+</template>
+```
+
+## Props
+
+No declared props.
+
+## Events
+
+None.
+
+## Slots
+
+| Name | Description |
+| --- | --- |
+| `default` | One or more `AbKbd` children. |