@uzum-tech/ui 1.5.3 → 1.5.4

package/dist/index.js

@@ -34252,14 +34252,14 @@
         closeSizeSmall: "14px",
         closeSizeMedium: "16px",
         closeSizeLarge: "18px",
-        paddingTiny: "2px 6px 2px 10px",
-        paddingSmall: "2px 6px 2px 10px",
-        paddingMedium: "2px 6px 2px 10px",
-        paddingLarge: "2px 6px 2px 10px",
+        paddingTiny: "2px 6px",
+        paddingSmall: "2px 6px",
+        paddingMedium: "2px 6px",
+        paddingLarge: "6px 8px",
         closeMargin: "0 0 0 4px",
         closeMarginRtl: "0 4px 0 0",
         closeBorderRadius: borderRadius,
-        heightTiny: "16px",
+        heightTiny: "20px",
         heightSmall: "20px",
         heightMedium: "24px",
         heightLarge: "32px",
@@ -34276,7 +34276,8 @@
         textColorHoverCheckable: textPrimary,
         textColorPressedCheckable: textPrimary,
         textColorChecked: textQuaternary,
-        colorCheckable: elementsSecondary,
+        colorCheckable: elementsQuaternary,
+        colorCheckableOutline: elementsSecondary,
         colorHoverCheckable: elementsQuaternary,
         colorPressedCheckable: elementsQuaternary,
         colorChecked: elementsPrimary,
@@ -34466,7 +34467,9 @@
   font-weight: var(--u-font-weight);
 `, [cM("strong", `
     font-weight: var(--u-font-weight-strong);
-  `), cE("border", `
+  `), cM("closable", [cE("content", `
+      padding-left: 4px;
+    `)]), cE("border", `
     pointer-events: none;
     position: absolute;
     left: 0;
@@ -34511,7 +34514,11 @@
     padding: 0px 8px;
     background-color: var(--u-color-checkable);
     transition: border-color .3s var(--u-bezier);
-  `, [cNotM("disabled", [c$1("&:hover", "background-color: var(--u-color-hover-checkable);", [cNotM("checked", "color: var(--u-text-color-hover-checkable);")]), c$1("&:focus", `
+  `, [cE("border", `
+      border: unset;
+    `), cE("content", `
+      padding-left: 0px;
+    `), cNotM("disabled", [c$1("&:hover", "background-color: var(--u-color-hover-checkable);", [cNotM("checked", "color: var(--u-text-color-hover-checkable);")]), c$1("&:focus", `
       background-color: var(--u-color-pressed-checkable);  
       transition: border-color .3s var(--u-bezier);`, [cNotM("checked", "color: var(--u-text-color-pressed-checkable);")]), c$1("&:active", `
       background-color: var(--u-color-pressed-checkable); 
@@ -34521,7 +34528,11 @@
     `, [cE("border", `
         border-color: var(--u-color-checked);
         transition: none;
-      `), cNotM("disabled", [c$1("&:hover", "background-color: var(--u-color-checked-hover);"), c$1("&:focus", "background-color: var(--u-color-checked-hover);"), c$1("&:active", "background-color: var(--u-color-checked-pressed);")])])])]);
+      `), cNotM("disabled", [c$1("&:hover", "background-color: var(--u-color-checked-hover);"), c$1("&:focus", "background-color: var(--u-color-checked-hover);"), c$1("&:active", "background-color: var(--u-color-checked-pressed);")])])]), cM("outline", `
+      background-color: var(--u-color-checkable-outline);
+    `, [cE("border", `
+      border: var(--u-border);
+    `)])]);
 
     const tagProps = {
       ...useTheme.props,
@@ -34530,8 +34541,13 @@
         type: Boolean,
         default: void 0
       },
+      size: {
+        type: String,
+        default: "large"
+      },
       checked: Boolean,
       checkable: Boolean,
+      outline: Boolean,
       strong: Boolean,
       triggerClickOnClose: Boolean,
       onClose: [Array, Function],
@@ -34629,6 +34645,7 @@
               textColorPressedCheckable,
               textColorChecked,
               colorCheckable,
+              colorCheckableOutline,
               colorHoverCheckable,
               colorPressedCheckable,
               colorChecked,
@@ -34673,6 +34690,7 @@
             "--u-close-size": closeSize,
             "--u-color": color || (mergedBorderedRef.value ? colorBordered : typedColor),
             "--u-color-checkable": colorCheckable,
+            "--u-color-checkable-outline": colorCheckableOutline,
             "--u-color-checked": colorChecked,
             "--u-color-checked-hover": colorCheckedHover,
             "--u-color-checked-pressed": colorCheckedPressed,
@@ -34753,6 +34771,7 @@
                 [`${mergedClsPrefix}-tag--strong`]: this.strong,
                 [`${mergedClsPrefix}-tag--disabled`]: this.disabled,
                 [`${mergedClsPrefix}-tag--checkable`]: this.checkable,
+                [`${mergedClsPrefix}-tag--outline`]: this.checkable && this.outline,
                 [`${mergedClsPrefix}-tag--checked`]: this.checkable && this.checked,
                 [`${mergedClsPrefix}-tag--round`]: round,
                 [`${mergedClsPrefix}-tag--avatar`]: avatarNode,
@@ -38578,7 +38597,8 @@
         textSecondary,
         fontBodyMedium,
         lineHeightBodyMedium,
-        iconSmall
+        iconSmall,
+        containerPrimary
       } = vars;
       return {
         titleFontSize: fontBodyLarge,
@@ -38593,8 +38613,11 @@
         arrowSize: iconSmall,
         arrowColor: textPrimary,
         arrowColorDisabled: textSecondary,
-        itemMargin: "16px 0 0 0",
-        titlePadding: "16px 0 0 0"
+        titlePadding: "16px 0 0 0",
+        backgroundColor: containerPrimary,
+        borderRadius: "20px",
+        padding: "24px",
+        boxSizing: "border-box"
       };
     };
     const collapseLight = {
@@ -61858,55 +61881,72 @@
       }
     });
 
-    var style$$ = cB("collapse", "width: 100%;", [cB("collapse-item", `
-    font-size: var(--u-font-size);
-    line-height: var(--u-line-height);
-    color: var(--u-text-color);
-    transition:
-      color .3s var(--u-bezier),
-      border-color .3s var(--u-bezier);
-    margin: var(--u-item-margin);
-  `, [cM("disabled", [cE("header", "cursor: not-allowed;", [cE("header-main", `
-          color: var(--u-title-text-color-disabled);
-        `), cB("collapse-item-arrow", `
-          color: var(--u-arrow-color-disabled);
-        `)])]), cB("collapse-item", "margin-left: 32px;"), c$1("&:first-child", "margin-top: 0;"), c$1("&:first-child >", [cE("header", "padding-top: 0;")]), cM("left-arrow-placement", [cE("header", [cB("collapse-item-arrow", "margin-right: 4px;")])]), cM("right-arrow-placement", [cE("header", [cB("collapse-item-arrow", `
-          margin-left: 4px;
-          order: 1;
-        `)])]), cM("right-edge-arrow-placement", [cE("header", [cB("collapse-item-arrow", "margin-left: auto;")])]), cE("content-wrapper", [cE("content-inner", "padding-top: 16px;"), fadeInHeightExpandTransition({
-      duration: "0.15s"
-    })]), cM("active", [cE("header", [cM("active", [cB("collapse-item-arrow", "transform: rotate(90deg);")])])]), c$1("&:not(:first-child)", "border-top: 1px solid var(--u-divider-color);"), cE("header", `
-      font-size: var(--u-title-font-size);
-      line-height: var(--u-title-line-height);
-      display: flex;
-      flex-wrap: nowrap;
-      align-items: center;
-      transition: color .3s var(--u-bezier);
-      position: relative;
-      padding: var(--u-title-padding);
-      color: var(--u-title-text-color);
+    var style$$ = cB("collapse", `
+    width: 100%;
+    background-color: var(--u-background-color);
+    border-radius: var(--u-border-radius);
+    box-sizing: var(--u-box-sizing);
+  `, [cB("collapse-item", `
+      font-size: var(--u-font-size);
+      line-height: var(--u-line-height);
+      color: var(--u-text-color);
+      transition:
+        color .3s var(--u-bezier),
+        border-color .3s var(--u-bezier);
+      padding: var(--u-padding);
       cursor: pointer;
-    `, [cE("header-main", `
+    `, [cM("disabled", [cE("header", "cursor: not-allowed;", [cE("header-main", `
+            color: var(--u-title-text-color-disabled);
+          `), cB("collapse-item-arrow", `
+            color: var(--u-arrow-color-disabled);
+          `)])]), cB("collapse-item", "margin-left: 32px;"), c$1("&:first-child", "margin-top: 0;"), c$1("&:first-child >", [cE("header", "padding-top: 0;")]), cM("left-arrow-placement", [cE("header", [cB("collapse-item-arrow", "margin-right: 4px;")])]), cM("right-arrow-placement", [cE("header", [cB("collapse-item-arrow", `
+            margin-left: 4px;
+            order: 1;
+          `)])]), cM("right-edge-arrow-placement", [cE("header", [cB("collapse-item-arrow", `
+            margin-left: auto;
+            display: flex;
+            width: 28px;
+            height: 28px;
+            justify-content: center;
+            align-items: center;
+            border-radius: 100px;
+            background: #F3F4F6;
+          `, [cB("base-icon", `
+              transform: scaleY(1) rotate(90deg);
+              transition:
+                transform .15s var(--u-bezier)
+            `)])])]), cE("content-wrapper", [cE("content-inner", "padding-top: 16px;"), fadeInHeightExpandTransition({
+      duration: "0.15s"
+    })]), cM("active", [cE("header", [cM("active", [cB("collapse-item-arrow", [cB("base-icon", "transform: scaleY(-1) rotate(90deg)")])])])]), cE("header", `
+        font-size: var(--u-title-font-size);
+        line-height: var(--u-title-line-height);
         display: flex;
         flex-wrap: nowrap;
         align-items: center;
-        font-weight: var(--u-title-font-weight);
         transition: color .3s var(--u-bezier);
-        flex: 1;
+        position: relative;
         color: var(--u-title-text-color);
-      `), cE("header-extra", `
-        display: flex;
-        align-items: center;
-        transition: color .3s var(--u-bezier);
-        color: var(--u-text-color);
-      `), cB("collapse-item-arrow", `
-        display: flex;
-        transition:
-          transform .15s var(--u-bezier),
-          color .3s var(--u-bezier);
-        font-size: var(--u-arrow-size);
-        color: var(--u-arrow-color);
-      `)])])]);
+      `, [cE("header-main", `
+          display: flex;
+          flex-wrap: nowrap;
+          align-items: center;
+          font-weight: var(--u-title-font-weight);
+          transition: color .3s var(--u-bezier);
+          flex: 1;
+          color: var(--u-title-text-color);
+        `), cE("header-extra", `
+          display: flex;
+          align-items: center;
+          transition: color .3s var(--u-bezier);
+          color: var(--u-text-color);
+        `), cB("collapse-item-arrow", `
+          display: flex;
+          transition:
+            transform .15s var(--u-bezier),
+            color .3s var(--u-bezier);
+          font-size: var(--u-arrow-size);
+          color: var(--u-arrow-color);
+        `)])])]);
 
     const collapseProps = {
       ...useTheme.props,
@@ -61917,7 +61957,7 @@
       expandedNames: [Array, String],
       arrowPlacement: {
         type: String,
-        default: "left"
+        default: "right-edge"
       },
       accordion: {
         type: Boolean,
@@ -62042,10 +62082,13 @@
               fontSize,
               titleFontSize,
               arrowColorDisabled,
-              itemMargin,
               lineHeight,
               titleLineHeight,
-              arrowSize
+              arrowSize,
+              backgroundColor,
+              borderRadius,
+              padding,
+              boxSizing
             }
           } = themeRef.value;
           return {
@@ -62063,7 +62106,10 @@
             "--u-arrow-size": arrowSize,
             "--u-arrow-color": arrowColor,
             "--u-arrow-color-disabled": arrowColorDisabled,
-            "--u-item-margin": itemMargin
+            "--u-background-color": backgroundColor,
+            "--u-border-radius": borderRadius,
+            "--u-padding": padding,
+            "--u-box-sizing": boxSizing
           };
         });
         const themeClassHandle = inlineThemeDisabled ? useThemeClass("collapse", void 0, cssVarsRef, props) : void 0;
@@ -62184,6 +62230,7 @@
             return collapseProps.arrowPlacement;
           }),
           handleClick(e) {
+            e.stopPropagation();
             if (UCollapse && !props.disabled) {
               UCollapse.toggleItem(collapsedRef.value, mergedNameRef.value, e);
             }
@@ -62227,7 +62274,8 @@
               `${mergedClsPrefix}-collapse-item--${arrowPlacement}-arrow-placement`,
               disabled && `${mergedClsPrefix}-collapse-item--disabled`,
               !collapsed && `${mergedClsPrefix}-collapse-item--active`
-            ]
+            ],
+            onClick: this.handleClick
           },
           /* @__PURE__ */ vue.h(
             "div",
@@ -62240,8 +62288,7 @@
             /* @__PURE__ */ vue.h(
               "div",
               {
-                class: `${mergedClsPrefix}-collapse-item__header-main`,
-                onClick: this.handleClick
+                class: `${mergedClsPrefix}-collapse-item__header-main`
               },
               arrowPlacement !== "right-edge" && arrowNode,
               headerNode
@@ -65171,6 +65218,7 @@
         type: Object,
         default: {}
       },
+      emptyProps: Object,
       onLoad: Function,
       "onUpdate:page": [Function, Array],
       onUpdatePage: [Function, Array],
@@ -86234,7 +86282,8 @@
           handleTableBodyScroll,
           doCheck,
           doUncheck,
-          renderCell
+          renderCell,
+          emptyPropsRef
           // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
         } = vue.inject(dataTableInjectionKey);
         const scrollbarInstRef = vue.ref(null);
@@ -86509,6 +86558,7 @@
           handleRadioUpdateChecked,
           handleUpdateExpanded,
           renderCell,
+          emptyPropsRef,
           ...exposedMethods
         };
       },
@@ -86523,7 +86573,8 @@
           flexHeight,
           loadingKeySet,
           onResize,
-          setHeaderScrollLeft
+          setHeaderScrollLeft,
+          emptyPropsRef
         } = this;
         const scrollable = scrollX !== void 0 || maxHeight !== void 0 || flexHeight;
         const isBasicAutoLayout = !scrollable && mergedTableLayout === "auto";
@@ -86953,7 +87004,8 @@
                 {
                   size: "large",
                   theme: this.mergedTheme.peers.Empty,
-                  themeOverrides: this.mergedTheme.peerOverrides.Empty
+                  themeOverrides: this.mergedTheme.peerOverrides.Empty,
+                  ...emptyPropsRef
                 }
               )
             ])
@@ -88893,6 +88945,7 @@
           handleTableBodyScroll,
           setHeaderScrollLeft,
           renderCell: vue.toRef(props, "renderCell"),
+          emptyPropsRef: vue.toRef(props, "emptyProps"),
           handleEdit
         });
         const exposedMethods = {
@@ -126947,7 +127000,7 @@
         watermarkProps: watermarkProps
     });
 
-    var version = "1.5.3";
+    var version = "1.5.4";
 
     function create({
       componentPrefix = "U",