eco-vue-js 0.10.12 → 0.10.14

package/dist/components/FilterWrapper/WFilterWrapper.vue.js

@@ -6,7 +6,7 @@ import { Modal } from '../../utils/Modal.js';
 import { SemanticType } from '../../utils/SemanticType.js';
 import { throttle } from '../../utils/utils.js';
 
-const _hoisted_1 = { class: "flex flex-col pb-16" };
+const _hoisted_1 = { class: "pb-16" };
 const _hoisted_2 = { class: "-px--inner-margin grid grid-cols-2 gap-4" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "WFilterWrapper",
@@ -55,32 +55,34 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [
-        _cache[1] || (_cache[1] = createElementVNode("div", { class: "text-accent -h--header-height -mx--inner-margin flex items-center text-2xl font-semibold" }, " Filters ", -1)),
+        _cache[2] || (_cache[2] = createElementVNode("div", { class: "text-accent -h--header-height -mx--inner-margin flex items-center text-xl font-semibold" }, " Filters ", -1)),
         createElementVNode("div", null, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.$slots.default?.(), (slot, index) => {
-            return openBlock(), createBlock(resolveDynamicComponent(slot), {
-              key: index,
-              "is-open": index === selectedIndex.value,
-              onToggle: ($event) => unref(setSelectedIndex)(index),
-              "onUpdate:hasChanges": ($event) => hasChangesMap.value[index.toString()] = $event
-            }, null, 40, ["is-open", "onToggle", "onUpdate:hasChanges"]);
-          }), 128))
-        ]),
-        _cache[2] || (_cache[2] = createElementVNode("div", { class: "-mx--inner-margin my-8 h-0.5 rounded bg-gray-400" }, null, -1)),
-        createElementVNode("div", _hoisted_2, [
-          renderSlot(_ctx.$slots, "bottom"),
-          createVNode(_sfc_main$1, {
-            "semantic-type": unref(SemanticType).SECONDARY,
-            disabled: !changesCount.value,
-            class: "col-start-2",
-            onClick: openConfirmReset
-          }, {
-            default: withCtx(() => [
-              createVNode(unref(IconFilterRemove)),
-              _cache[0] || (_cache[0] = createTextVNode(" Reset Filters "))
-            ]),
-            _: 1
-          }, 8, ["semantic-type", "disabled"])
+          createElementVNode("div", null, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.$slots.default?.(), (slot, index) => {
+              return openBlock(), createBlock(resolveDynamicComponent(slot), {
+                key: index,
+                "is-open": index === selectedIndex.value,
+                onToggle: ($event) => unref(setSelectedIndex)(index),
+                "onUpdate:hasChanges": ($event) => hasChangesMap.value[index.toString()] = $event
+              }, null, 40, ["is-open", "onToggle", "onUpdate:hasChanges"]);
+            }), 128))
+          ]),
+          _cache[1] || (_cache[1] = createElementVNode("div", { class: "-mx--inner-margin my-8 h-0.5 rounded bg-gray-400" }, null, -1)),
+          createElementVNode("div", _hoisted_2, [
+            renderSlot(_ctx.$slots, "bottom"),
+            createVNode(_sfc_main$1, {
+              "semantic-type": unref(SemanticType).SECONDARY,
+              disabled: !changesCount.value,
+              class: "col-start-2",
+              onClick: openConfirmReset
+            }, {
+              default: withCtx(() => [
+                createVNode(unref(IconFilterRemove)),
+                _cache[0] || (_cache[0] = createTextVNode(" Reset Filters "))
+              ]),
+              _: 1
+            }, 8, ["semantic-type", "disabled"])
+          ])
         ])
       ]);
     };

package/dist/components/HeaderBar/WHeaderBar.vue.d.ts

@@ -11,6 +11,7 @@ declare function __VLS_template(): {
         search?(_: {}): any;
     };
     refs: {
+        element: HTMLDivElement;
         input: import('vue').ShallowUnwrapRef<{
             focus: () => void;
             blur: () => void;
@@ -27,6 +28,7 @@ declare const __VLS_component: import('vue').DefineComponent<__VLS_Props, {}, {}
     title: string;
     search: string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    element: HTMLDivElement;
     input: import('vue').ShallowUnwrapRef<{
         focus: () => void;
         blur: () => void;

package/dist/components/HeaderBar/WHeaderBar.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WHeaderBar.vue.d.ts","sourceRoot":"","sources":["../../../src/components/HeaderBar/WHeaderBar.vue"],"names":[],"mappings":"AAmFA;AAqKA,KAAK,WAAW,GAAG;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAC;AA4DJ,iBAAS,cAAc;WA2LT,OAAO,IAA6B;;uBAbvB,GAAG;wBACD,GAAG;wBACH,GAAG;;;;;;;;;EAgB/B;AAqBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;WArRT,MAAM;YACL,MAAM;;;;;;kBA8RjB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"WHeaderBar.vue.d.ts","sourceRoot":"","sources":["../../../src/components/HeaderBar/WHeaderBar.vue"],"names":[],"mappings":"AAsFA;AA2KA,KAAK,WAAW,GAAG;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,aAAa,CAAC,EAAE,OAAO,CAAA;CACxB,CAAC;AA+DJ,iBAAS,cAAc;WA+LT,OAAO,IAA6B;;uBAdvB,GAAG;wBACD,GAAG;wBACH,GAAG;;;;;;;;;;EAiB/B;AAqBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;WA5RT,MAAM;YACL,MAAM;;;;;;;kBAqSjB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/HeaderBar/WHeaderBar.vue.js

@@ -3,10 +3,13 @@ import _sfc_main$2 from '../Input/WInput.vue.js';
 import _sfc_main$1 from '../Input/WInputSuggest.vue.js';
 import IconSearch from '../../assets/icons/sax/IconSearch.svg.js';
 import { useIsMobile } from '../../utils/mobile.js';
-import { useHeaderPadding } from './use/useHeaderPadding.js';
+import { useHeader } from './use/useHeader.js';
 
-const _hoisted_1 = { class: "fixed inset-x-0 top-0 z-10 flex h-[3.75rem] print:hidden" };
-const _hoisted_2 = { class: "text-accent flex-1 truncate text-xl font-semibold sm:text-3xl" };
+const _hoisted_1 = {
+  ref: "element",
+  class: "-h--header-height fixed inset-x-0 top-0 z-10 flex print:hidden"
+};
+const _hoisted_2 = { class: "text-accent sm:text-2.5xl flex-1 truncate text-xl font-semibold" };
 const _hoisted_3 = { class: "w-hover-circle relative" };
 const _hoisted_4 = {
   key: 0,
@@ -23,7 +26,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   setup(__props) {
     const props = __props;
     const { isMobile } = useIsMobile();
-    const { headerPadding } = useHeaderPadding();
+    const { headerPadding, updateHeaderHeight } = useHeader();
+    const elementRef = useTemplateRef("element");
     const inputRef = useTemplateRef("input");
     const isTransparent = ref(false);
     const isSearchVisible = ref(false);
@@ -44,6 +48,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         isTransparent.value = true;
         timeout = void 0;
       }, 1500);
+      updateHeaderHeight(elementRef.value?.offsetHeight ?? 0);
     });
     onBeforeUnmount(() => {
       if (!timeout) return;
@@ -54,7 +59,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return openBlock(), createElementBlock("div", _hoisted_1, [
         (openBlock(), createElementBlock("div", {
           key: unref(headerPadding),
-          class: normalizeClass(["bg-default dark:bg-default-dark supports-backdrop:backdrop-blur fixed inset-x-0 top-0 h-[calc(3.75rem+var(--header-height-padding))] print:hidden", {
+          class: normalizeClass(["bg-default dark:bg-default-dark supports-backdrop:backdrop-blur fixed inset-x-0 top-0 h-[calc(var(--header-height)+var(--header-height-padding))] print:hidden", {
             "supports-backdrop:bg-opacity-40 supports-backdrop:dark:bg-opacity-60": isTransparent.value
           }]),
           style: normalizeStyle({ "--header-height-padding": unref(headerPadding) + "px" })
@@ -123,7 +128,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         ], 512)), [
           [vShow, isSearchVisible.value || _ctx.search]
         ]) : createCommentVNode("", true)
-      ]);
+      ], 512);
     };
   }
 });

package/dist/components/HeaderBar/use/useHeader.d.ts

@@ -0,0 +1,7 @@
+export declare const useHeader: () => {
+    headerHeight: import('vue').Ref<number, number>;
+    headerPadding: import('vue').Ref<number, number>;
+    updateHeaderHeight: (value: number) => void;
+    updateHeaderPadding: (value: number) => void;
+};
+//# sourceMappingURL=useHeader.d.ts.map

package/dist/components/HeaderBar/use/useHeader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/HeaderBar/use/useHeader.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,SAAS;;;gCACe,MAAM;iCAIL,MAAM;CAU3C,CAAA"}

package/dist/components/HeaderBar/use/{useHeaderPadding.js → useHeader.js}

@@ -1,14 +1,20 @@
 import { ref } from 'vue';
 
+const headerHeight = ref(0);
 const headerPadding = ref(0);
-const useHeaderPadding = () => {
+const useHeader = () => {
+  const updateHeaderHeight = (value) => {
+    headerHeight.value = value;
+  };
   const updateHeaderPadding = (value) => {
     headerPadding.value = value;
   };
   return {
+    headerHeight,
     headerPadding,
+    updateHeaderHeight,
     updateHeaderPadding
   };
 };
 
-export { useHeaderPadding };
+export { useHeader };

package/dist/components/InfiniteList/WInfiniteListWrapper.vue.js

@@ -1,5 +1,5 @@
 import { defineComponent, watch, onUnmounted, createElementBlock, openBlock, Fragment, createElementVNode, renderSlot, normalizeClass, unref, normalizeProps, guardReactiveProps } from 'vue';
-import { useHeaderPadding } from '../HeaderBar/use/useHeaderPadding.js';
+import { useHeader } from '../HeaderBar/use/useHeader.js';
 import { useInfiniteListHeader } from './use/useInfiniteListHeader.js';
 
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -10,8 +10,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   },
   setup(__props) {
     const props = __props;
-    const { updateHeaderPadding } = useHeaderPadding();
-    const { indicator, header, headerTop, headerHeight, isIntersecting, updateHeader } = useInfiniteListHeader(props.scrollingElement, props.initIsIntersecting);
+    const { updateHeaderPadding, headerHeight: headerElementHeight } = useHeader();
+    const { indicator, header, headerTop, headerHeight, isIntersecting, updateHeader } = useInfiniteListHeader(headerElementHeight, props.scrollingElement, props.initIsIntersecting);
     const updateHeaderHeight = () => {
       if (!isIntersecting.value && headerHeight.value) {
         updateHeader();
@@ -33,7 +33,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         createElementVNode("div", {
           ref_key: "header",
           ref: header,
-          class: normalizeClass(["sticky top-[var(--header-height)]", {
+          class: normalizeClass(["-top--header-height sticky", {
             "z-20": !unref(isIntersecting),
             "z-[2]": unref(isIntersecting)
           }])

package/dist/components/InfiniteList/use/useInfiniteListHeader.d.ts

@@ -1,9 +1,10 @@
-export declare const useInfiniteListHeader: (scrollingElement?: Element | null, initIsIntersecting?: boolean) => {
-    indicator: import('vue').Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
-    header: import('vue').Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
-    headerHeight: import('vue').Ref<number, number>;
-    headerTop: import('vue').Ref<number, number>;
-    isIntersecting: import('vue').Ref<boolean, boolean>;
+import { Ref } from 'vue';
+export declare const useInfiniteListHeader: (headerElementHeight: Ref<number>, scrollingElement?: Element | null, initIsIntersecting?: boolean) => {
+    indicator: Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+    header: Ref<HTMLDivElement | undefined, HTMLDivElement | undefined>;
+    headerHeight: Ref<number, number>;
+    headerTop: Ref<number, number>;
+    isIntersecting: Ref<boolean, boolean>;
     updateHeader: () => void;
 };
 //# sourceMappingURL=useInfiniteListHeader.d.ts.map

package/dist/components/InfiniteList/use/useInfiniteListHeader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useInfiniteListHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/InfiniteList/use/useInfiniteListHeader.ts"],"names":[],"mappings":"AAYA,eAAO,MAAM,qBAAqB,sBAAsB,OAAO,GAAG,IAAI;;;;;;;CAsDrE,CAAA"}
+{"version":3,"file":"useInfiniteListHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/InfiniteList/use/useInfiniteListHeader.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,GAAG,EAAkC,MAAM,KAAK,CAAA;AAI7D,eAAO,MAAM,qBAAqB,wBAAyB,GAAG,CAAC,MAAM,CAAC,qBAAoB,OAAO,GAAG,IAAI;;;;;;;CA0DvG,CAAA"}

package/dist/components/InfiniteList/use/useInfiniteListHeader.js

@@ -1,13 +1,7 @@
 import { ref, onMounted, onBeforeUnmount } from 'vue';
 import { isClientSide } from '../../../utils/utils.js';
 
-const headerElementHeight = 60;
-const observerOptions = {
-  root: null,
-  rootMargin: `-${headerElementHeight}px 100% 0px 0px`,
-  threshold: 1
-};
-const useInfiniteListHeader = (scrollingElement = document.scrollingElement, initIsIntersecting = true) => {
+const useInfiniteListHeader = (headerElementHeight, scrollingElement = document.scrollingElement, initIsIntersecting = true) => {
   const indicator = ref();
   const header = ref();
   const headerHeight = ref(0);
@@ -30,13 +24,17 @@ const useInfiniteListHeader = (scrollingElement = document.scrollingElement, ini
     if (!header.value) return;
     const rect = header.value.getBoundingClientRect();
     headerHeight.value = rect.height;
-    headerTop.value = rect.top + (scrollingElement?.scrollTop ?? 0) - headerElementHeight;
+    headerTop.value = rect.top + (scrollingElement?.scrollTop ?? 0) - headerElementHeight.value;
   };
   onMounted(() => {
     if (!isClientSide) return;
     updateHeader();
     if (indicator.value) {
-      observer = new IntersectionObserver(observerCb, observerOptions);
+      observer = new IntersectionObserver(observerCb, {
+        root: null,
+        rootMargin: `-${headerElementHeight.value}px 100% 0px 0px`,
+        threshold: 1
+      });
       observer.observe(indicator.value);
     }
   });

package/dist/components/Input/WInput.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WInput.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Input/WInput.vue"],"names":[],"mappings":"AA0KA;AAwXA,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,SAAS,CAAA;yBAWtB,IAAI,SAAS,SAAS,wBACzB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,cAClD,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,iBAC5F,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;WAkkB1D,mBAAmB,CAAC,oCAAkE,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB;qBA3d7B,IAAI;oBAML,IAAI;MAqdgD,GAAG,IAAI;WACpE,GAAG;;uBA/CgB,GAAG;0BACA,GAAG;wBACL,GAAG;wBACF,GAAG;wBACH,GAAG;uBACJ,GAAG;wBACF,GAAG;uBACJ,GAAG;uBACH,GAAG;;;YA7gBzB,mBAAmB,SAAS,4CAAa,SAAS,GAAG,IAAI;YACzD,gBAAgB,SAAS,aAAa,GAAG,IAAI;YAC7C,aAAa,SAAS,aAAa,GAAG,IAAI;YAC1C,eAAe,SAAS,aAAa,GAAG,IAAI;YAC5C,iBAAiB,SAAS,aAAa,GAAG,IAAI;YAC9C,oBAAoB,SAAS,aAAa,GAAG,IAAI;YACjD,aAAa,GAAG,IAAI;YACpB,OAAO,SAAS,UAAU,GAAG,IAAI;YACjC,MAAM,SAAS,UAAU,GAAG,IAAI;YAChC,OAAO,SAAS,UAAU,GAAG,IAAI;YACjC,WAAW,SAAS,UAAU,GAAG,IAAI;YACrC,cAAc,SAAS,UAAU,GAAG,IAAI;YACxC,cAAc,SAAS,KAAK,GAAG,IAAI;YACnC,OAAO,GAAG,IAAI;;;;;YA4iBwB,OAAO,CAAC,OAAO,WAAW,CAAC;;AA5kBvE,wBA4kB4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
+{"version":3,"file":"WInput.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Input/WInput.vue"],"names":[],"mappings":"AAmLA;AAiYA,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,SAAS,CAAA;yBAWtB,IAAI,SAAS,SAAS,wBACzB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,cAClD,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,iBAC5F,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;WAykB1D,mBAAmB,CAAC,oCAAkE,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB;qBAle7B,IAAI;oBAML,IAAI;MA4dgD,GAAG,IAAI;WACpE,GAAG;;uBA/CgB,GAAG;0BACA,GAAG;wBACL,GAAG;wBACF,GAAG;wBACH,GAAG;uBACJ,GAAG;wBACF,GAAG;uBACJ,GAAG;uBACH,GAAG;;;YAphBzB,mBAAmB,SAAS,4CAAa,SAAS,GAAG,IAAI;YACzD,gBAAgB,SAAS,aAAa,GAAG,IAAI;YAC7C,aAAa,SAAS,aAAa,GAAG,IAAI;YAC1C,eAAe,SAAS,aAAa,GAAG,IAAI;YAC5C,iBAAiB,SAAS,aAAa,GAAG,IAAI;YAC9C,oBAAoB,SAAS,aAAa,GAAG,IAAI;YACjD,aAAa,GAAG,IAAI;YACpB,OAAO,SAAS,UAAU,GAAG,IAAI;YACjC,MAAM,SAAS,UAAU,GAAG,IAAI;YAChC,OAAO,SAAS,UAAU,GAAG,IAAI;YACjC,WAAW,SAAS,UAAU,GAAG,IAAI;YACrC,cAAc,SAAS,UAAU,GAAG,IAAI;YACxC,cAAc,SAAS,KAAK,GAAG,IAAI;YACnC,OAAO,GAAG,IAAI;;;;;YAmjBwB,OAAO,CAAC,OAAO,WAAW,CAAC;;AAnlBvE,wBAmlB4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}

package/dist/components/Input/WInput.vue.js

@@ -5,11 +5,6 @@ import { Notify } from '../../utils/Notify.js';
 import _sfc_main$2 from './components/InputActions.vue.js';
 
 const _hoisted_1 = { class: "flex flex-wrap gap-1" };
-const _hoisted_2 = {
-  key: 0,
-  class: "text-description flex h-full w-11 select-none items-center justify-center"
-};
-const _hoisted_3 = { class: "flex flex-wrap gap-1" };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   ...{ inheritAttrs: false },
   __name: "WInput",
@@ -217,7 +212,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           fn: withCtx(({ id, setFocused, focused }) => [
             createElementVNode("div", {
               class: normalizeClass(["bg-default dark:bg-default-dark relative grid min-h-[--w-input-height,2.75rem] grid-cols-[auto,1fr,auto] overflow-hidden rounded-[--w-input-rounded,0.75rem] border border-solid transition-colors duration-75", {
-                "focus-within:border-primary-default dark:focus-within:border-primary-dark": !_ctx.disabled && !_ctx.readonly && !_ctx.unclickable,
+                "focus-within:border-primary-default dark:focus-within:border-primary-dark focus-within:outline-primary-default/20 dark:focus-within:outline-primary-dark/20 focus-within:outline focus-within:outline-2": !_ctx.disabled && !_ctx.readonly && !_ctx.unclickable,
                 "cursor-text": !_ctx.disabled,
                 "border-negative dark:border-negative-dark": _ctx.errorMessage,
                 "border-gray-300 dark:border-gray-700": !_ctx.disabled,
@@ -227,20 +222,30 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               onMousedown: _cache[9] || (_cache[9] = withModifiers(() => {
               }, ["prevent"]))
             }, [
-              _ctx.icon ? (openBlock(), createElementBlock("div", _hoisted_2, [
-                (openBlock(), createBlock(resolveDynamicComponent(_ctx.icon), { class: "square-5" }))
-              ])) : createCommentVNode("", true),
+              _ctx.icon ? (openBlock(), createElementBlock("div", {
+                key: 0,
+                class: normalizeClass(["flex h-full w-[--w-input-height,2.75rem] select-none items-center justify-center", {
+                  "text-description": !focused,
+                  "text-primary-default dark:text-primary-dark": focused
+                }])
+              }, [
+                (openBlock(), createBlock(resolveDynamicComponent(_ctx.icon), { class: "square-[1.125em]" }))
+              ], 2)) : createCommentVNode("", true),
               createElementVNode("div", {
                 class: normalizeClass(["group/input col-start-2 grid grid-cols-1", {
-                  "py-1 first:pl-1 last:pr-1": _ctx.$slots.prefix
+                  "py-[--w-input-gap,0.25rem] first:pl-[--w-input-gap,0.25rem] last:pr-[--w-input-gap,0.25rem]": _ctx.$slots.prefix
                 }])
               }, [
-                createElementVNode("div", _hoisted_3, [
+                createElementVNode("div", {
+                  class: normalizeClass(["flex flex-wrap gap-[--w-input-gap,0.25rem]", {
+                    "[&:not(:has(.w-option-has-bg))]:-px--w-option-padding": !_ctx.icon
+                  }])
+                }, [
                   renderSlot(_ctx.$slots, "prefix"),
                   createElementVNode("div", {
                     class: normalizeClass(["flex flex-1 items-baseline", {
-                      "first:pl-0 group-first/input:pl-[--w-input-rounded,0.75rem] group-last/input:pr-[--w-input-rounded,0.75rem] [&:not(:first-child)]:pl-[--w-input-rounded,0.75rem]": !_ctx.hideInput,
-                      "absolute w-0 max-w-0 p-0": _ctx.hideInput
+                      "absolute w-0 max-w-0": _ctx.hideInput,
+                      "w-option-has-bg-input": _ctx.$slots.prefix
                     }])
                   }, [
                     renderSlot(_ctx.$slots, "before"),
@@ -248,11 +253,11 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       id,
                       ref: "input",
                       class: normalizeClass(["w-input max-w-full flex-1 appearance-none border-none bg-[inherit] font-normal outline-0 placeholder:text-gray-400 disabled:cursor-not-allowed disabled:opacity-80 dark:placeholder:text-gray-500", {
-                        "min-h-[--w-textarea-height,10rem] w-full py-3": _ctx.textarea,
+                        "-py--w-option-padding min-h-[--w-textarea-height,10rem] w-full": _ctx.textarea,
                         "resize-y": _ctx.resize && _ctx.textarea,
                         "resize-none": !_ctx.resize && _ctx.textarea,
-                        "h-[calc(var(--w-input-height,2.75rem)-0.125rem)]": !_ctx.textarea && !_ctx.$slots.suffix,
-                        "h-[calc(var(--w-input-height,2.75rem)-0.625rem)]": !_ctx.textarea && _ctx.$slots.suffix,
+                        "h-[calc(var(--w-input-height,2.75rem)-2px)]": !_ctx.textarea && !_ctx.$slots.suffix,
+                        "w-option": !_ctx.textarea && _ctx.$slots.prefix,
                         "font-mono": _ctx.mono,
                         "text-secure": _ctx.textSecure && !isSecureVisible.value,
                         "text-black-default dark:text-gray-200": !_ctx.disabled,
@@ -295,7 +300,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     }, null, 40, ["id", "class", "value", "placeholder", "type", "name", "disabled", "readonly", "autocomplete", "size", "step", "min", "max", "spellcheck", "onFocus", "onBlur"])),
                     renderSlot(_ctx.$slots, "after")
                   ], 2)
-                ])
+                ], 2)
               ], 2),
               createVNode(_sfc_main$2, {
                 "model-value": _ctx.modelValue,

package/dist/components/Input/WInputAsync.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WInputAsync.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Input/WInputAsync.vue"],"names":[],"mappings":"AAgHA;AA0SA,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,SAAS,CAAA;yBAgB3B,IAAI,SAAS,SAAS,wBACzB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,cAClD,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,iBAC5F,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;WAwc1D,mBAAmB,CAAC;;iLAAkE,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;uBAjDiB,GAAG;0BACA,GAAG;uBACN,GAAG;;cAjZzB,mBAAmB,SAAS,4CAAa,SAAS,KAAG,IAAI;;;;YAqcnB,OAAO,CAAC,OAAO,WAAW,CAAC;;AAldvE,wBAkd4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
+{"version":3,"file":"WInputAsync.vue.d.ts","sourceRoot":"","sources":["../../../src/components/Input/WInputAsync.vue"],"names":[],"mappings":"AAwFA;AAgRA,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,SAAS,CAAA;yBAc3B,IAAI,SAAS,SAAS,wBACzB,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,cAClD,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,iBAC5F,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;WA4Z1D,mBAAmB,CAAC;;iLAAkE,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;uBAhDiB,GAAG;0BACA,GAAG;uBACN,GAAG;;cAtWzB,mBAAmB,SAAS,4CAAa,SAAS,KAAG,IAAI;;;;YAyZnB,OAAO,CAAC,OAAO,WAAW,CAAC;;AAtavE,wBAsa4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}

package/dist/components/Input/WInputAsync.vue.js

@@ -1,8 +1,6 @@
-import { defineComponent, ref, useTemplateRef, computed, watch, toRef, createBlock, openBlock, mergeProps, createSlots, withCtx, renderSlot, createElementBlock, createCommentVNode, Fragment, withModifiers, normalizeClass, unref, createElementVNode, createVNode, Transition, normalizeStyle, nextTick } from 'vue';
+import { defineComponent, ref, useTemplateRef, computed, watch, toRef, createBlock, openBlock, mergeProps, createSlots, withCtx, renderSlot, createCommentVNode, normalizeClass, markRaw, unref, createElementVNode, createVNode, Transition, createElementBlock, normalizeStyle, nextTick } from 'vue';
+import _sfc_main$2 from '../Button/WButtonInput.vue.js';
 import _sfc_main$1 from './WInput.vue.js';
-import WSkeleton from '../Skeleton/WSkeleton.vue.js';
-import WSpinner from '../Spinner/WSpinner.vue.js';
-import _sfc_main$2 from '../Tooltip/WTooltip.vue.js';
 import IconCheck from '../../assets/icons/default/IconCheck.svg.js';
 import IconEdit from '../../assets/icons/sax/IconEdit.svg.js';
 import IconSlash from '../../assets/icons/sax/IconSlash.svg.js';
@@ -196,9 +194,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         "onKeypress:enter": handleEnterPress,
         onClick: open,
         onBlur: close,
-        onFocus: _cache[1] || (_cache[1] = ($event) => focused.value = true),
+        onFocus: _cache[0] || (_cache[0] = ($event) => focused.value = true),
         onPaste: handlePaste,
-        "onUpdate:modelValue": _cache[2] || (_cache[2] = ($event) => value.value = $event)
+        "onUpdate:modelValue": _cache[1] || (_cache[1] = ($event) => value.value = $event)
       }), createSlots({ _: 2 }, [
         _ctx.$slots.title ? {
           name: "title",
@@ -218,33 +216,18 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           name: "right",
           fn: withCtx(() => [
             renderSlot(_ctx.$slots, "right"),
-            !_ctx.readonly && !_ctx.hideButton ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-              _ctx.skeleton ? (openBlock(), createBlock(WSkeleton, {
-                key: 0,
-                class: "w-skeleton-w-11 w-skeleton-h-11 w-skeleton-rounded-lg"
-              })) : (openBlock(), createElementBlock("button", {
-                key: 1,
-                class: normalizeClass(["square-11 bg-default dark:bg-default-dark relative flex items-center justify-center rounded-lg border border-solid border-gray-200 dark:border-gray-800", {
-                  "cursor-not-allowed": _ctx.disabled,
-                  "cursor-progress": _ctx.loading,
-                  "w-ripple w-ripple-hover": !_ctx.disabled && !_ctx.loading,
-                  "bg-primary-default dark:bg-primary-dark text-default dark:text-default-dark": canSave.value,
-                  "text-description": !canSave.value
-                }]),
-                onClick: withModifiers(toggle, ["stop", "prevent"]),
-                onMousedown: _cache[0] || (_cache[0] = withModifiers(() => {
-                }, ["stop", "prevent"]))
-              }, [
-                _ctx.loading ? (openBlock(), createBlock(WSpinner, {
-                  key: 0,
-                  class: "w-spinner-size-5"
-                })) : canSave.value ? (openBlock(), createBlock(unref(IconCheck), { key: 1 })) : focused.value ? (openBlock(), createBlock(unref(IconSlash), { key: 2 })) : (openBlock(), createBlock(unref(IconEdit), { key: 3 })),
-                !_ctx.loading && focused.value ? (openBlock(), createBlock(_sfc_main$2, {
-                  key: 4,
-                  text: canSave.value ? "Save" : "Cancel"
-                }, null, 8, ["text"])) : createCommentVNode("", true)
-              ], 34))
-            ], 64)) : createCommentVNode("", true)
+            !_ctx.readonly && !_ctx.hideButton ? (openBlock(), createBlock(_sfc_main$2, {
+              key: 0,
+              icon: canSave.value ? markRaw(unref(IconCheck)) : focused.value ? markRaw(unref(IconSlash)) : markRaw(unref(IconEdit)),
+              "tooltip-text": !_ctx.loading && focused.value ? canSave.value ? "Save" : "Cancel" : void 0,
+              loading: _ctx.loading,
+              skeleton: _ctx.skeleton,
+              disabled: _ctx.disabled,
+              class: normalizeClass({
+                "bg-primary-default dark:bg-primary-dark text-default dark:text-default-dark": canSave.value
+              }),
+              onClick: toggle
+            }, null, 8, ["icon", "tooltip-text", "loading", "skeleton", "disabled", "class"])) : createCommentVNode("", true)
           ]),
           key: "2"
         } : void 0,

package/dist/components/Input/components/InputActions.vue.js

@@ -65,7 +65,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           onClick: _cache[2] || (_cache[2] = ($event) => _ctx.isSecureVisible ? _ctx.$emit("hide:secure", $event) : _ctx.$emit("show:secure", $event))
         }, null, 8, ["icon", "tooltip-text", "disabled"])) : createCommentVNode("", true),
         _ctx.loading ? (openBlock(), createElementBlock("div", _hoisted_2, [
-          createVNode(WSpinner, { class: "[--spinner-size:1.5rem]" })
+          createVNode(WSpinner, { class: "w-spinner-size-[1.125em]" })
         ])) : _ctx.$slots.default ? (openBlock(), createBlock(_sfc_main$1, {
           key: 5,
           disabled: _ctx.disabled,

package/dist/components/Input/components/InputActionsButton.vue.js

@@ -26,7 +26,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         onClick: _cache[1] || (_cache[1] = withModifiers(($event) => _ctx.$emit("click", $event), ["stop"]))
       }, [
         renderSlot(_ctx.$slots, "default", {}, () => [
-          (openBlock(), createBlock(resolveDynamicComponent(_ctx.icon), { class: "square-5" })),
+          (openBlock(), createBlock(resolveDynamicComponent(_ctx.icon), { class: "square-[1.125em]" })),
           _ctx.tooltipText && !_ctx.disabled ? (openBlock(), createBlock(_sfc_main$1, {
             key: 0,
             text: _ctx.tooltipText,

package/dist/components/List/WList.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WList.vue.d.ts","sourceRoot":"","sources":["../../../src/components/List/WList.vue"],"names":[],"mappings":"AAmPA;AAmYA,OAAO,KAAK,EAAC,aAAa,EAAE,SAAS,EAAE,cAAc,EAAE,cAAc,EAAE,OAAO,EAAE,UAAU,EAAE,aAAa,EAAC,MAAM,SAAS,CAAA;AACzH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,eAAe,CAAA;AAC5C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,aAAa,CAAA;AAWzC,OAAO,EAAC,QAAQ,EAAC,MAAM,eAAe,CAAA;yBAWrB,IAAI,SAAS,WAAW,EAAE,WAAW,EAAE,MAAM,SAAS,UAAU,CAAC,IAAI,EAAE,WAAW,CAAC,EAAE,WAAW,SAAS,SAAS,OAAO,EAAE,eAC9H,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,cAClD,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,iBAC5F,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;WA2tB1D,mBAAmB,CAAC;;;;;;gBAxtBlB,MAAM;gBACN,MAAM;oBACF,cAAc,CAAC,IAAI,CAAC;oBACpB,iBAAiB,CAAC,IAAI,EAAE,WAAW,CAAC;qBACnC,WAAW;uBACT,OAAO,CAAC,YAAY,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC;6BACxC,MAAM;wBACX,MAAM;eACf,aAAa,CAAC,WAAW,CAAC,EAAE;mBACxB,aAAa,CAAC,WAAW,CAAC,EAAE;eAChC,aAAa,CAAC,IAAI,CAAC,EAAE;yBACX,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO;oBAC5B,MAAM;2BACC,MAAM;6BACJ,CAAC,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM;oBACvD,OAAO;mBACR,MAAM;0BACC,cAAc,CAAC,MAAM,CAAC;sBAC1B,QAAQ;mBACX,OAAO;sBACJ,OAAO;mBACV,OAAO;qBACL,OAAO;yBACH,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,GAAG,SAAS;kBACzC,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,KAAK,OAAO;qBAC1B,WAAW;mBACb,SAAS,CAAC,MAAM,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;iBAC1C,CAAC,IAAI,EAAE,IAAI,KAAK,SAAS,CAAC,IAAI,CAAC;mBA6rBoD,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;;;YAjEiB,GAAG;2BACC,GAAG;;;;;YACP,GAAG;;cA3nBzB,cAAc,SAAS,QAAQ,KAAG,IAAI;;;;YA+rBA,OAAO,CAAC,OAAO,WAAW,CAAC;;AAruBvE,wBAquB4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}
+{"version":3,"file":"WList.vue.d.ts","sourceRoot":"","sources":["../../../src/components/List/WList.vue"],"names":[],"mappings":"AAkPA;AAkYA,OAAO,KAAK,EAAC,aAAa,EAAE,SAAS,EAAE,cAAc,EAAE,cAAc,EAAE,OAAO,EAAE,UAAU,EAAE,aAAa,EAAC,MAAM,SAAS,CAAA;AACzH,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,eAAe,CAAA;AAC5C,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,aAAa,CAAA;AAWzC,OAAO,EAAC,QAAQ,EAAC,MAAM,eAAe,CAAA;yBAWrB,IAAI,SAAS,WAAW,EAAE,WAAW,EAAE,MAAM,SAAS,UAAU,CAAC,IAAI,EAAE,WAAW,CAAC,EAAE,WAAW,SAAS,SAAS,OAAO,EAAE,eAC9H,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,cAClD,mBAAmB,CAAC,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,iBAC5F,WAAW,CAAC,OAAO,CAAC,OAAO,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC;WAytB1D,mBAAmB,CAAC;;;;;;gBAttBlB,MAAM;gBACN,MAAM;oBACF,cAAc,CAAC,IAAI,CAAC;oBACpB,iBAAiB,CAAC,IAAI,EAAE,WAAW,CAAC;qBACnC,WAAW;uBACT,OAAO,CAAC,YAAY,CAAC,iBAAiB,CAAC,IAAI,CAAC,CAAC,CAAC;6BACxC,MAAM;wBACX,MAAM;eACf,aAAa,CAAC,WAAW,CAAC,EAAE;mBACxB,aAAa,CAAC,WAAW,CAAC,EAAE;eAChC,aAAa,CAAC,IAAI,CAAC,EAAE;yBACX,CAAC,IAAI,EAAE,IAAI,KAAK,OAAO;oBAC5B,MAAM;2BACC,MAAM;6BACJ,CAAC,UAAU,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM;oBACvD,OAAO;mBACR,MAAM;0BACC,cAAc,CAAC,MAAM,CAAC;sBAC1B,QAAQ;mBACX,OAAO;sBACJ,OAAO;mBACV,OAAO;qBACL,OAAO;yBACH,CAAC,IAAI,EAAE,IAAI,KAAK,MAAM,GAAG,SAAS;kBACzC,CAAC,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,KAAK,OAAO;qBAC1B,WAAW;mBACb,SAAS,CAAC,MAAM,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC;iBAC1C,CAAC,IAAI,EAAE,IAAI,KAAK,SAAS,CAAC,IAAI,CAAC;mBA2rBoD,CAAC,4BAA2B;oBACzG,OAAO,KAAK,EAAE,gBAAgB,CAAC,EAAE,CAAC,GAAG,IAAI;WAClD,GAAG;;;;YAjEiB,GAAG;2BACC,GAAG;;;;;YACP,GAAG;;cAznBzB,cAAc,SAAS,QAAQ,KAAG,IAAI;;;;YA6rBA,OAAO,CAAC,OAAO,WAAW,CAAC;;AAnuBvE,wBAmuB4E;AAC5E,KAAK,mBAAmB,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAAG,GAAG,EAAE,CAAC"}

package/dist/components/List/WList.vue.js

@@ -202,8 +202,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             ]), 1032, ["title", "disable-message", "selected-count", "onClear:selection"]),
             !unref(isGrid) ? (openBlock(), createBlock(_sfc_main$7, {
               key: 0,
-              class: "sm-not:hidden mb-4",
-              "query-params": _ctx.queryParams,
+              class: "sm-not:hidden mb-[--w-list-gap,1rem]",
               "allow-select": allowSelect.value,
               "tooltip-text": _ctx.selectAllTextGetter(unref(selectAllValue) !== true, _ctx.count ?? listCount.value ?? 0),
               count: _ctx.count ?? listCount.value,
@@ -231,7 +230,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 }, 8, ["fields"])
               ]),
               _: 2
-            }, 1032, ["query-params", "allow-select", "tooltip-text", "count", "selection", "onUpdate:header"])) : createCommentVNode("", true)
+            }, 1032, ["allow-select", "tooltip-text", "count", "selection", "onUpdate:header"])) : createCommentVNode("", true)
           ]),
           default: withCtx(({ item, skeleton, setter, refetch, previous, index, position, value }) => [
             _ctx.groupBy && (index === 0 || !skeleton && (!previous || !_ctx.groupBy(item, previous))) ? renderSlot(_ctx.$slots, "group", {

package/dist/components/List/WListCard.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WListCard.vue.d.ts","sourceRoot":"","sources":["../../../src/components/List/WListCard.vue"],"names":[],"mappings":"AAuLA;AA+OA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,eAAe,CAAA;AAgB5C,KAAK,WAAW,GAAG;IACjB,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7B,MAAM,EAAE,OAAO,GAAG,SAAS,CAAA;IAC3B,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7B,SAAS,EAAE,OAAO,GAAG,SAAS,CAAA;IAC9B,SAAS,EAAE,MAAM,GAAG,SAAS,CAAA;IAC7B,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAA;IACpC,SAAS,EAAE,OAAO,GAAG,SAAS,CAAA;IAC9B,WAAW,EAAE,OAAO,GAAG,SAAS,CAAA;IAChC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAA;IAC5B,IAAI,EAAE,OAAO,CAAA;IACb,EAAE,EAAE,SAAS,CAAC,IAAI,CAAC,GAAG,SAAS,CAAA;IAC/B,QAAQ,EAAE,OAAO,CAAA;IAEjB,QAAQ,EAAE,OAAO,CAAA;IACjB,WAAW,EAAE,OAAO,CAAA;IACpB,gBAAgB,EAAE,OAAO,CAAA;CAC1B,CAAC;AAuBF,iBAAS,cAAc;WA6UT,OAAO,IAA6B;;;;;;YAdpB,GAAG;sBACN,GAAG;sBACH,GAAG;2BACE,GAAG;;;;;;EAgBlC;AAwBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;OAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"WListCard.vue.d.ts","sourceRoot":"","sources":["../../../src/components/List/WListCard.vue"],"names":[],"mappings":"AAsLA;AA8OA,OAAO,KAAK,EAAC,SAAS,EAAC,MAAM,eAAe,CAAA;AAgB5C,KAAK,WAAW,GAAG;IACjB,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7B,MAAM,EAAE,OAAO,GAAG,SAAS,CAAA;IAC3B,QAAQ,EAAE,OAAO,GAAG,SAAS,CAAA;IAC7B,SAAS,EAAE,OAAO,GAAG,SAAS,CAAA;IAC9B,SAAS,EAAE,MAAM,GAAG,SAAS,CAAA;IAC7B,gBAAgB,EAAE,MAAM,GAAG,SAAS,CAAA;IACpC,SAAS,EAAE,OAAO,GAAG,SAAS,CAAA;IAC9B,WAAW,EAAE,OAAO,GAAG,SAAS,CAAA;IAChC,QAAQ,EAAE,MAAM,GAAG,SAAS,CAAA;IAC5B,IAAI,EAAE,OAAO,CAAA;IACb,EAAE,EAAE,SAAS,CAAC,IAAI,CAAC,GAAG,SAAS,CAAA;IAC/B,QAAQ,EAAE,OAAO,CAAA;IAEjB,QAAQ,EAAE,OAAO,CAAA;IACjB,WAAW,EAAE,OAAO,CAAA;IACpB,gBAAgB,EAAE,OAAO,CAAA;CAC1B,CAAC;AAuBF,iBAAS,cAAc;WA4UT,OAAO,IAA6B;;;;;;YAdpB,GAAG;sBACN,GAAG;sBACH,GAAG;2BACE,GAAG;;;;;;EAgBlC;AAwBD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;;;OAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/List/WListCard.vue.js

@@ -79,8 +79,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           !_ctx.card ? (openBlock(), createElementBlock("div", {
             key: 0,
             class: normalizeClass(["left-inner bg-default dark:bg-default-dark @not-lg:hidden sticky z-[1]", {
-              "width-16": _ctx.allowSelect,
-              "width-4": !_ctx.allowSelect
+              "width-[--w-list-header-rounded,1rem]": !_ctx.allowSelect
             }])
           }, [
             _cache[3] || (_cache[3] = createElementVNode("div", { class: "bg-default dark:bg-default-dark absolute right-full top-0 z-[-1] h-full w-[calc(var(--nav-bar-width)+var(--inner-margin))]" }, null, -1)),
@@ -99,7 +98,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 "model-value": _ctx.selected,
                 disabled: _ctx.disabled,
                 "align-top": _ctx.alignTop,
-                class: normalizeClass(["h-full px-4", {
+                class: normalizeClass(["h-full px-[--w-list-padding,1rem]", {
                   "opacity-50": _ctx.allowSelectHover,
                   "pt-3": _ctx.alignTop
                 }]),
@@ -160,8 +159,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           !_ctx.card ? (openBlock(), createElementBlock("div", {
             key: 1,
             class: normalizeClass(["right-inner bg-default dark:bg-default-dark sticky z-[1]", {
-              "width-14": _ctx.$slots.more,
-              "width-4": !_ctx.$slots.more
+              "width-[calc(var(--w-list-padding,1rem)*2+1.25em)]": _ctx.$slots.more,
+              "width-[--w-list-header-rounded,1rem]": !_ctx.$slots.more
             }])
           }, [
             _cache[4] || (_cache[4] = createElementVNode("div", { class: "bg-default dark:bg-default-dark absolute left-full top-0 z-[-1] h-full w-[calc(var(--actions-bar-width)+var(--inner-margin))]" }, null, -1)),
@@ -177,7 +176,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             }, [
               _ctx.$slots.more ? (openBlock(), createBlock(_sfc_main$4, {
                 key: 0,
-                class: normalizeClass(["flex h-full px-4", {
+                class: normalizeClass(["flex h-full px-[--w-list-padding,1rem]", {
                   "items-start pt-3": _ctx.alignTop,
                   "items-center": !_ctx.alignTop
                 }]),

package/dist/components/List/WListHeader.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WListHeader.vue.d.ts","sourceRoot":"","sources":["../../../src/components/List/WListHeader.vue"],"names":[],"mappings":"AA2CA;AA4EA,KAAK,WAAW,GAAG;IACjB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAA;IAC1B,WAAW,EAAE,MAAM,CAAA;CACpB,CAAC;AAmBF,iBAAS,cAAc;WAsFT,OAAO,IAA6B;;yBAXrB,GAAG;0BACF,GAAG;;;;EAehC;AAUD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;6FAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
+{"version":3,"file":"WListHeader.vue.d.ts","sourceRoot":"","sources":["../../../src/components/List/WListHeader.vue"],"names":[],"mappings":"AA0CA;AA2EA,KAAK,WAAW,GAAG;IACjB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAA;IAC1B,WAAW,EAAE,MAAM,CAAA;CACpB,CAAC;AAmBF,iBAAS,cAAc;WAqFT,OAAO,IAA6B;;yBAXrB,GAAG;0BACF,GAAG;;;;EAehC;AAUD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;;;;;6FAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAQpG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}

package/dist/components/List/WListHeader.vue.js

@@ -1,7 +1,7 @@
 import { defineComponent, onMounted, onUnmounted, createElementBlock, openBlock, createElementVNode, normalizeClass, createBlock, createCommentVNode, renderSlot } from 'vue';
 import _sfc_main$1 from '../Checkbox/WCheckbox.vue.js';
 
-const _hoisted_1 = { class: "flex h-12" };
+const _hoisted_1 = { class: "flex h-[--w-list-header-height,3rem]" };
 const _hoisted_2 = { class: "left-inner bg-default dark:bg-default-dark sticky z-[1]" };
 const _hoisted_3 = { class: "bg-primary-light dark:bg-primary-darkest flex flex-1 border-y border-solid border-gray-300 dark:border-gray-700" };
 const _hoisted_4 = { class: "right-inner bg-default dark:bg-default-dark sticky z-[1]" };
@@ -29,18 +29,17 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         createElementVNode("div", _hoisted_2, [
           _cache[1] || (_cache[1] = createElementVNode("div", { class: "bg-default dark:bg-default-dark absolute right-full top-0 z-[-1] h-full w-[calc(var(--nav-bar-width)+var(--inner-margin))]" }, null, -1)),
           createElementVNode("div", {
-            class: normalizeClass(["bg-primary-light dark:bg-primary-darkest h-full rounded-l-2xl border-y border-l border-solid border-gray-300 dark:border-gray-700", {
-              "width-16": _ctx.allowSelect,
-              "width-4": !_ctx.allowSelect
+            class: normalizeClass(["bg-primary-light dark:bg-primary-darkest h-full rounded-l-[--w-list-header-rounded,1rem] border-y border-l border-solid border-gray-300 dark:border-gray-700", {
+              "width-[--w-list-header-rounded,1rem]": !_ctx.allowSelect
             }])
           }, [
-            _ctx.allowSelect && _ctx.selection !== void 0 && _ctx.count !== 0 && _ctx.count !== void 0 ? (openBlock(), createBlock(_sfc_main$1, {
+            _ctx.allowSelect && _ctx.selection !== void 0 ? (openBlock(), createBlock(_sfc_main$1, {
               key: 0,
-              disabled: _ctx.disabled,
+              disabled: _ctx.disabled || _ctx.count === 0 || _ctx.count === void 0,
               "model-value": _ctx.selection,
               "tooltip-text": _ctx.tooltipText,
               intermediate: "",
-              class: "size-full justify-end pr-6",
+              class: "size-full px-[--w-list-padding,1rem]",
               "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.$emit("toggle:selection", $event))
             }, null, 8, ["disabled", "model-value", "tooltip-text"])) : createCommentVNode("", true)
           ], 2)
@@ -51,9 +50,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         createElementVNode("div", _hoisted_4, [
           _cache[2] || (_cache[2] = createElementVNode("div", { class: "bg-default dark:bg-default-dark absolute left-full top-0 z-[-1] h-full w-[calc(var(--actions-bar-width)+var(--inner-margin))]" }, null, -1)),
           createElementVNode("div", {
-            class: normalizeClass(["bg-primary-light dark:bg-primary-darkest h-full rounded-r-2xl border-y border-r border-solid border-gray-300 dark:border-gray-700", {
-              "width-14": !_ctx.hideMore,
-              "width-4": _ctx.hideMore
+            class: normalizeClass(["bg-primary-light dark:bg-primary-darkest h-full rounded-r-[--w-list-header-rounded,0.75rem] border-y border-r border-solid border-gray-300 dark:border-gray-700", {
+              "width-[calc(var(--w-list-padding,1rem)*2+1.25em)]": !_ctx.hideMore,
+              "width-[--w-list-header-rounded,1rem]": _ctx.hideMore
             }])
           }, [
             renderSlot(_ctx.$slots, "settings")