@veracity/vui 0.0.15 → 0.2.0

package/switch/theme.js

@@ -1,109 +1,87 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-function sizeLg(props) {
-    var variant = props.variant;
+function sizeLg() {
+    var container = {};
     var button = {
-        fontSize: 'md'
+        fontSize: 'md',
+        minW: 50,
+        thumb: {
+            h: 24,
+            w: 24
+        },
+        track: {
+            h: 28
+        }
     };
     var label = {
         size: 'lg'
     };
-    var thumb = {
-        h: 24,
-        w: 24
-    };
-    var track = {
-        h: 28,
-        minW: 50
-    };
-    if (variant === 'thin') {
-        track.h = 18;
-        track.minW = 40;
-    }
-    return { button: button, label: label, thumb: thumb, track: track };
+    return { container: container, button: button, label: label };
 }
-function sizeMd(props) {
-    var variant = props.variant;
+function sizeMd() {
+    var container = {};
     var button = {
-        fontSize: 'sm'
+        fontSize: 'sm',
+        minW: 42,
+        thumb: {
+            h: 20,
+            w: 20
+        },
+        track: {
+            h: 24
+        }
     };
     var label = {
         size: 'md'
     };
-    var thumb = {
-        h: 20,
-        w: 20
-    };
-    var track = {
-        h: 24,
-        minW: 42
-    };
-    if (variant === 'thin') {
-        track.h = 14;
-        track.minW = 32;
-    }
-    return { button: button, label: label, thumb: thumb, track: track };
+    return { container: container, button: button, label: label };
 }
-function sizeSm(props) {
-    var variant = props.variant;
+function sizeSm() {
+    var container = {};
     var button = {
-        fontSize: 'xs'
+        fontSize: 'xs',
+        minW: 34,
+        thumb: {
+            h: 16,
+            w: 16
+        },
+        track: {
+            h: 20
+        }
     };
     var label = {
         size: 'sm'
     };
-    var thumb = {
-        h: 16,
-        w: 16
-    };
-    var track = {
-        h: 20,
-        minW: 34
-    };
-    if (variant === 'thin') {
-        track.h = 10;
-        track.minW = 24;
-    }
-    return { button: button, label: label, thumb: thumb, track: track };
+    return { container: container, button: button, label: label };
 }
 function variantContained(props) {
     var c = props.colorScheme;
-    var thumb = {
-        bg: 'white'
-    };
-    var track = {
-        bg: c + ".80",
-        ring: 3
-    };
-    return { thumb: thumb, track: track };
-}
-function variantThin(props) {
-    var c = props.colorScheme;
-    var thumb = {
-        bg: 'white',
-        borderColor: c + ".80",
-        borderWidth: 1,
-        ring: 3
-    };
-    var track = {
-        bg: c + ".80"
-    };
-    return { thumb: thumb, track: track };
+    var container = {};
+    var button = {
+        thumb: {
+            bg: 'white'
+        },
+        track: {
+            bg: c + ".80",
+            ring: 3
+        }
+    };
+    var label = {};
+    return { container: container, button: button, label: label };
 }
 var defaultProps = {
     colorScheme: 'blue',
     size: 'md',
     variant: 'contained'
 };
-var parts = ['container', 'button', 'label', 'track', 'thumb'];
+var parts = ['container', 'button', 'label'];
 var sizes = {
     sm: sizeSm,
     md: sizeMd,
     lg: sizeLg
 };
 var variants = {
-    contained: variantContained,
-    thin: variantThin
+    contained: variantContained
 };
 exports.default = {
     defaultProps: defaultProps,

package/system/borders.d.ts

@@ -77,7 +77,7 @@ export interface BorderStyleProps {
     borderStyle?: BorderStyleProp;
     hoverBorderStyle?: BorderStyleProp;
 }
-declare type BorderRadiusProp = SystemProp<RadiusGetter, VuiTheme>;
+export declare type BorderRadiusProp = SystemProp<RadiusGetter, VuiTheme>;
 export interface BorderRadiusProps {
     borderRadius?: BorderRadiusProp;
     hoverBorderRadius?: BorderRadiusProp;
@@ -129,6 +129,7 @@ export interface RingProps {
     focusRing?: RingProp;
     focusVisibleRing?: RingProp;
     focusWithinRing?: RingProp;
+    hoverRing?: RingProp;
 }
 declare type RingColorProp = SystemProp<ColorGetter, VuiTheme>;
 export interface RingColorProps {
@@ -136,6 +137,7 @@ export interface RingColorProps {
     focusRingColor?: RingColorProp;
     focusVisibleRingColor?: RingColorProp;
     focusWithinRingColor?: RingColorProp;
+    hoverRingColor?: RingColorProp;
 }
 export interface BordersProps extends BorderProps, BorderTopProps, BorderRightProps, BorderBottomProps, BorderLeftProps, BorderColorProps, BorderTopColorProps, BorderRightColorProps, BorderBottomColorProps, BorderLeftColorProps, BorderWidthProps, BorderTopWidthProps, BorderRightWidthProps, BorderBottomWidthProps, BorderLeftWidthProps, BorderStyleProps, BorderRadiusProps, OutlineProps, OutlineColorProps, OutlineWidthProps, OutlineStyleProps, DivideXProps, DivideYProps, DivideXReverseProps, DivideYReverseProps, DivideColorProps, DivideStyleProps, RingProps, RingColorProps {
 }

package/system/custom.d.ts

@@ -1,14 +1,31 @@
-/** Provides styling to truncate multi-line text. */
-export declare const maxLines: import("@xstyled/system").StyleGenerator;
-export interface MaxLinesProps {
-    maxLines?: number;
+import { BorderRadiusProp } from './borders';
+export interface BorderRadiusBottomProps {
+    borderRadiusBottom?: BorderRadiusProp;
 }
-/** Provides styling to truncate single-line text. */
-export declare const isTruncated: import("@xstyled/system").StyleGenerator;
-export declare const wordBreak: import("@xstyled/system").StyleGenerator;
+export declare const borderRadiusBottom: import("@xstyled/system").StyleGenerator;
+export interface BorderRadiusLeftProps {
+    borderRadiusLeft?: BorderRadiusProp;
+}
+export declare const borderRadiusLeft: import("@xstyled/system").StyleGenerator;
+export interface BorderRadiusRightProps {
+    borderRadiusRight?: BorderRadiusProp;
+}
+export declare const borderRadiusRight: import("@xstyled/system").StyleGenerator;
+export interface BorderRadiusTopProps {
+    borderRadiusTop?: BorderRadiusProp;
+}
+export declare const borderRadiusTop: import("@xstyled/system").StyleGenerator;
 export interface IsTruncatedProps {
     isTruncated?: boolean;
 }
+/** Provides styling to truncate single-line text. */
+export declare const isTruncated: import("@xstyled/system").StyleGenerator;
+export interface MaxLinesProps {
+    maxLines?: number;
+}
+/** Provides styling to truncate multi-line text. */
+export declare const maxLines: import("@xstyled/system").StyleGenerator;
 export declare type WordBreakProps = {
     wordBreak?: 'normal' | 'break-all' | 'keep-all' | 'break-word';
 };
+export declare const wordBreak: import("@xstyled/system").StyleGenerator;

package/system/custom.js

@@ -1,19 +1,26 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.wordBreak = exports.isTruncated = exports.maxLines = void 0;
+exports.wordBreak = exports.maxLines = exports.isTruncated = exports.borderRadiusTop = exports.borderRadiusRight = exports.borderRadiusLeft = exports.borderRadiusBottom = void 0;
 var system_1 = require("@xstyled/system");
-/** Provides styling to truncate multi-line text. */
-exports.maxLines = system_1.style({
-    prop: 'maxLines',
-    cssProperty: function (value) {
-        return {
-            display: '-webkit-box',
-            overflow: 'hidden',
-            '-webkit-line-clamp': "" + value,
-            '-webkit-box-orient': 'vertical'
-        };
-    },
-    states: {}
+exports.borderRadiusBottom = system_1.style({
+    prop: 'borderRadiusBottom',
+    themeGet: system_1.getRadius,
+    cssProperty: ['borderBottomLeftRadius', 'borderBottomRightRadius']
+});
+exports.borderRadiusLeft = system_1.style({
+    prop: 'borderRadiusLeft',
+    themeGet: system_1.getRadius,
+    cssProperty: ['borderBottomLeftRadius', 'borderTopLeftRadius']
+});
+exports.borderRadiusRight = system_1.style({
+    prop: 'borderRadiusRight',
+    themeGet: system_1.getRadius,
+    cssProperty: ['borderBottomRightRadius', 'borderTopRightRadius']
+});
+exports.borderRadiusTop = system_1.style({
+    prop: 'borderRadiusTop',
+    themeGet: system_1.getRadius,
+    cssProperty: ['borderTopLeftRadius', 'borderTopRightRadius']
 });
 /** Provides styling to truncate single-line text. */
 exports.isTruncated = system_1.style({
@@ -27,6 +34,19 @@ exports.isTruncated = system_1.style({
     },
     states: {}
 });
+/** Provides styling to truncate multi-line text. */
+exports.maxLines = system_1.style({
+    prop: 'maxLines',
+    cssProperty: function (value) {
+        return {
+            display: '-webkit-box',
+            overflow: 'hidden',
+            '-webkit-line-clamp': "" + value,
+            '-webkit-box-orient': 'vertical'
+        };
+    },
+    states: {}
+});
 exports.wordBreak = system_1.style({
     prop: 'wordBreak'
 });

package/system/system.d.ts

@@ -4,14 +4,14 @@ import { BordersProps } from './borders';
 import { EffectsProps } from './effects';
 import { FlexboxesProps } from './flexboxes';
 import { InteractivityProps } from './interactivity';
-import { IsTruncatedProps, MaxLinesProps, WordBreakProps } from './custom';
+import { BorderRadiusBottomProps, BorderRadiusLeftProps, BorderRadiusRightProps, BorderRadiusTopProps, IsTruncatedProps, MaxLinesProps, WordBreakProps } from './custom';
 import { LayoutProps } from './layout';
 import { SizingProps } from './sizing';
 import { SpaceProps } from './space';
 import { TransformsProps } from './transforms';
 import { TransitionsProps } from './transitions';
 import { TypographyProps } from './typography';
-export interface SystemProps extends AnimationsProps, BackgroundColorProps, BordersProps, EffectsProps, FlexboxesProps, InteractivityProps, IsTruncatedProps, LayoutProps, MaxLinesProps, SizingProps, SpaceProps, TransformsProps, TransitionsProps, TypographyProps, WordBreakProps {
+export interface SystemProps extends AnimationsProps, BackgroundColorProps, BordersProps, BorderRadiusBottomProps, BorderRadiusLeftProps, BorderRadiusRightProps, BorderRadiusTopProps, EffectsProps, FlexboxesProps, InteractivityProps, IsTruncatedProps, LayoutProps, MaxLinesProps, SizingProps, SpaceProps, TransformsProps, TransitionsProps, TypographyProps, WordBreakProps {
 }
 declare const _default: import("@xstyled/system").StyleGenerator;
 export default _default;

package/system/system.js

@@ -2,4 +2,4 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 var system_1 = require("@xstyled/system");
 var custom_1 = require("./custom");
-exports.default = system_1.compose(system_1.animation, system_1.backgroundColor, system_1.borders, system_1.color, system_1.effects, system_1.flexboxes, system_1.interactivity, custom_1.isTruncated, system_1.layout, custom_1.maxLines, system_1.sizing, system_1.space, system_1.transforms, system_1.transitions, system_1.typography, custom_1.wordBreak);
+exports.default = system_1.compose(system_1.animation, system_1.backgroundColor, system_1.borders, custom_1.borderRadiusBottom, custom_1.borderRadiusLeft, custom_1.borderRadiusRight, custom_1.borderRadiusTop, system_1.color, system_1.effects, system_1.flexboxes, system_1.interactivity, custom_1.isTruncated, system_1.layout, custom_1.maxLines, system_1.sizing, system_1.space, system_1.transforms, system_1.transitions, system_1.typography, custom_1.wordBreak);

package/t/t.types.d.ts

@@ -1,3 +1,4 @@
+import { ReactText } from 'react';
 import { SystemProps, TypographyProps } from '../system';
 import { ThemingProps } from '../theme';
 export interface TProps extends SystemProps, ThemingProps<'T'> {
@@ -5,6 +6,6 @@ export interface TProps extends SystemProps, ThemingProps<'T'> {
     casing?: TypographyProps['textTransform'];
     centerV?: boolean;
     decoration?: TypographyProps['textDecoration'];
-    text?: number | string;
+    text?: ReactText;
     weight?: TypographyProps['fontWeight'];
 }

package/tag/context.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { Dict } from '../utils';
+declare const TagProvider: import("react").Provider<Dict<any>>, useTag: () => Dict<any>;
+export { TagProvider, useTag };

package/tag/context.js

@@ -0,0 +1,23 @@
+"use strict";
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTag = exports.TagProvider = void 0;
+var core_1 = require("../core");
+var _a = __read(core_1.createContext({ isOptional: true }), 2), TagProvider = _a[0], useTag = _a[1];
+exports.TagProvider = TagProvider;
+exports.useTag = useTag;

package/tag/index.d.ts

@@ -0,0 +1,6 @@
+export * from './context';
+export * from './tag';
+export * from './tag.types';
+export * from './tagIcon';
+export * from './tagText';
+export { default } from './tag';

package/tag/index.js

@@ -0,0 +1,23 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.default = void 0;
+__exportStar(require("./context"), exports);
+__exportStar(require("./tag"), exports);
+__exportStar(require("./tag.types"), exports);
+__exportStar(require("./tagIcon"), exports);
+__exportStar(require("./tagText"), exports);
+var tag_1 = require("./tag");
+Object.defineProperty(exports, "default", { enumerable: true, get: function () { return __importDefault(tag_1).default; } });

package/tag/tag.d.ts

@@ -0,0 +1,11 @@
+import { TagProps } from './tag.types';
+import TagIcon from './tagIcon';
+import TagText from './tagText';
+import { VuiComponent } from '../core';
+import { SystemProps } from '../system';
+export declare const TagBase: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, SystemProps, never>;
+export declare const Tag: VuiComponent<"span", TagProps> & {
+    Icon: typeof TagIcon;
+    Text: typeof TagText;
+};
+export default Tag;

package/tag/tag.js

@@ -0,0 +1,99 @@
+"use strict";
+var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
+    if (Object.defineProperty) { Object.defineProperty(cooked, "raw", { value: raw }); } else { cooked.raw = raw; }
+    return cooked;
+};
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Tag = exports.TagBase = void 0;
+var react_1 = __importStar(require("react"));
+var styled_components_1 = __importDefault(require("styled-components"));
+var context_1 = require("./context");
+var tagIcon_1 = __importDefault(require("./tagIcon"));
+var tagText_1 = __importDefault(require("./tagText"));
+var core_1 = require("../core");
+var system_1 = require("../system");
+var utils_1 = require("../utils");
+exports.TagBase = styled_components_1.default.span.withConfig(core_1.forwardPropConfig(system_1.system))(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n\talign-items: center;\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\tline-height: normal;\n\tposition: relative;\n\twidth: fit-content;\n\n\t&:focus {\n\t\tborder-color: transparent;\n\t\toutline: none;\n\t}\n\n\t", "\n"], ["\n\talign-items: center;\n\tdisplay: inline-flex;\n\tjustify-content: center;\n\tline-height: normal;\n\tposition: relative;\n\twidth: fit-content;\n\n\t&:focus {\n\t\tborder-color: transparent;\n\t\toutline: none;\n\t}\n\n\t", "\n"])), system_1.system);
+exports.Tag = core_1.vui(function (props, ref) {
+    var casing = props.casing, children = props.children, className = props.className, colorScheme = props.colorScheme, icon = props.icon, iconLeft = props.iconLeft, iconRight = props.iconRight, isFullWidth = props.isFullWidth, _a = props.isInteractive, isInteractive = _a === void 0 ? props.onClick !== undefined : _a, isRound = props.isRound, _b = props.isTruncated, isTruncated = _b === void 0 ? true : _b, itemLeft = props.itemLeft, itemRight = props.itemRight, size = props.size, text = props.text, variant = props.variant, weight = props.weight, rest = __rest(props, ["casing", "children", "className", "colorScheme", "icon", "iconLeft", "iconRight", "isFullWidth", "isInteractive", "isRound", "isTruncated", "itemLeft", "itemRight", "size", "text", "variant", "weight"]);
+    var styles = core_1.useStyleConfig('Tag', props);
+    var _c = styles.container, activeBg = _c.activeBg, h = _c.h, hoverBg = _c.hoverBg, _d = _c.spaceX, spaceXBase = _d === void 0 ? 0 : _d, tagStyles = __rest(_c, ["activeBg", "h", "hoverBg", "spaceX"]);
+    var context = react_1.useMemo(function () { return utils_1.filterUndefined({ colorScheme: colorScheme, size: size, variant: variant }); }, [colorScheme, size, variant]);
+    var spaceX = spaceXBase / 8;
+    var spaceXText = (spaceXBase + 4) / 8;
+    var pl = icon || itemLeft || iconLeft ? spaceX : spaceXText;
+    var pr = icon || itemRight || iconRight ? spaceX : spaceXText;
+    var interactiveProps = isInteractive
+        ? {
+            cursor: 'pointer',
+            hoverBg: hoverBg,
+            activeBg: activeBg,
+            focusRing: 3,
+            tabIndex: 0,
+            userSelect: 'none'
+        }
+        : {};
+    var aliasedProps = utils_1.filterUndefined({
+        borderRadius: isRound ? h / 2 : undefined,
+        fontWeight: weight,
+        textTransform: casing,
+        w: isFullWidth ? '100%' : undefined
+    });
+    return (react_1.default.createElement(context_1.TagProvider, { value: context },
+        react_1.default.createElement(exports.TagBase, __assign({ borderRadius: "md", className: utils_1.cs('vui-tag', className), fontWeight: "medium", h: h, pl: pl, pr: pr, ref: ref, transitionDuration: "fast" }, tagStyles, interactiveProps, aliasedProps, rest),
+            utils_1.isString(icon) ? react_1.default.createElement(tagIcon_1.default, { name: icon }) : icon,
+            !icon && (react_1.default.createElement(react_1.default.Fragment, null,
+                itemLeft,
+                utils_1.isString(iconLeft) ? react_1.default.createElement(tagIcon_1.default, { mr: spaceX, name: iconLeft }) : iconLeft, children !== null && children !== void 0 ? children : (utils_1.isReactText(text) ? react_1.default.createElement(tagText_1.default, __assign({}, { isTruncated: isTruncated, text: text })) : text),
+                utils_1.isString(iconRight) ? react_1.default.createElement(tagIcon_1.default, { ml: spaceX, name: iconRight }) : iconRight,
+                itemRight)))));
+});
+exports.Tag.displayName = 'Tag';
+exports.Tag.Icon = tagIcon_1.default;
+exports.Tag.Text = tagText_1.default;
+exports.default = exports.Tag;
+var templateObject_1;

package/{label/label.types.d.ts → tag/tag.types.d.ts}

@@ -2,19 +2,18 @@
 import { IconProp } from '../icon';
 import { SystemProps, TypographyProps } from '../system';
 import { ThemingProps } from '../theme';
-export interface LabelProps extends SystemProps, ThemingProps<'Label'> {
+import { AnyElement } from '../utils';
+export interface TagProps extends SystemProps, ThemingProps<'Tag'> {
     casing?: TypographyProps['textTransform'];
     colorScheme?: 'blue' | 'green' | 'grey' | 'prussian' | 'red' | 'yellow';
-    icon?: IconProp;
-    iconLeft?: IconProp;
-    iconRight?: IconProp;
-    isElevated?: boolean;
+    icon?: IconProp | AnyElement;
+    iconLeft?: IconProp | AnyElement;
+    iconRight?: IconProp | AnyElement;
     isFullWidth?: boolean;
     isInteractive?: boolean;
     isRound?: boolean;
-    isSplit?: boolean;
     itemLeft?: React.ReactNode;
     itemRight?: React.ReactNode;
-    text?: number | string;
+    text?: React.ReactNode;
     weight?: TypographyProps['fontWeight'];
 }

package/tag/tag.types.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/tag/tagIcon.d.ts

@@ -0,0 +1,3 @@
+import { IconProps } from '../icon';
+export declare const TagIcon: import("../core").VuiComponent<"svg", IconProps>;
+export default TagIcon;

package/{alert/alertTitle.js → tag/tagIcon.js}

@@ -14,17 +14,17 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.AlertTitle = void 0;
+exports.TagIcon = void 0;
 var react_1 = __importDefault(require("react"));
 var context_1 = require("./context");
 var core_1 = require("../core");
-var t_1 = require("../t");
-exports.AlertTitle = core_1.vui(function (props, ref) {
+var icon_1 = __importDefault(require("../icon"));
+exports.TagIcon = core_1.vui(function (props, ref) {
     var _a;
-    var alertProps = (_a = context_1.useAlert()) !== null && _a !== void 0 ? _a : {};
-    var mergedProps = __assign(__assign({}, alertProps), props);
-    var styles = core_1.useStyleConfig('Alert', mergedProps);
-    return react_1.default.createElement(t_1.T, __assign({ className: "vui-alertTitle", ref: ref, weight: "demi" }, styles.title, props));
+    var tagProps = (_a = context_1.useTag()) !== null && _a !== void 0 ? _a : {};
+    var mergedProps = __assign(__assign({}, tagProps), props);
+    var styles = core_1.useStyleConfig('Tag', mergedProps);
+    return react_1.default.createElement(icon_1.default, __assign({ className: "vui-tagIcon", ref: ref }, styles.icon, props));
 });
-exports.AlertTitle.displayName = 'AlertTitle';
-exports.default = exports.AlertTitle;
+exports.TagIcon.displayName = 'TagIcon';
+exports.default = exports.TagIcon;

package/tag/tagText.d.ts

@@ -0,0 +1,3 @@
+import { TProps } from '../t';
+export declare const TagText: import("../core").VuiComponent<"span", TProps>;
+export default TagText;

package/tag/tagText.js

@@ -0,0 +1,30 @@
+"use strict";
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.TagText = void 0;
+var react_1 = __importDefault(require("react"));
+var context_1 = require("./context");
+var core_1 = require("../core");
+var t_1 = __importDefault(require("../t"));
+exports.TagText = core_1.vui(function (props, ref) {
+    var _a;
+    var tagProps = (_a = context_1.useTag()) !== null && _a !== void 0 ? _a : {};
+    var mergedProps = __assign(__assign({}, tagProps), props);
+    var styles = core_1.useStyleConfig('Tag', mergedProps);
+    return react_1.default.createElement(t_1.default, __assign({ className: "vui-tagText", fontSize: "inherit", ref: ref }, styles.text, props));
+});
+exports.TagText.displayName = 'TagText';
+exports.default = exports.TagText;