vueless 0.0.623 → 0.0.625

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vueless",
-  "version": "0.0.623",
+  "version": "0.0.625",
   "license": "MIT",
   "description": "Vue Styleless UI Component Library, powered by Tailwind CSS.",
   "keywords": [

package/ui.button/config.ts

@@ -64,8 +64,8 @@ export default /*tw*/ {
       {
         color: ["grayscale", "white"],
         class: `
-          focus:ring-gray-500/10        dark:focus:ring-gray-400/10
-          focus-within:ring-gray-500/10 dark:focus-within:ring-gray-400/10
+          focus:ring-gray-700/15        dark:focus:ring-gray-500/15
+          focus-within:ring-gray-700/15 dark:focus-within:ring-gray-500/15
         `,
       },
       {
@@ -93,9 +93,9 @@ export default /*tw*/ {
         variant: "thirdary",
         class: `
           text-gray-900                              dark:text-gray-100
-          hover:text-gray-800  hover:bg-gray-800/10  dark:hover:text-gray-200  dark:hover:bg-gray-200/10
-          focus:text-gray-800  focus:bg-gray-800/10  dark:focus:text-gray-200  dark:focus:bg-gray-200/10
-          active:text-gray-700 active:bg-gray-700/15 dark:active:text-gray-300 dark:active:bg-gray-300/15
+          hover:text-gray-800  hover:bg-gray-800/5   dark:hover:text-gray-200  dark:hover:bg-gray-200/5
+          focus:text-gray-800  focus:bg-gray-800/5   dark:focus:text-gray-200  dark:focus:bg-gray-200/5
+          active:text-gray-700 active:bg-gray-700/10 dark:active:text-gray-300 dark:active:bg-gray-300/10
         `,
       },
       {
@@ -127,8 +127,8 @@ export default /*tw*/ {
         variant: "thirdary",
         class: "hover:bg-white/10 focus:bg-white/10 active:bg-white/15",
       },
-      { filled: true, variant: "thirdary", class: "bg-{color}-600/10 dark:bg-{color}-400/10" },
-      { filled: true, variant: "thirdary", color: ["grayscale", "white"], class: "bg-gray-900/5 dark:bg-gray-200/5" },
+      { filled: true, variant: "thirdary", class: "bg-{color}-700/10 dark:bg-{color}-500/10" },
+      { filled: true, variant: "thirdary", color: ["grayscale", "white"], class: "bg-gray-800/5 dark:bg-gray-200/5" },
       { rightIcon: true, size: "2xs", class: "pr-1" },
       { rightIcon: true, size: "xs", class: "pr-2" },
       { rightIcon: true, size: "sm", class: "pr-3" },

package/ui.button-toggle-item/UToggleItem.vue

@@ -101,7 +101,7 @@ const { toggleButtonAttrs, toggleButtonActiveAttrs, toggleInputAttrs } = useUI<C
   <UButton
     :label="label"
     tabindex="0"
-    :color="isSelected ? 'brand' : 'grayscale'"
+    color="brand"
     :for="elementId"
     :filled="getToggleSplit()"
     :size="getToggleSize()"

package/ui.button-toggle-item/config.ts

@@ -1,13 +1,14 @@
 export default /*tw*/ {
   toggleButton: {
-    base: "{UButton} font-normal",
+    base: "{UButton} font-normal text-gray-900",
     defaults: {
       variant: "thirdary",
     },
   },
   toggleButtonActive: {
-    base: "{UButton} {>toggleButton} !bg-{color}-800/15",
+    base: "{UButton} font-normal !bg-{color}-600/15",
     defaults: {
+      variant: "thirdary",
       filled: true,
     },
   },

package/ui.form-select/USelect.vue

@@ -493,9 +493,9 @@ const {
       >
         <!--
           @slot Use it to add something after caret.
-          @binding {object} scope-props
+          @binding {object} option
         -->
-        <slot :scope-props="props" name="after-caret" />
+        <slot :option="localValue" name="after-caret" />
       </div>
 
       <div
@@ -547,9 +547,9 @@ const {
       >
         <!--
           @slot Use it to add something before caret.
-          @binding {object} scope-props
+          @binding {object} option
         -->
-        <slot :scope-props="props" name="before-caret" />
+        <slot :option="localValue" name="before-caret" />
       </div>
 
       <div ref="innerWrapperRef" v-bind="innerWrapperAttrs">
@@ -573,7 +573,7 @@ const {
         </span>
 
         <div v-if="multiple && localValue?.length" v-bind="selectedLabelsAttrs">
-          <span
+          <div
             v-for="item in localValue as Option[]"
             :key="String(item[valueKey])"
             v-bind="selectedLabelAttrs"
@@ -581,21 +581,22 @@ const {
             <!--
               @slot Use it to customise selected value label.
               @binding {string} selected-label
+              @binding {object} option
             -->
             <slot
               name="selected-label"
               :selected-label="getOptionLabel(item)"
               :value="item[valueKey]"
-              :raw-option="item"
+              :option="item"
             >
               {{ getOptionLabel(item) }}
             </slot>
 
             <!--
               @slot Use it to add something after selected value label.
-              @binding {object} scope-props
+              @binding {object} option
             -->
-            <slot :scope-props="props" name="selected-label-after" />
+            <slot :option="item" name="selected-label-after" />
 
             <div
               v-if="!disabled"
@@ -618,7 +619,7 @@ const {
                 />
               </slot>
             </div>
-          </span>
+          </div>
         </div>
 
         <div v-bind="searchAttrs">
@@ -652,20 +653,22 @@ const {
             @slot Use it to add selected value label.
             @binding {string} selected-label
             @binding {string} value
+            @binding {object} option
           -->
           <slot
             name="selected-label"
             :selected-label="selectedLabel"
             :value="(localValue as Option)[valueKey]"
+            :option="localValue"
           >
             {{ selectedLabel }}
           </slot>
 
           <!--
             @slot Use it to add something after selected value label.
-            @binding {object} scope-props
+            @binding {object} option
           -->
-          <slot :scope-props="props" name="selected-label-after" />
+          <slot :option="localValue" name="selected-label-after" />
         </span>
 
         <div

package/web-types.json

@@ -1,7 +1,7 @@
 {
   "framework": "vue",
   "name": "vueless",
-  "version": "0.0.623",
+  "version": "0.0.625",
   "contributions": {
     "html": {
       "description-markup": "markdown",
@@ -10119,7 +10119,7 @@
               "bindings": [
                 {
                   "type": "object",
-                  "name": "scope-props"
+                  "name": "option"
                 }
               ]
             },
@@ -10156,7 +10156,7 @@
               "bindings": [
                 {
                   "type": "object",
-                  "name": "scope-props"
+                  "name": "option"
                 }
               ]
             },
@@ -10187,6 +10187,10 @@
                 {
                   "type": "string",
                   "name": "value"
+                },
+                {
+                  "type": "object",
+                  "name": "option"
                 }
               ]
             },
@@ -10197,7 +10201,7 @@
               "bindings": [
                 {
                   "type": "object",
-                  "name": "scope-props"
+                  "name": "option"
                 }
               ]
             },