@uzum-tech/ui 1.4.1 → 1.5.0

package/lib/typography/src/text.js

@@ -1,82 +1,78 @@
 "use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.textProps = void 0;
 const vue_1 = require("vue");
 const vooks_1 = require("vooks");
-const _mixins_1 = require("../../_mixins");
-const _utils_1 = require("../../_utils");
-const styles_1 = require("../styles");
-const text_cssr_1 = __importDefault(require("./styles/text.cssr"));
-exports.textProps = Object.assign(Object.assign({}, _mixins_1.useTheme.props), { code: Boolean, type: {
-        type: String,
-        default: 'default'
-    }, delete: Boolean, strong: Boolean, italic: Boolean, underline: Boolean, depth: [String, Number], tag: String, 
-    // deprecated
-    as: {
-        type: String,
-        validator: () => {
-            if (process.env.NODE_ENV !== 'production') {
-                (0, _utils_1.warn)('text', '`as` is deprecated, please use `tag` instead.');
-            }
-            return true;
-        },
-        default: undefined
-    } });
+const _internal_1 = require("../../_internal");
+exports.textProps = _internal_1.internalTextProps;
 exports.default = (0, vue_1.defineComponent)({
     name: 'Text',
-    props: exports.textProps,
-    setup(props) {
-        const { mergedClsPrefixRef, inlineThemeDisabled } = (0, _mixins_1.useConfig)(props);
-        const themeRef = (0, _mixins_1.useTheme)('Typography', '-text', text_cssr_1.default, styles_1.typographyLight, props, mergedClsPrefixRef);
-        const cssVarsRef = (0, vue_1.computed)(() => {
-            const { depth, type } = props;
-            const textColorKey = type === 'default'
-                ? depth === undefined
-                    ? 'textColor'
-                    : `textColor${depth}Depth`
-                : (0, _utils_1.createKey)('textColor', type);
-            const { common: { fontWeightStrong, fontFamilyMono, cubicBezierEaseInOut }, self: { codeTextColor, codeBorderRadius, codeColor, codeBorder, [textColorKey]: textColor } } = themeRef.value;
-            return {
-                '--u-bezier': cubicBezierEaseInOut,
-                '--u-text-color': textColor,
-                '--u-font-weight-strong': fontWeightStrong,
-                '--u-font-famliy-mono': fontFamilyMono,
-                '--u-code-border-radius': codeBorderRadius,
-                '--u-code-text-color': codeTextColor,
-                '--u-code-color': codeColor,
-                '--u-code-border': codeBorder
-            };
+    props: Object.assign(Object.assign({}, exports.textProps), { 
+        // deprecated
+        code: {
+            type: Boolean,
+            validator: (value) => {
+                if (process.env.NODE_ENV !== 'production' && value) {
+                    (0, vue_1.warn)('text', '`code` is deprecated, please use tag="code" instead');
+                }
+                return true;
+            }
+        }, as: {
+            type: String,
+            validator: (value) => {
+                if (process.env.NODE_ENV !== 'production' && value) {
+                    (0, vue_1.warn)('text', '`as` is deprecated, please use `tag` instead.');
+                }
+                return true;
+            },
+            default: undefined
+        }, delete: {
+            type: Boolean,
+            validator: (value) => {
+                if (process.env.NODE_ENV !== 'production' && value) {
+                    (0, vue_1.warn)('text', '`delete` is deprecated, please use tag="del" instead');
+                }
+                return true;
+            }
+        }, depth: {
+            type: [String, Number],
+            validator: (value) => {
+                if (process.env.NODE_ENV !== 'production' && value) {
+                    (0, vue_1.warn)('text', '`depth` is deprecated, please use custom classes to define styles');
+                }
+                return true;
+            }
+        } }),
+    setup(props, { slots, attrs }) {
+        const compitableTagRef = (0, vooks_1.useCompitable)(props, ['as', 'tag']);
+        // deprecated props
+        const finalTagRef = (0, vue_1.computed)(() => {
+            // Priority: explicit tag > as > code > delete > default
+            if (compitableTagRef.value) {
+                return compitableTagRef.value;
+            }
+            if (props.code) {
+                return 'code';
+            }
+            if (props.delete) {
+                return 'del';
+            }
+            return undefined;
         });
-        const themeClassHandle = inlineThemeDisabled
-            ? (0, _mixins_1.useThemeClass)('text', (0, vue_1.computed)(() => `${props.type[0]}${props.depth || ''}`), cssVarsRef, props)
-            : undefined;
-        return {
-            mergedClsPrefix: mergedClsPrefixRef,
-            compitableTag: (0, vooks_1.useCompitable)(props, ['as', 'tag']),
-            cssVars: inlineThemeDisabled ? undefined : cssVarsRef,
-            themeClass: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.themeClass,
-            onRender: themeClassHandle === null || themeClassHandle === void 0 ? void 0 : themeClassHandle.onRender
+        return () => {
+            const { code, as, delete: deleteProp, depth } = props, validProps = __rest(props, ["code", "as", "delete", "depth"]);
+            return (0, vue_1.h)(_internal_1.InternalUText, Object.assign(Object.assign(Object.assign({}, validProps), attrs), { tag: finalTagRef.value }), slots);
         };
-    },
-    render() {
-        var _a, _b, _c;
-        const { mergedClsPrefix } = this;
-        (_a = this.onRender) === null || _a === void 0 ? void 0 : _a.call(this);
-        const textClass = [
-            `${mergedClsPrefix}-text`,
-            this.themeClass,
-            {
-                [`${mergedClsPrefix}-text--code`]: this.code,
-                [`${mergedClsPrefix}-text--delete`]: this.delete,
-                [`${mergedClsPrefix}-text--strong`]: this.strong,
-                [`${mergedClsPrefix}-text--italic`]: this.italic,
-                [`${mergedClsPrefix}-text--underline`]: this.underline
-            }
-        ];
-        const children = (_c = (_b = this.$slots).default) === null || _c === void 0 ? void 0 : _c.call(_b);
-        return this.code ? ((0, vue_1.h)("code", { class: textClass, style: this.cssVars }, this.delete ? (0, vue_1.h)("del", null, children) : children)) : this.delete ? ((0, vue_1.h)("del", { class: textClass, style: this.cssVars }, children)) : ((0, vue_1.h)(this.compitableTag || 'span', { class: textClass, style: this.cssVars }, children));
     }
 });

package/lib/typography/src/ul.d.ts

@@ -27,6 +27,7 @@ export declare const ulProps: {
         headerBarWidth5: string;
         headerBarWidth6: string;
         pMargin: string;
+        margin: string;
         liMargin: string;
         olPadding: string;
         ulPadding: string;
@@ -48,6 +49,8 @@ export declare const ulProps: {
         pTextColor3Depth: string;
         pLineHeight: string;
         pFontSize: string;
+        fontSize: string;
+        lineHeight: string;
         headerBarColor: string;
         headerBarColorPrimary: string;
         headerBarColorInfo: string;
@@ -93,6 +96,7 @@ export declare const ulProps: {
         headerBarWidth5: string;
         headerBarWidth6: string;
         pMargin: string;
+        margin: string;
         liMargin: string;
         olPadding: string;
         ulPadding: string;
@@ -114,6 +118,8 @@ export declare const ulProps: {
         pTextColor3Depth: string;
         pLineHeight: string;
         pFontSize: string;
+        fontSize: string;
+        lineHeight: string;
         headerBarColor: string;
         headerBarColorPrimary: string;
         headerBarColorInfo: string;
@@ -159,6 +165,7 @@ export declare const ulProps: {
         headerBarWidth5: string;
         headerBarWidth6: string;
         pMargin: string;
+        margin: string;
         liMargin: string;
         olPadding: string;
         ulPadding: string;
@@ -180,6 +187,8 @@ export declare const ulProps: {
         pTextColor3Depth: string;
         pLineHeight: string;
         pFontSize: string;
+        fontSize: string;
+        lineHeight: string;
         headerBarColor: string;
         headerBarColorPrimary: string;
         headerBarColorInfo: string;
@@ -229,6 +238,7 @@ declare const _default: import("vue").DefineComponent<{
         headerBarWidth5: string;
         headerBarWidth6: string;
         pMargin: string;
+        margin: string;
         liMargin: string;
         olPadding: string;
         ulPadding: string;
@@ -250,6 +260,8 @@ declare const _default: import("vue").DefineComponent<{
         pTextColor3Depth: string;
         pLineHeight: string;
         pFontSize: string;
+        fontSize: string;
+        lineHeight: string;
         headerBarColor: string;
         headerBarColorPrimary: string;
         headerBarColorInfo: string;
@@ -295,6 +307,7 @@ declare const _default: import("vue").DefineComponent<{
         headerBarWidth5: string;
         headerBarWidth6: string;
         pMargin: string;
+        margin: string;
         liMargin: string;
         olPadding: string;
         ulPadding: string;
@@ -316,6 +329,8 @@ declare const _default: import("vue").DefineComponent<{
         pTextColor3Depth: string;
         pLineHeight: string;
         pFontSize: string;
+        fontSize: string;
+        lineHeight: string;
         headerBarColor: string;
         headerBarColorPrimary: string;
         headerBarColorInfo: string;
@@ -361,6 +376,7 @@ declare const _default: import("vue").DefineComponent<{
         headerBarWidth5: string;
         headerBarWidth6: string;
         pMargin: string;
+        margin: string;
         liMargin: string;
         olPadding: string;
         ulPadding: string;
@@ -382,6 +398,8 @@ declare const _default: import("vue").DefineComponent<{
         pTextColor3Depth: string;
         pLineHeight: string;
         pFontSize: string;
+        fontSize: string;
+        lineHeight: string;
         headerBarColor: string;
         headerBarColorPrimary: string;
         headerBarColorInfo: string;
@@ -442,6 +460,7 @@ declare const _default: import("vue").DefineComponent<{
         headerBarWidth5: string;
         headerBarWidth6: string;
         pMargin: string;
+        margin: string;
         liMargin: string;
         olPadding: string;
         ulPadding: string;
@@ -463,6 +482,8 @@ declare const _default: import("vue").DefineComponent<{
         pTextColor3Depth: string;
         pLineHeight: string;
         pFontSize: string;
+        fontSize: string;
+        lineHeight: string;
         headerBarColor: string;
         headerBarColorPrimary: string;
         headerBarColorInfo: string;
@@ -508,6 +529,7 @@ declare const _default: import("vue").DefineComponent<{
         headerBarWidth5: string;
         headerBarWidth6: string;
         pMargin: string;
+        margin: string;
         liMargin: string;
         olPadding: string;
         ulPadding: string;
@@ -529,6 +551,8 @@ declare const _default: import("vue").DefineComponent<{
         pTextColor3Depth: string;
         pLineHeight: string;
         pFontSize: string;
+        fontSize: string;
+        lineHeight: string;
         headerBarColor: string;
         headerBarColorPrimary: string;
         headerBarColorInfo: string;
@@ -574,6 +598,7 @@ declare const _default: import("vue").DefineComponent<{
         headerBarWidth5: string;
         headerBarWidth6: string;
         pMargin: string;
+        margin: string;
         liMargin: string;
         olPadding: string;
         ulPadding: string;
@@ -595,6 +620,8 @@ declare const _default: import("vue").DefineComponent<{
         pTextColor3Depth: string;
         pLineHeight: string;
         pFontSize: string;
+        fontSize: string;
+        lineHeight: string;
         headerBarColor: string;
         headerBarColorPrimary: string;
         headerBarColorInfo: string;

package/lib/typography/src/ul.js

@@ -13,6 +13,9 @@ exports.default = (0, vue_1.defineComponent)({
     name: 'Ul',
     props: exports.ulProps,
     setup(props) {
+        if (process.env.NODE_ENV !== 'production') {
+            (0, vue_1.warn)('ul', 'Ul component is deprecated, you should implement Ul locally in your component instead.');
+        }
         const { mergedClsPrefixRef, inlineThemeDisabled } = (0, _mixins_1.useConfig)(props);
         const themeRef = (0, _mixins_1.useTheme)('Typography', '-xl', list_cssr_1.default, styles_1.typographyLight, props, mergedClsPrefixRef);
         const cssVarsRef = (0, vue_1.computed)(() => {

package/lib/typography/styles/light.d.ts

@@ -26,6 +26,7 @@ export declare const self: (vars: ThemeCommonVars) => {
     headerBarWidth5: string;
     headerBarWidth6: string;
     pMargin: string;
+    margin: string;
     liMargin: string;
     olPadding: string;
     ulPadding: string;
@@ -47,6 +48,8 @@ export declare const self: (vars: ThemeCommonVars) => {
     pTextColor3Depth: string;
     pLineHeight: string;
     pFontSize: string;
+    fontSize: string;
+    lineHeight: string;
     headerBarColor: string;
     headerBarColorPrimary: string;
     headerBarColorInfo: string;

package/lib/typography/styles/light.js

@@ -30,6 +30,7 @@ const self = (vars) => {
         headerBarWidth5: '3px',
         headerBarWidth6: '3px',
         pMargin: '16px 0 16px 0',
+        margin: '16px 0 16px 0',
         liMargin: '.25em 0 0 0',
         olPadding: '0 0 0 2em',
         ulPadding: '0 0 0 2em',
@@ -51,6 +52,8 @@ const self = (vars) => {
         pTextColor3Depth: textTertiary,
         pLineHeight: lineHeightBodyMedium,
         pFontSize: fontBodyMedium,
+        fontSize: fontBodyMedium,
+        lineHeight: lineHeightBodyMedium,
         headerBarColor: brandPrimary500,
         headerBarColorPrimary: brandPrimary500,
         headerBarColorInfo: brandQuaternary500,

package/lib/version.d.ts

@@ -1,2 +1,2 @@
-declare const _default: "1.4.1";
+declare const _default: "1.5.0";
 export default _default;

package/lib/version.js

@@ -1,3 +1,3 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.default = '1.4.1';
+exports.default = '1.5.0';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uzum-tech/ui",
-  "version": "1.4.1",
+  "version": "1.5.0",
   "description": "A Vue 3 Component Library. Fairly Complete, Theme Customizable, Uses TypeScript, Fast",
   "main": "lib/index.js",
   "module": "es/index.js",

package/volar.d.ts

@@ -144,6 +144,7 @@ declare module 'vue' {
     UUploadFileList: typeof import('@uzum-tech/ui')['UUploadFileList']
     UUploadTrigger: typeof import('@uzum-tech/ui')['UUploadTrigger']
     UWatermark: typeof import('@uzum-tech/ui')['UWatermark']
+    UActionCard: typeof import('@uzum-tech/ui')['UActionCard']
   }
 }
 export {}