vueless 0.0.430 → 0.0.432

package/README.md

@@ -26,16 +26,7 @@ const vueless = createVueless();
 createApp(App).use(vueless).mount('#app');
 ```
 
-3. Create `vueless.config.js` at the root of the project.
-
-```javascript
-export default {
-  color: {},
-  component: {},
-};
-```
-
-4. Add TailwindCSS preset.
+3. Add TailwindCSS preset.
 
 ```javascript
 import { vuelessPreset } from "vueless/preset.tailwind";
@@ -46,7 +37,7 @@ export default {
 };
 ```
 
-5. Add Vite plugins.
+4. Add Vite plugins.
 
 ```javascript
 import { Vueless, VuelessUnpluginComponents } from "@vueless/plugin-vite";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vueless",
-  "version": "0.0.430",
+  "version": "0.0.432",
   "license": "MIT",
   "description": "Vue Styleless UI Component Library, powered by Tailwind CSS.",
   "keywords": [
@@ -53,9 +53,9 @@
     "@release-it/bumper": "^6.0.1",
     "@vitejs/plugin-vue": "^5.0.5",
     "@vue/eslint-config-prettier": "^9.0.0",
-    "@vueless/plugin-vite": "^0.0.73",
-    "@vueless/storybook": "^0.0.34",
-    "@vueless/web-types": "^0.0.15",
+    "@vueless/plugin-vite": "^0.0.74",
+    "@vueless/storybook": "^0.0.35",
+    "@vueless/web-types": "^0.0.17",
     "autoprefixer": "^10.4.19",
     "cssnano": "^6.1.2",
     "eslint": "^8.55.0",

package/ui.data-table/UTable.vue

@@ -56,10 +56,10 @@
           <template v-if="hasSlotContent($slots[`header-${column.key}`])">
             <!--
               @slot Use it to customise needed header cell.
-              @binding {string} name
-              @binding {number} column
+              @binding {object} column
+              @binding {number} index
             -->
-            <slot :name="`header-${column.key}`" :column="column" />
+            <slot :name="`header-${column.key}`" :column="column" :index="index" />
           </template>
 
           <template v-else>
@@ -68,10 +68,10 @@
 
           <!--
             @slot Use it to add something after the needed header cell.
-            @binding {string} name
-            @binding {number} column
+            @binding {object} column
+            @binding {number} index
           -->
-          <slot :name="`header-${column.key}-after`" :column="column" />
+          <slot :name="`header-${column.key}-after`" :column="column" :index="index" />
         </div>
       </template>
 
@@ -125,13 +125,14 @@
             >
               <!--
                 @slot Use it to customise needed header cell.
-                @binding {string} name
-                @binding {number} column
+                @binding {object} column
+                @binding {number} index
               -->
               <slot
                 v-if="hasSlotContent($slots[`header-${column.key}`])"
                 :name="`header-${column.key}`"
                 :column="column"
+                :index="index"
               />
 
               <template v-else>
@@ -140,10 +141,10 @@
 
               <!--
                 @slot Use it to add something after the needed header cell.
-                @binding {string} name
-                @binding {number} column
+                @binding {object} column
+                @binding {number} index
               -->
-              <slot :name="`header-${column.key}-after`" :column="column" />
+              <slot :name="`header-${column.key}-after`" :column="column" :index="index" />
             </th>
           </tr>
 
@@ -192,11 +193,16 @@
               >
                 <!--
                   @slot Use it to customise needed table cell.
-                  @binding {string} name
                   @binding {string} value
                   @binding {object} row
+                  @binding {number} index
                 -->
-                <slot :name="`cell-${key}`" :value="slotValues.value" :row="slotValues.row" />
+                <slot
+                  :name="`cell-${key}`"
+                  :value="slotValues.value"
+                  :row="slotValues.row"
+                  :index="index"
+                />
               </template>
               <template #nested-content>
                 <!--

package/ui.data-table/storybook/stories.js

@@ -280,9 +280,6 @@ RowAndCellClasses.args = {
 export const Empty = EmptyTemplate.bind({});
 Empty.args = {};
 
-export const Filters = EmptyTemplate.bind({});
-Filters.args = { filters: true };
-
 export const Selectable = DefaultTemplate.bind({});
 Selectable.args = { selectable: true };
 

package/ui.image-avatar/UAvatar.vue

@@ -90,7 +90,7 @@ const props = defineProps({
 
   /**
    * Avatar corner rounding.
-   * @values none, sm, md, lg, full
+   * @values dynamic, none, sm, md, lg, full
    */
   rounded: {
     type: String,

package/ui.image-avatar/config.js

@@ -21,6 +21,7 @@ export default /*tw*/ {
         "3xl": "size-20 text-5xl",
       },
       rounded: {
+        dynamic: "rounded-dynamic",
         none: "rounded-none",
         sm: "rounded",
         md: "rounded-md",
@@ -36,7 +37,7 @@ export default /*tw*/ {
   placeholderIcon: "{UIcon}",
   defaults: {
     color: "grayscale",
-    rounded: "md",
+    rounded: "dynamic",
     size: "md",
     bordered: false,
     /* icons */

package/utils/utilStorybook.js

@@ -96,6 +96,8 @@ export function getArgTypes(componentName) {
     const bindings = [];
 
     slot.bindings?.forEach((binding) => {
+      if (binding.name === "name") return;
+
       const description = binding.description ? ` (${binding.description})` : "";
 
       bindings.push(`${binding.name}: ${binding.type}${description}`);

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "vueless",
-  "version": "0.0.430",
+  "version": "0.0.432",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -376,9 +376,9 @@
               "description": "Avatar corner rounding.",
               "value": {
                 "kind": "expression",
-                "type": "'none' | 'sm' | 'md' | 'lg' | 'full'"
+                "type": "'dynamic' | 'none' | 'sm' | 'md' | 'lg' | 'full'"
               },
-              "default": "md"
+              "default": "dynamic"
             },
             {
               "name": "bordered",
@@ -634,6 +634,11 @@
               ]
             }
           ],
+          "exposes": [
+            {
+              "name": "wrapperRef"
+            }
+          ],
           "source": {
             "module": "./src/ui.text-badge/UBadge.vue",
             "symbol": "default"
@@ -878,6 +883,11 @@
               ]
             }
           ],
+          "exposes": [
+            {
+              "name": "buttonRef"
+            }
+          ],
           "source": {
             "module": "./src/ui.button/UButton.vue",
             "symbol": "default"
@@ -1062,6 +1072,11 @@
               ]
             }
           ],
+          "exposes": [
+            {
+              "name": "wrapperRef"
+            }
+          ],
           "source": {
             "module": "./src/ui.form-calendar/UCalendar.vue",
             "symbol": "default"
@@ -2579,6 +2594,17 @@
               "description": "Use it add something after the date."
             }
           ],
+          "exposes": [
+            {
+              "name": "calendarRef"
+            },
+            {
+              "name": "userFormatDate"
+            },
+            {
+              "name": "formattedDate"
+            }
+          ],
           "source": {
             "module": "./src/ui.form-date-picker/UDatePicker.vue",
             "symbol": "default"
@@ -3806,6 +3832,29 @@
               "description": "Use it to add something instead of empty state."
             }
           ],
+          "exposes": [
+            {
+              "name": "pointerSet"
+            },
+            {
+              "name": "pointerBackward"
+            },
+            {
+              "name": "pointerForward"
+            },
+            {
+              "name": "pointerReset"
+            },
+            {
+              "name": "addPointerElement"
+            },
+            {
+              "name": "optionsRef"
+            },
+            {
+              "name": "wrapperRef"
+            }
+          ],
           "source": {
             "module": "./src/ui.dropdown-list/UDropdownList.vue",
             "symbol": "default"
@@ -4651,6 +4700,17 @@
               "description": "Use it to add something after the text."
             }
           ],
+          "exposes": [
+            {
+              "name": "inputRef",
+              "description": "A reference to the input element for direct DOM manipulation.",
+              "properties": [
+                {
+                  "type": "HTMLElement"
+                }
+              ]
+            }
+          ],
           "source": {
             "module": "./src/ui.form-input/UInput.vue",
             "symbol": "default"
@@ -5049,6 +5109,17 @@
               "description": "Use it to add something right."
             }
           ],
+          "exposes": [
+            {
+              "name": "input"
+            },
+            {
+              "name": "rawValue"
+            },
+            {
+              "name": "formattedValue"
+            }
+          ],
           "source": {
             "module": "./src/ui.form-input-money/UInputMoney.vue",
             "symbol": "default"
@@ -5568,6 +5639,11 @@
               "description": "Use it to add something after the text."
             }
           ],
+          "exposes": [
+            {
+              "name": "inputRef"
+            }
+          ],
           "source": {
             "module": "./src/ui.form-input-search/UInputSearch.vue",
             "symbol": "default"
@@ -5684,6 +5760,14 @@
               "description": "Use it to add something below the label content."
             }
           ],
+          "exposes": [
+            {
+              "name": "labelElement"
+            },
+            {
+              "name": "wrapperElement"
+            }
+          ],
           "source": {
             "module": "./src/ui.form-label/ULabel.vue",
             "symbol": "default"
@@ -5918,6 +6002,11 @@
               "description": "Use it to add something after the label."
             }
           ],
+          "exposes": [
+            {
+              "name": "wrapperRef"
+            }
+          ],
           "source": {
             "module": "./src/ui.button-link/ULink.vue",
             "symbol": "default"
@@ -7977,6 +8066,26 @@
               ]
             }
           ],
+          "exposes": [
+            {
+              "name": "dropdownListRef"
+            },
+            {
+              "name": "wrapperRef"
+            },
+            {
+              "name": "searchInputRef"
+            },
+            {
+              "name": "labelComponentRef"
+            },
+            {
+              "name": "leftSlotWrapperRef"
+            },
+            {
+              "name": "innerWrapperRef"
+            }
+          ],
           "source": {
             "module": "./src/ui.form-select/USelect.vue",
             "symbol": "default"
@@ -8314,12 +8423,15 @@
               "description": "Use it to customise needed header cell.",
               "bindings": [
                 {
-                  "type": "string",
                   "name": "name"
                 },
                 {
-                  "type": "number",
+                  "type": "object",
                   "name": "column"
+                },
+                {
+                  "type": "number",
+                  "name": "index"
                 }
               ]
             },
@@ -8329,12 +8441,15 @@
               "description": "Use it to add something after the needed header cell.",
               "bindings": [
                 {
-                  "type": "string",
                   "name": "name"
                 },
                 {
-                  "type": "number",
+                  "type": "object",
                   "name": "column"
+                },
+                {
+                  "type": "number",
+                  "name": "index"
                 }
               ]
             },
@@ -8359,7 +8474,6 @@
               "description": "Use it to customise needed table cell.",
               "bindings": [
                 {
-                  "type": "string",
                   "name": "name"
                 },
                 {
@@ -8369,6 +8483,10 @@
                 {
                   "type": "object",
                   "name": "row"
+                },
+                {
+                  "type": "number",
+                  "name": "index"
                 }
               ]
             },
@@ -8403,6 +8521,11 @@
               ]
             }
           ],
+          "exposes": [
+            {
+              "name": "clearSelectedItems"
+            }
+          ],
           "source": {
             "module": "./src/ui.data-table/UTable.vue",
             "symbol": "default"
@@ -8866,6 +8989,11 @@
               "description": "Use it to add something after the text."
             }
           ],
+          "exposes": [
+            {
+              "name": "textareaRef"
+            }
+          ],
           "source": {
             "module": "./src/ui.form-textarea/UTextarea.vue",
             "symbol": "default"

package/assets/icons/archive.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 -960 960 960"><path d="m480.12-272.15 156.36-156.48-43.11-43.35L512.39-391v-188.8h-64.78V-391l-80.98-80.74-42.87 43.35 156.36 156.24ZM182.15-665.63v483.48h595.7v-483.48h-595.7Zm0 551.61q-28.35 0-48.24-19.89t-19.89-48.24v-520.39q0-11.32 3.6-21.93t10.55-19.57l57.03-76.03q9.13-12.2 23.25-19.17 14.12-6.98 29.77-6.98h482.8q15.41 0 29.53 6.98 14.12 6.97 23.25 19.17l58.27 76.03q6.71 8.96 10.43 19.57 3.72 10.61 3.72 21.93v520.39q0 28.35-19.96 48.24t-48.41 19.89h-595.7Zm21.07-618.07h552.56l-36.41-46H239.22l-36 46ZM480-423.89Z"/></svg>

package/assets/icons/expand_circle_down.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 -960 960 960"><path d="M480-346.22 658.02-524 610-570.78l-130 130-130-130L301.98-524 480-346.22Zm.03 272.2q-83.46 0-157.54-31.88-74.07-31.88-129.39-87.2-55.32-55.32-87.2-129.36-31.88-74.04-31.88-157.51 0-84.46 31.88-158.54 31.88-74.07 87.16-128.9 55.28-54.84 129.34-86.82 74.06-31.99 157.55-31.99 84.48 0 158.59 31.97 74.1 31.97 128.91 86.77 54.82 54.8 86.79 128.88 31.98 74.08 31.98 158.6 0 83.5-31.99 157.57-31.98 74.07-86.82 129.36-54.83 55.29-128.87 87.17-74.04 31.88-158.51 31.88Zm-.03-68.13q141.04 0 239.45-98.75 98.4-98.76 98.4-239.1 0-141.04-98.4-239.45-98.41-98.4-239.57-98.4-140.16 0-238.95 98.4-98.78 98.41-98.78 239.57 0 140.16 98.75 238.95 98.76 98.78 239.1 98.78ZM480-480Z"/></svg>

package/assets/icons/info.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 -960 960 960"><path d="M450.37-277.37h65.26V-520h-65.26v242.63ZM480-590.41q15.55 0 26.07-10.23 10.52-10.24 10.52-25.36 0-16.24-10.52-26.92-10.51-10.67-26.05-10.67-15.81 0-26.21 10.67-10.4 10.68-10.4 26.8 0 15.27 10.52 25.49 10.52 10.22 26.07 10.22Zm.3 516.39q-84.2 0-158.04-31.88-73.84-31.88-129.16-87.2-55.32-55.32-87.2-129.2-31.88-73.88-31.88-158.17 0-84.28 31.88-158.2 31.88-73.91 87.16-128.74 55.28-54.84 129.18-86.82 73.9-31.99 158.21-31.99 84.3 0 158.25 31.97 73.94 31.97 128.75 86.77 54.82 54.8 86.79 128.88 31.98 74.08 31.98 158.33 0 84.24-31.99 158.07-31.98 73.84-86.82 128.95-54.83 55.1-128.87 87.17Q564.5-74.02 480.3-74.02Zm.2-68.13q140.54 0 238.95-98.75 98.4-98.76 98.4-239.6 0-140.54-98.22-238.95-98.21-98.4-239.75-98.4-140.16 0-238.95 98.22-98.78 98.21-98.78 239.75 0 140.16 98.75 238.95 98.76 98.78 239.6 98.78ZM480-480Z"/></svg>

package/assets/icons/person.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 -960 960 960"><path d="M479.95-484.11q-68.68 0-112.3-43.62-43.63-43.63-43.63-112.31t43.63-112.35q43.62-43.68 112.3-43.68t112.47 43.68q43.8 43.67 43.8 112.35 0 68.68-43.8 112.31-43.79 43.62-112.47 43.62Zm-325.93 333.2v-100.41q0-39.56 19.92-68.04 19.91-28.49 51.43-43.27 67.48-30.24 129.69-45.36 62.2-15.12 124.88-15.12 63.13 0 124.79 15.62 61.66 15.62 128.82 45.05 32.88 14.6 52.78 43 19.89 28.4 19.89 68.06v100.47h-652.2Zm68.13-68.13h515.7v-31.37q0-15.85-9.5-30.22-9.5-14.38-23.5-21.3-63.05-30.29-115.45-41.55-52.4-11.26-109.52-11.26-56.64 0-110.28 11.26t-115.35 41.51q-14.1 6.93-23.1 21.31-9 14.39-9 30.25v31.37Zm257.8-333.2q38.09 0 63-24.86 24.9-24.87 24.9-62.98 0-38.21-24.86-63.03-24.85-24.82-62.94-24.82-38.09 0-63 24.83-24.9 24.84-24.9 62.9 0 38.17 24.86 63.06 24.85 24.9 62.94 24.9Zm.05-87.85Zm0 421.05Z"/></svg>

package/assets/icons/swap_vert.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 -960 960 960"><path d="M318.46-449.76v-306.67L201.76-639.5l-47.74-47.74 198.74-198.98L551.5-687.24l-47.74 47.74-116.93-116.93v306.67h-68.37ZM607.48-74.02 408.74-272.76l47.74-47.74 116.69 116.7v-306.68h68.37v306.68l116.94-116.7 47.74 47.74L607.48-74.02Z"/></svg>

package/assets/icons/timer.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="48" height="48" viewBox="0 -960 960 960"><path d="M354.5-860v-65.5h251v65.5h-251Zm92.87 452.02h65.26v-230.48h-65.26v230.48ZM479.94-70q-75.49 0-142.05-28.94-66.56-28.94-116.36-78.7-49.79-49.75-78.65-116.29-28.86-66.54-28.86-142.01 0-75.47 28.88-142.04 28.88-66.56 78.68-116.4 49.79-49.84 116.35-78.83Q404.5-802.2 480-802.2q67.48 0 127.08 22.5 59.59 22.5 105.83 62.74l53.16-53.15 46.3 46.07-53.15 53.15q36.24 40.48 61.62 97.96 25.38 57.47 25.38 136.95 0 75.52-28.96 142.11-28.95 66.59-78.78 116.31T622.04-98.92Q555.43-70 479.94-70Zm.02-68.37q124.32 0 211.11-86.62 86.78-86.62 86.78-210.95 0-124.32-86.74-211.1-86.75-86.79-211.07-86.79t-211.11 86.75q-86.78 86.74-86.78 211.06 0 124.32 86.74 210.99 86.75 86.66 211.07 86.66Zm.04-296.61Z"/></svg>