@uzum-tech/ui 1.5.3 → 1.5.5

package/dist/index.js

@@ -765,6 +765,12 @@
       return color.replace(/#|\(|\)|,|\s/g, "_");
     }
 
+    const resolveSize = (value, fallback) => {
+      if (value === void 0) return fallback;
+      value = String(value);
+      return /^\d+$/.test(value) ? `${value}px` : value;
+    };
+
     function ampCount(selector) {
       let cnt = 0;
       for (let i = 0; i < selector.length; ++i) {
@@ -34252,14 +34258,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 +34282,8 @@
         textColorHoverCheckable: textPrimary,
         textColorPressedCheckable: textPrimary,
         textColorChecked: textQuaternary,
-        colorCheckable: elementsSecondary,
+        colorCheckable: elementsQuaternary,
+        colorCheckableOutline: elementsSecondary,
         colorHoverCheckable: elementsQuaternary,
         colorPressedCheckable: elementsQuaternary,
         colorChecked: elementsPrimary,
@@ -34466,7 +34473,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 +34520,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 +34534,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 +34547,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 +34651,7 @@
               textColorPressedCheckable,
               textColorChecked,
               colorCheckable,
+              colorCheckableOutline,
               colorHoverCheckable,
               colorPressedCheckable,
               colorChecked,
@@ -34673,6 +34696,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 +34777,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,
@@ -37497,7 +37522,8 @@
         textColorSuccess: textQuaternary,
         textColorError: textQuaternary,
         textColorWarning: textQuaternary,
-        borderColor: staticWhite
+        borderColor: staticWhite,
+        dotSize: "12px"
       };
     };
     const badgeLight = {
@@ -38578,7 +38604,8 @@
         textSecondary,
         fontBodyMedium,
         lineHeightBodyMedium,
-        iconSmall
+        iconSmall,
+        containerPrimary
       } = vars;
       return {
         titleFontSize: fontBodyLarge,
@@ -38593,8 +38620,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 = {
@@ -47289,11 +47319,6 @@
           const getBackgroundColor = (color2) => {
             return props.disabled || size === "small" ? "rgba(0,0,0,0)" : color2;
           };
-          const resolveSize = (value, fallback) => {
-            if (value === void 0) return fallback;
-            value = String(value);
-            return /^\d+$/.test(value) ? `${value}px` : value;
-          };
           return {
             "--u-font-size": fontSize,
             "--u-font-weight": fontWeight,
@@ -47883,13 +47908,14 @@
       transformOrigin: "left bottom",
       originalTransform: "translateX(0)"
     })])]), cM("dot", [cB("badge-sup", `
-        height: 8px;
-        width: 8px;
+        height: var(--u-dot-size);
+        width: var(--u-dot-size);
+        justify-content: center;
+        overflow: hidden;
         padding: 0;
-        min-width: 8px;
         left: 100%;
         bottom: calc(100% - 4px);
-      `, [c$1("::before", "border-radius: 4px;")])]), cB("badge-sup", `
+      `, [c$1("::before", "border-radius: 4px;"), c$1("img", "width: 100%")])]), cB("badge-sup", `
       background: var(--u-color);
       transition:
         background-color .3s var(--u-bezier),
@@ -47940,8 +47966,6 @@
         border-radius: 100px;
       `), cM("dot", [cB("badge-sup", `
           transform: none;
-          width: 12px;
-          height: 12px;
           transform: none;
           left: auto;
           right: 0;
@@ -47965,6 +47989,7 @@
       processing: Boolean,
       color: String,
       textColor: String,
+      dotSize: [String, Number],
       offset: Array
     };
     var UBadge = vue.defineComponent({
@@ -48002,7 +48027,8 @@
               [createKey("color", type)]: color,
               [createKey("textColor", type)]: textColor,
               fontSize,
-              borderColor
+              borderColor,
+              dotSize
             }
           } = themeRef.value;
           return {
@@ -48012,7 +48038,8 @@
             "--u-bezier": cubicBezierEaseInOut,
             "--u-ripple-bezier": cubicBezierEaseOut,
             "--u-text-color": propTextColor || textColor,
-            "--u-border-color": borderColor
+            "--u-border-color": borderColor,
+            "--u-dot-size": resolveSize(props.dotSize, dotSize)
           };
         });
         const themeClassHandle = inlineThemeDisabled ? useThemeClass(
@@ -53641,10 +53668,11 @@
       }
       return calendarQuarters;
     }
-    function yearArray(valueTs, currentTs) {
+    function yearArray(valueTs, currentTs, maxDate) {
       const calendarYears = [];
       const time1900 = new Date(START_YEAR, 0, 1);
-      let count = END_YEAR - START_YEAR + 1;
+      const endYear = maxDate ? new Date(maxDate).getFullYear() : END_YEAR;
+      let count = endYear - START_YEAR + 1;
       while (count--) {
         calendarYears.push(yearItem(getTime(addYears(time1900, count)), valueTs, currentTs));
       }
@@ -61858,55 +61886,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 +61962,7 @@
       expandedNames: [Array, String],
       arrowPlacement: {
         type: String,
-        default: "left"
+        default: "right-edge"
       },
       accordion: {
         type: Boolean,
@@ -62042,10 +62087,13 @@
               fontSize,
               titleFontSize,
               arrowColorDisabled,
-              itemMargin,
               lineHeight,
               titleLineHeight,
-              arrowSize
+              arrowSize,
+              backgroundColor,
+              borderRadius,
+              padding,
+              boxSizing
             }
           } = themeRef.value;
           return {
@@ -62063,7 +62111,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 +62235,7 @@
             return collapseProps.arrowPlacement;
           }),
           handleClick(e) {
+            e.stopPropagation();
             if (UCollapse && !props.disabled) {
               UCollapse.toggleItem(collapsedRef.value, mergedNameRef.value, e);
             }
@@ -62227,7 +62279,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 +62293,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 +65223,7 @@
         type: Object,
         default: {}
       },
+      emptyProps: Object,
       onLoad: Function,
       "onUpdate:page": [Function, Array],
       onUpdatePage: [Function, Array],
@@ -86234,7 +86287,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 +86563,7 @@
           handleRadioUpdateChecked,
           handleUpdateExpanded,
           renderCell,
+          emptyPropsRef,
           ...exposedMethods
         };
       },
@@ -86523,7 +86578,8 @@
           flexHeight,
           loadingKeySet,
           onResize,
-          setHeaderScrollLeft
+          setHeaderScrollLeft,
+          emptyPropsRef
         } = this;
         const scrollable = scrollX !== void 0 || maxHeight !== void 0 || flexHeight;
         const isBasicAutoLayout = !scrollable && mergedTableLayout === "auto";
@@ -86953,7 +87009,8 @@
                 {
                   size: "large",
                   theme: this.mergedTheme.peers.Empty,
-                  themeOverrides: this.mergedTheme.peerOverrides.Empty
+                  themeOverrides: this.mergedTheme.peerOverrides.Empty,
+                  ...emptyPropsRef
                 }
               )
             ])
@@ -88893,6 +88950,7 @@
           handleTableBodyScroll,
           setHeaderScrollLeft,
           renderCell: vue.toRef(props, "renderCell"),
+          emptyPropsRef: vue.toRef(props, "emptyProps"),
           handleEdit
         });
         const exposedMethods = {
@@ -94957,6 +95015,7 @@
       const {
         isValueInvalidRef,
         isDateDisabledRef,
+        maxDateRef,
         isDateInvalidRef,
         isTimeInvalidRef,
         isDateTimeInvalidRef,
@@ -94997,7 +95056,7 @@
         const {
           value
         } = props;
-        return yearArray(Array.isArray(value) ? null : value, nowRef.value);
+        return yearArray(Array.isArray(value) ? null : value, nowRef.value, maxDateRef.value);
       });
       const quarterArrayRef = vue.computed(() => {
         const {
@@ -95042,6 +95101,9 @@
         return getTime(startOfDay(value));
       }
       function mergedIsDateDisabled(ts) {
+        if (maxDateRef.value && ts > maxDateRef.value) {
+          return true;
+        }
         const {
           isDateDisabled: {
             value: isDateDisabled
@@ -95852,6 +95914,7 @@
     function useDualCalendar(props, type) {
       const {
         isDateDisabledRef,
+        maxDateRef,
         isStartHourDisabledRef,
         isEndHourDisabledRef,
         isStartMinuteDisabledRef,
@@ -95961,10 +96024,10 @@
         return shortcuts || rangesRef.value;
       });
       const startYearArrayRef = vue.computed(() => {
-        return yearArray(pluckValueFromRange(props.value, "start"), nowRef.value);
+        return yearArray(pluckValueFromRange(props.value, "start"), nowRef.value, maxDateRef.value);
       });
       const endYearArrayRef = vue.computed(() => {
-        return yearArray(pluckValueFromRange(props.value, "end"), nowRef.value);
+        return yearArray(pluckValueFromRange(props.value, "end"), nowRef.value, maxDateRef.value);
       });
       const startQuarterArrayRef = vue.computed(() => {
         const startValue = pluckValueFromRange(props.value, "start");
@@ -96056,6 +96119,9 @@
         adjustCalendarTimes(false);
       }
       function mergedIsDateDisabled(ts) {
+        if (maxDateRef.value && ts > maxDateRef.value) {
+          return true;
+        }
         const isDateDisabled = isDateDisabledRef.value;
         if (!isDateDisabled) return false;
         if (!Array.isArray(props.value)) return isDateDisabled(ts, "start", null);
@@ -97516,6 +97582,7 @@
       shortcuts: Object,
       defaultShortcuts: Boolean,
       isDateDisabled: Function,
+      maxDate: Number,
       isTimeDisabled: Function,
       show: {
         type: Boolean,
@@ -98096,6 +98163,7 @@
           dateLocaleRef,
           firstDayOfWeekRef: vue.toRef(props, "firstDayOfWeek"),
           isDateDisabledRef: vue.toRef(props, "isDateDisabled"),
+          maxDateRef: vue.toRef(props, "maxDate"),
           rangesRef: vue.toRef(props, "ranges"),
           timePickerPropsRef: vue.toRef(props, "timePickerProps"),
           closeOnSelectRef: vue.toRef(props, "closeOnSelect"),
@@ -126947,7 +127015,7 @@
         watermarkProps: watermarkProps
     });
 
-    var version = "1.5.3";
+    var version = "1.5.5";
 
     function create({
       componentPrefix = "U",