@cube-dev/ui-kit 0.196.0 → 0.198.0

package/dist/components/content/Skeleton/Skeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"Skeleton.js","names":["BaseProps","ContainerStyleProps","ReactNode","useI18n","Flow","CubeGridProps","Grid","Space","CubePlaceholderProps","Placeholder","PlaceholderGroupContext","LAYOUT_MAP","page","lines","children","isStatic","rootProps","CubeSkeletonLayoutProps","Array","fill","map","item","i","content","topbar","menu","stats","cards","tabs","table","rows","columns","j","chart","heightMap","const","CubeSkeletonProps","CubeSkeletonRootProps","Omit","layout","Skeleton","t0","props","t","qa","role"],"sources":["../../../../src/components/content/Skeleton/Skeleton.tsx"],"sourcesContent":["import { BaseProps, ContainerStyleProps } from '@tenphi/tasty';\nimport { ReactNode } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { Flow } from '../../layout/Flow';\nimport { CubeGridProps, Grid } from '../../layout/Grid';\nimport { Space } from '../../layout/Space';\nimport {\n  CubePlaceholderProps,\n  Placeholder,\n  PlaceholderGroupContext,\n} from '../Placeholder/Placeholder';\n\nconst LAYOUT_MAP = {\n  page({\n    lines,\n    children,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"4x\" {...rootProps}>\n        <Space placeContent=\"space-between\">\n          <Placeholder isStatic={isStatic} width=\"100px 25% 300px\" />\n          <Placeholder isStatic={isStatic} width=\"50px 10% 150px\" />\n        </Space>\n        <Flow gap=\"2x\">\n          {children ||\n            Array(lines || 5)\n              .fill(0)\n              .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n        </Flow>\n      </Flow>\n    );\n  },\n  content({\n    children,\n    lines,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"2x\" {...rootProps}>\n        {children ||\n          Array(lines || 5)\n            .fill(0)\n            .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n      </Flow>\n    );\n  },\n  topbar({ isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Space\n        gap=\"4x\"\n        placeContent=\"space-between\"\n        height=\"6x\"\n        padding=\"1x\"\n        border=\"bottom\"\n        {...rootProps}\n      >\n        <Space>\n          <Placeholder circle isStatic={isStatic} size=\"4x\" />\n          <Placeholder isStatic={isStatic} width=\"20x\" />\n        </Space>\n\n        <Space>\n          <Placeholder isStatic={isStatic} width=\"10x\" />\n          <Placeholder circle isStatic={isStatic} size=\"4x\" />\n        </Space>\n      </Space>\n    );\n  },\n  menu({ lines, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"3.25x\" padding=\"3x 1x\" {...rootProps}>\n        {Array(lines || 5)\n          .fill(0)\n          .map((item, i) => (\n            <Placeholder key={i} isStatic={isStatic} />\n          ))}\n      </Flow>\n    );\n  },\n  stats({ cards, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Space gap=\"4x\" {...rootProps}>\n        {Array(cards || 3)\n          .fill(0)\n          .map((item, i) => (\n            <Placeholder\n              key={i}\n              isStatic={isStatic}\n              radius=\"1r\"\n              width=\"20x\"\n              height=\"12x\"\n              flexGrow={1}\n            />\n          ))}\n      </Space>\n    );\n  },\n  tabs({\n    tabs,\n    children,\n    lines,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"4x\" {...rootProps}>\n        <Space>\n          {Array(tabs || 3)\n            .fill(0)\n            .map((item, i) => (\n              <Placeholder key={i} isStatic={isStatic} width=\"15x\" />\n            ))}\n        </Space>\n        <Flow gap=\"2x\">\n          {children ||\n            Array(lines || 5)\n              .fill(0)\n              .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n        </Flow>\n      </Flow>\n    );\n  },\n  table({\n    rows,\n    columns,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    columns = columns || 5;\n    rows = rows || 5;\n\n    return (\n      <Grid\n        columns={`repeat(${columns}, 1fr)`}\n        gap=\"3x\"\n        padding=\"1x 0\"\n        {...rootProps}\n      >\n        {Array(rows)\n          .fill(0)\n          .map((item, i) => {\n            return Array(columns)\n              .fill(0)\n              .map((item, j) => {\n                return (\n                  <Placeholder\n                    key={`${i}.${j}`}\n                    isStatic={isStatic}\n                    size={!i ? '3x' : '2x'}\n                  />\n                );\n              });\n          })}\n      </Grid>\n    );\n  },\n  chart({ columns, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    columns = columns || 12;\n\n    const heightMap = [1, 4, 2, 5, 8, 9, 5, 3, 4, 2, 6, 7, 2];\n\n    return (\n      <Grid\n        columns={`repeat(${columns}, 1fr)`}\n        gap=\"3x\"\n        padding=\"1x 0\"\n        placeItems=\"end stretch\"\n        height=\"40x\"\n        {...rootProps}\n      >\n        {Array(columns)\n          .fill(0)\n          .map((item, i) => {\n            return (\n              <Placeholder\n                key={i}\n                isStatic={isStatic}\n                height={`${heightMap[i % 12] * 10}%`}\n                width=\"max 6x\"\n              />\n            );\n          })}\n      </Grid>\n    );\n  },\n} as const;\n\nexport interface CubeSkeletonProps\n  extends CubeSkeletonRootProps,\n    Omit<CubeSkeletonLayoutProps, 'rootProps'> {\n  /** The type of the layout */\n  layout?: keyof typeof LAYOUT_MAP;\n}\n\nexport interface CubeSkeletonRootProps\n  extends Omit<CubeGridProps, 'columns' | 'rows'>,\n    CubePlaceholderProps,\n    BaseProps,\n    ContainerStyleProps {}\n\nexport interface CubeSkeletonLayoutProps {\n  /** The number of columns for the table layout */\n  columns?: number;\n  /** The number of rows for the table layout */\n  rows?: number;\n  /** The number of placeholder lines */\n  lines?: number;\n  /** The number of tabs */\n  tabs?: number;\n  /** The number of cards */\n  cards?: number;\n  /** The static mode */\n  isStatic?: boolean;\n  rootProps?: CubeSkeletonRootProps;\n  children?: ReactNode;\n}\n\nexport function Skeleton({\n  layout,\n  isStatic,\n  columns,\n  rows,\n  lines,\n  tabs,\n  cards,\n  children,\n  ...props\n}: CubeSkeletonProps) {\n  const { t } = useI18n();\n\n  layout = layout || 'page';\n\n  // One \"Content is loading\" region for the whole layout, rather than one per\n  // bar: a page skeleton would otherwise list a dozen identical landmarks.\n  return LAYOUT_MAP[layout] ? (\n    <PlaceholderGroupContext.Provider value>\n      {LAYOUT_MAP[layout]({\n        isStatic,\n        columns,\n        rows,\n        lines,\n        tabs,\n        cards,\n        children,\n        rootProps: {\n          qa: 'Skeleton',\n          role: 'region',\n          'aria-label': t('placeholder.contentIsLoading', 'Content is loading'),\n          ...props,\n        },\n      })}\n    </PlaceholderGroupContext.Provider>\n  ) : (\n    <Placeholder qa=\"Skeleton\" isStatic={isStatic} {...props}>\n      {children}\n    </Placeholder>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"Skeleton.js","names":["BaseProps","ContainerStyleProps","ReactNode","useI18n","Flow","CubeGridProps","Grid","Space","CubePlaceholderProps","Placeholder","PlaceholderGroupContext","LAYOUT_MAP","page","lines","children","isStatic","rootProps","CubeSkeletonLayoutProps","Array","fill","map","item","i","content","topbar","menu","stats","cards","tabs","table","rows","columns","j","chart","heightMap","const","CubeSkeletonProps","CubeSkeletonRootProps","Omit","layout","Skeleton","t0","props","t","qa","role"],"sources":["../../../../src/components/content/Skeleton/Skeleton.tsx"],"sourcesContent":["import { BaseProps, ContainerStyleProps } from '@tenphi/tasty';\nimport { ReactNode } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { Flow } from '../../layout/Flow';\nimport { CubeGridProps, Grid } from '../../layout/Grid';\nimport { Space } from '../../layout/Space';\nimport {\n  CubePlaceholderProps,\n  Placeholder,\n  PlaceholderGroupContext,\n} from '../Placeholder/Placeholder';\n\nconst LAYOUT_MAP = {\n  page({\n    lines,\n    children,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"4x\" {...rootProps}>\n        <Space placeContent=\"space-between\">\n          <Placeholder isStatic={isStatic} width=\"100px 25% 300px\" />\n          <Placeholder isStatic={isStatic} width=\"50px 10% 150px\" />\n        </Space>\n        <Flow gap=\"2x\">\n          {children ||\n            Array(lines || 5)\n              .fill(0)\n              .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n        </Flow>\n      </Flow>\n    );\n  },\n  content({\n    children,\n    lines,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"2x\" {...rootProps}>\n        {children ||\n          Array(lines || 5)\n            .fill(0)\n            .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n      </Flow>\n    );\n  },\n  topbar({ isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Space\n        gap=\"4x\"\n        placeContent=\"space-between\"\n        height=\"6x\"\n        padding=\"1x\"\n        border=\"bottom\"\n        {...rootProps}\n      >\n        <Space>\n          <Placeholder circle isStatic={isStatic} size=\"4x\" />\n          <Placeholder isStatic={isStatic} width=\"20x\" />\n        </Space>\n\n        <Space>\n          <Placeholder isStatic={isStatic} width=\"10x\" />\n          <Placeholder circle isStatic={isStatic} size=\"4x\" />\n        </Space>\n      </Space>\n    );\n  },\n  menu({ lines, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"3.25x\" padding=\"3x 1x\" {...rootProps}>\n        {Array(lines || 5)\n          .fill(0)\n          .map((item, i) => (\n            <Placeholder key={i} isStatic={isStatic} />\n          ))}\n      </Flow>\n    );\n  },\n  stats({ cards, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    return (\n      <Space gap=\"4x\" {...rootProps}>\n        {Array(cards || 3)\n          .fill(0)\n          .map((item, i) => (\n            <Placeholder\n              key={i}\n              isStatic={isStatic}\n              radius=\"1r\"\n              width=\"20x\"\n              height=\"12x\"\n              flexGrow={1}\n            />\n          ))}\n      </Space>\n    );\n  },\n  tabs({\n    tabs,\n    children,\n    lines,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    return (\n      <Flow gap=\"4x\" {...rootProps}>\n        <Space>\n          {Array(tabs || 3)\n            .fill(0)\n            .map((item, i) => (\n              <Placeholder key={i} isStatic={isStatic} width=\"15x\" />\n            ))}\n        </Space>\n        <Flow gap=\"2x\">\n          {children ||\n            Array(lines || 5)\n              .fill(0)\n              .map((item, i) => <Placeholder key={i} isStatic={isStatic} />)}\n        </Flow>\n      </Flow>\n    );\n  },\n  table({\n    rows,\n    columns,\n    isStatic = false,\n    rootProps,\n  }: CubeSkeletonLayoutProps) {\n    columns = columns || 5;\n    rows = rows || 5;\n\n    return (\n      <Grid\n        columns={`repeat(${columns}, 1fr)`}\n        gap=\"3x\"\n        padding=\"1x 0\"\n        {...rootProps}\n      >\n        {Array(rows)\n          .fill(0)\n          .map((item, i) => {\n            return Array(columns)\n              .fill(0)\n              .map((item, j) => {\n                return (\n                  <Placeholder\n                    key={`${i}.${j}`}\n                    isStatic={isStatic}\n                    size={!i ? '3x' : '2x'}\n                  />\n                );\n              });\n          })}\n      </Grid>\n    );\n  },\n  chart({ columns, isStatic = false, rootProps }: CubeSkeletonLayoutProps) {\n    columns = columns || 12;\n\n    const heightMap = [1, 4, 2, 5, 8, 9, 5, 3, 4, 2, 6, 7, 2];\n\n    return (\n      <Grid\n        columns={`repeat(${columns}, 1fr)`}\n        gap=\"3x\"\n        padding=\"1x 0\"\n        placeItems=\"end stretch\"\n        height=\"40x\"\n        {...rootProps}\n      >\n        {Array(columns)\n          .fill(0)\n          .map((item, i) => {\n            return (\n              <Placeholder\n                key={i}\n                isStatic={isStatic}\n                height={`${heightMap[i % 12] * 10}%`}\n                width=\"max 6x\"\n              />\n            );\n          })}\n      </Grid>\n    );\n  },\n} as const;\n\nexport interface CubeSkeletonProps\n  extends CubeSkeletonRootProps, Omit<CubeSkeletonLayoutProps, 'rootProps'> {\n  /** The type of the layout */\n  layout?: keyof typeof LAYOUT_MAP;\n}\n\nexport interface CubeSkeletonRootProps\n  extends\n    Omit<CubeGridProps, 'columns' | 'rows'>,\n    CubePlaceholderProps,\n    BaseProps,\n    ContainerStyleProps {}\n\nexport interface CubeSkeletonLayoutProps {\n  /** The number of columns for the table layout */\n  columns?: number;\n  /** The number of rows for the table layout */\n  rows?: number;\n  /** The number of placeholder lines */\n  lines?: number;\n  /** The number of tabs */\n  tabs?: number;\n  /** The number of cards */\n  cards?: number;\n  /** The static mode */\n  isStatic?: boolean;\n  rootProps?: CubeSkeletonRootProps;\n  children?: ReactNode;\n}\n\nexport function Skeleton({\n  layout,\n  isStatic,\n  columns,\n  rows,\n  lines,\n  tabs,\n  cards,\n  children,\n  ...props\n}: CubeSkeletonProps) {\n  const { t } = useI18n();\n\n  layout = layout || 'page';\n\n  // One \"Content is loading\" region for the whole layout, rather than one per\n  // bar: a page skeleton would otherwise list a dozen identical landmarks.\n  return LAYOUT_MAP[layout] ? (\n    <PlaceholderGroupContext.Provider value>\n      {LAYOUT_MAP[layout]({\n        isStatic,\n        columns,\n        rows,\n        lines,\n        tabs,\n        cards,\n        children,\n        rootProps: {\n          qa: 'Skeleton',\n          role: 'region',\n          'aria-label': t('placeholder.contentIsLoading', 'Content is loading'),\n          ...props,\n        },\n      })}\n    </PlaceholderGroupContext.Provider>\n  ) : (\n    <Placeholder qa=\"Skeleton\" isStatic={isStatic} {...props}>\n      {children}\n    </Placeholder>\n  );\n}\n"],"mappings":";;;;;;;;AAaA,MAAMW,aAAa;CACjBC,KAAK,EACHC,OACAC,UACAC,WAAW,OACXC,aAC0B;EAC1B,OACE,qBAAC,MAAD;GAAM,KAAI;GAAK,GAAIA;GAAnB,UAAA,CACE,qBAAC,OAAD;IAAO,cAAa;IAApB,UAAA,CACE,oBAAC,aAAD;KAAuBD;KAAU,OAAM;IAAiB,CAAA,GACxD,oBAAC,aAAD;KAAuBA;KAAU,OAAM;IAAgB,CAAA,CAClD;GACP,CAAA,GAAA,oBAAC,MAAD;IAAM,KAAI;IACPD,UAAAA,YACCI,MAAML,SAAS,CAAC,CAAC,CACdM,KAAK,CAAC,CAAC,CACPC,KAAKC,MAAMC,MAAM,oBAAC,aAAD,EAA+BP,SAAS,GAAtBO,CAAsB,CAAG;GAC7D,CAAA,CACF;;CAEV;CACAC,QAAQ,EACNT,UACAD,OACAE,WAAW,OACXC,aAC0B;EAC1B,OACE,oBAAC,MAAD;GAAM,KAAI;GAAK,GAAIA;GAChBF,UAAAA,YACCI,MAAML,SAAS,CAAC,CAAC,CACdM,KAAK,CAAC,CAAC,CACPC,KAAKC,MAAMC,MAAM,oBAAC,aAAD,EAA+BP,SAAS,GAAtBO,CAAsB,CAAG;EAC7D,CAAA;CAEV;CACAE,OAAO,EAAET,WAAW,OAAOC,aAAsC;EAC/D,OACE,qBAAC,OAAD;GACE,KAAI;GACJ,cAAa;GACb,QAAO;GACP,SAAQ;GACR,QAAO;GACP,GAAIA;GANN,UAAA,CAQE,qBAAC,OAAD,EAAA,UAAA,CACE,oBAAC,aAAD;IAAa,QAAA;IAAiBD;IAAU,MAAK;GAAI,CAAA,GACjD,oBAAC,aAAD;IAAuBA;IAAU,OAAM;GAAK,CAAA,CACvC,EAAA,CAAA,GAEP,qBAAC,OAAD,EAAA,UAAA,CACE,oBAAC,aAAD;IAAuBA;IAAU,OAAM;GAAK,CAAA,GAC5C,oBAAC,aAAD;IAAa,QAAA;IAAiBA;IAAU,MAAK;GAAI,CAAA,CAC5C,EAAA,CAAA,CACF;;CAEX;CACAU,KAAK,EAAEZ,OAAOE,WAAW,OAAOC,aAAsC;EACpE,OACE,oBAAC,MAAD;GAAM,KAAI;GAAQ,SAAQ;GAAQ,GAAIA;GACnCE,UAAAA,MAAML,SAAS,CAAC,CAAC,CACfM,KAAK,CAAC,CAAC,CACPC,KAAKC,MAAMC,MACV,oBAAC,aAAD,EAA+BP,SAAS,GAAtBO,CAAsB,CACzC;EACC,CAAA;CAEV;CACAI,MAAM,EAAEC,OAAOZ,WAAW,OAAOC,aAAsC;EACrE,OACE,oBAAC,OAAD;GAAO,KAAI;GAAK,GAAIA;GACjBE,UAAAA,MAAMS,SAAS,CAAC,CAAC,CACfR,KAAK,CAAC,CAAC,CACPC,KAAKC,MAAMC,MACV,oBAAC,aAAD;IAEYP;IACV,QAAO;IACP,OAAM;IACN,QAAO;IACP,UAAU;GAAE,GALPO,CAKO,CAEf;EACE,CAAA;CAEX;CACAM,KAAK,EACHA,MACAd,UACAD,OACAE,WAAW,OACXC,aAC0B;EAC1B,OACE,qBAAC,MAAD;GAAM,KAAI;GAAK,GAAIA;GAAnB,UAAA,CACE,oBAAC,OAAD,EAAA,UACGE,MAAMU,QAAQ,CAAC,CAAC,CACdT,KAAK,CAAC,CAAC,CACPC,KAAKC,MAAMC,MACV,oBAAC,aAAD;IAA+BP;IAAU,OAAM;GAAK,GAAlCO,CAAkC,CACrD,EACE,CAAA,GACP,oBAAC,MAAD;IAAM,KAAI;IACPR,UAAAA,YACCI,MAAML,SAAS,CAAC,CAAC,CACdM,KAAK,CAAC,CAAC,CACPC,KAAKC,MAAMC,MAAM,oBAAC,aAAD,EAA+BP,SAAS,GAAtBO,CAAsB,CAAG;GAC7D,CAAA,CACF;;CAEV;CACAO,MAAM,EACJC,MACAC,SACAhB,WAAW,OACXC,aAC0B;EAC1Be,UAAUA,WAAW;EACrBD,OAAOA,QAAQ;EAEf,OACE,oBAAC,MAAD;GACE,SAAS,UAAUC,QAAO;GAC1B,KAAI;GACJ,SAAQ;GACR,GAAIf;GAEHE,UAAAA,MAAMY,IAAI,CAAC,CACTX,KAAK,CAAC,CAAC,CACPC,KAAKC,MAAMC,MAAM;IAChB,OAAOJ,MAAMa,OAAO,CAAC,CAClBZ,KAAK,CAAC,CAAC,CACPC,KAAKC,MAAMW,MAAM;KAChB,OACE,oBAAC,aAAD;MAEYjB;MACV,MAAM,CAACO,IAAI,OAAO;KAAK,GAFlB,GAAGA,EAAC,GAAIU,GAEU;IAG7B,CAAC;GACL,CAAC;EACC,CAAA;CAEV;CACAC,MAAM,EAAEF,SAAShB,WAAW,OAAOC,aAAsC;EACvEe,UAAUA,WAAW;EAErB,MAAMG,YAAY;GAAC;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;GAAG;EAAC;EAExD,OACE,oBAAC,MAAD;GACE,SAAS,UAAUH,QAAO;GAC1B,KAAI;GACJ,SAAQ;GACR,YAAW;GACX,QAAO;GACP,GAAIf;GAEHE,UAAAA,MAAMa,OAAO,CAAC,CACZZ,KAAK,CAAC,CAAC,CACPC,KAAKC,MAAMC,MAAM;IAChB,OACE,oBAAC,aAAD;KAEYP;KACV,QAAQ,GAAGmB,UAAUZ,IAAI,MAAM,GAAE;KACjC,OAAM;IAAQ,GAHTA,CAGS;GAGpB,CAAC;EACC,CAAA;CAEV;AACF;AAgCA,SAAOkB,SAAAC,IAAA;CAAkB,IAAA,EAAAF,QAAAxB,UAAAgB,SAAAD,MAAAjB,OAAAe,MAAAD,OAAAb,UAAA,GAAA4B,UAAAD;CAWvB,MAAA,EAAAE,MAAcxC,QAAQ;CAEtBoC,SAASA,UAAAA;CAAH,OAIC5B,WAAW4B,UAChB,oBAAA,wBAAA,UAAA;EAAkC,OAAA;EAC/B5B,UAAAA,WAAW4B,OAAO,CAAC;GAAAxB;GAAAgB;GAAAD;GAAAjB;GAAAe;GAAAD;GAAAb;GAAAE,WAQP;IAAA4B,IACL;IAAUC,MACR;IAAQ,cACAF,EAAE,gCAAgC,oBAAoB;IAAC,GAClED;GACL;EACF,CAAC;CACH,CAAA,IAEA,oBAAC,aAAD;EAAgB,IAAA;EAAqB3B;EAAQ,GAAM2B;EAChD5B;CADS,CAAA;AAGb"}

package/dist/components/content/Tag/Tag.d.ts

@@ -1,11 +1,9 @@
 
 import "../Item/index.js";
-import { CubeItemProps } from "../Item/Item.js";
+import { CubeItemBaseProps as CubeItemProps } from "../Item/Item.js";
 import { Styles } from "@tenphi/tasty";
-import * as react from "react";
-
 //#region src/components/content/Tag/Tag.d.ts
-interface CubeTagProps extends CubeItemProps {
+export interface CubeTagProps extends CubeItemProps {
   /**
    * Visual theme. Every value but `special` is a soft card — pale fill, tinted
    * border, strong colored text. `primary` and `special` are the same brand
@@ -16,7 +14,7 @@ interface CubeTagProps extends CubeItemProps {
   onClose?: () => void;
   closeButtonStyles?: Styles;
 }
-declare const _Tag: react.ForwardRefExoticComponent<CubeTagProps & react.RefAttributes<unknown>>;
+declare const _Tag: import("react").ForwardRefExoticComponent<CubeTagProps & import("react").RefAttributes<unknown>>;
 //#endregion
-export { CubeTagProps, _Tag };
+export { _Tag as Tag };
 //# sourceMappingURL=Tag.d.ts.map

package/dist/components/content/Tag/Tag.js

@@ -1,13 +1,12 @@
-/** @license MIT | @cube-dev/ui-kit v0.196.0 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.198.0 | Cube Dev Team */
 import { mergeStyleLayers } from "../../../utils/styles.js";
 import { useI18n } from "../../../i18n/useI18n.js";
-import { _Item } from "../Item/Item.js";
+import { Item as _Item } from "../Item/Item.js";
 import { CloseIcon } from "../../../icons/CloseIcon.js";
 import { c } from "react/compiler-runtime";
 import { tasty } from "@tenphi/tasty";
 import { forwardRef } from "react";
 import { jsx } from "react/jsx-runtime";
-
 //#region src/components/content/Tag/Tag.tsx
 const TagElement = tasty(_Item, {
 	qa: "Tag",
@@ -108,7 +107,7 @@ function Tag(allProps, ref) {
 }
 const _Tag = forwardRef(Tag);
 _Tag.displayName = "Tag";
-
 //#endregion
-export { _Tag };
+export { _Tag as Tag };
+
 //# sourceMappingURL=Tag.js.map

package/dist/components/content/Tag/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","names":["Styles","tasty","forwardRef","ItemVariant","useI18n","CloseIcon","mergeStyleLayers","CubeItemProps","Item","TagElement","qa","role","styles","padding","preset","border","Label","textAlign","placeSelf","CubeTagProps","theme","isClosable","onClose","closeButtonStyles","Tag","allProps","ref","$","_c","t","children","mods","props","t0","t1","size","undefined","type","t2","t3","color","t4","_Tag","displayName"],"sources":["../../../../src/components/content/Tag/Tag.tsx"],"sourcesContent":["import { Styles, tasty } from '@tenphi/tasty';\nimport { forwardRef } from 'react';\nimport { ItemVariant } from 'src/data/item-themes';\n\nimport { useI18n } from '../../../i18n';\nimport { CloseIcon } from '../../../icons/CloseIcon';\nimport { mergeStyleLayers } from '../../../utils/styles';\nimport { CubeItemProps, Item } from '../Item';\n\nconst TagElement = tasty(Item, {\n  qa: 'Tag',\n  role: 'status',\n  styles: {\n    padding: 0,\n    preset: {\n      '': 'tag',\n      'size=xsmall': 't4',\n      'size=small | size=medium': 't3',\n      'size=large | size=xlarge': 't2',\n    },\n    border: {\n      // extend\n      'type=primary': '#clear',\n    },\n\n    '$min-inline-padding': '.5x',\n\n    Label: {\n      textAlign: 'center',\n      placeSelf: 'center',\n    },\n  },\n});\n\nexport interface CubeTagProps extends CubeItemProps {\n  /**\n   * Visual theme. Every value but `special` is a soft card — pale fill, tinted\n   * border, strong colored text. `primary` and `special` are the same brand\n   * hue at two weights: `primary` is the soft card, `special` the solid fill.\n   */\n  theme?:\n    | 'default'\n    | 'primary'\n    | 'danger'\n    | 'success'\n    | 'warning'\n    | 'note'\n    | 'special';\n  isClosable?: boolean;\n  onClose?: () => void;\n  closeButtonStyles?: Styles;\n}\n\nfunction Tag(allProps: CubeTagProps, ref) {\n  const { t } = useI18n();\n\n  let {\n    theme = 'default',\n    isClosable,\n    onClose,\n    closeButtonStyles,\n    children,\n    size = 'inline',\n    mods,\n    ...props\n  } = allProps;\n\n  let type = 'card';\n\n  // `special` is the SOLID brand chip, and it is spelled as the `default`\n  // theme's `primary` type rather than as a theme of its own. Not a typo to be\n  // tidied into `theme = 'primary'`: that is the SOFT brand card\n  // (`primary.card`), which is a different weight and reachable under its own\n  // name. The two are deliberately separate spellings of the same hue.\n  if (theme === 'special') {\n    theme = 'default';\n    type = 'primary';\n  }\n\n  return (\n    <TagElement\n      ref={ref}\n      size={size}\n      data-type={type}\n      variant={`${theme}.${type}` as ItemVariant}\n      mods={mods}\n      actions={\n        isClosable ? (\n          <Item.Action\n            aria-label={t('tag.close', 'Close')}\n            styles={mergeStyleLayers({ color: '#current' }, closeButtonStyles)}\n            icon={<CloseIcon />}\n            onPress={onClose}\n          />\n        ) : undefined\n      }\n      {...props}\n    >\n      {children}\n    </TagElement>\n  );\n}\n\nconst _Tag = forwardRef(Tag);\n\n_Tag.displayName = 'Tag';\n\nexport { _Tag as Tag };\n"],"mappings":";;;;;;;;;;;AASA,MAAMS,aAAaR,MAAMO,OAAM;CAC7BE,IAAI;CACJC,MAAM;CACNC,QAAQ;EACNC,SAAS;EACTC,QAAQ;GACN,IAAI;GACJ,eAAe;GACf,4BAA4B;GAC5B,4BAA4B;GAC7B;EACDC,QAAQ,EAEN,gBAAgB,UACjB;EAED,uBAAuB;EAEvBC,OAAO;GACLC,WAAW;GACXC,WAAW;GACb;EACF;CACD,CAAC;AAqBF,SAAAM,IAAAC,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,GAAA;CACE,MAAA,EAAAC,MAAczB,SAAS;CAAC,IAAA0B;CAAA,IAAAP;CAAA,IAAAF;CAAA,IAAAU;CAAA,IAAAT;CAAA,IAAAU;CAAA,IAAAC;CAAA,IAAAC;AAAA,KAAAP,EAAA,OAAAF,UAAA;AAExB,GAAA,CAAAL,OAAAa,IAAAZ,YAAAC,SAAAC,mBAAAO,UAAAK,MAAAD,IAAAH,SAAAC,SASIP;AAASE,IAAA,KAAAF;AAAAE,IAAA,KAAAG;AAAAH,IAAA,KAAAJ;AAAAI,IAAA,KAAAN;AAAAM,IAAA,KAAAI;AAAAJ,IAAA,KAAAL;AAAAK,IAAA,KAAAK;AAAAL,IAAA,KAAAM;AAAAN,IAAA,KAAAO;QAAA;AAAAJ,aAAAH,EAAA;AAAAJ,sBAAAI,EAAA;AAAAN,eAAAM,EAAA;AAAAI,SAAAJ,EAAA;AAAAL,YAAAK,EAAA;AAAAK,UAAAL,EAAA;AAAAM,OAAAN,EAAA;AAAAO,OAAAP,EAAA;;CARX,IAAAP,QAAAa,OAAAG,SAAA,YAAAH;CAKA,MAAAE,OAAAD,OAAAE,SAAA,WAAAF;CAKF,IAAAG,OAAW;AAOX,KAAIjB,UAAU,WAAS;AACrBA,UAAQA;AACRiB,SAAOA;;CAQI,MAAAC,KAAA,GAAGlB,MAAK,GAAIiB;CAAqB,IAAAE;AAAA,KAAAZ,EAAA,OAAAJ,qBAAAI,EAAA,QAAAN,cAAAM,EAAA,QAAAL,WAAAK,EAAA,QAAAE,GAAA;AAGxCU,OAAAlB,aACE,oBAAA,MAAA;GACc,cAAAQ,EAAE,aAAa,QAAO;GAC1B,QAAAvB,iBAAiB,EAAAkC,OAAS,YAAY,EAAEjB,kBAAiB;GAC3D,MAAA,oBAAC,cAAW;GACTD,SAAAA;IAEA,GAPbc;AAOaT,IAAA,KAAAJ;AAAAI,IAAA,MAAAN;AAAAM,IAAA,MAAAL;AAAAK,IAAA,MAAAE;AAAAF,IAAA,MAAAY;OAAAA,MAAAZ,EAAA;CAAA,IAAAc;AAAA,KAAAd,EAAA,QAAAG,YAAAH,EAAA,QAAAI,QAAAJ,EAAA,QAAAK,SAAAL,EAAA,QAAAD,OAAAC,EAAA,QAAAQ,QAAAR,EAAA,QAAAW,MAAAX,EAAA,QAAAY,MAAAZ,EAAA,QAAAU,MAAA;AAdjBI,OAAA,oBAAC;GACMf;GACCS;GACKE,aAAAA;GACF,SAAAC;GACHP;GAEJ,SAAAQ;GAOa,GAEXP;GAEHF;IACU;AAAAH,IAAA,MAAAG;AAAAH,IAAA,MAAAI;AAAAJ,IAAA,MAAAK;AAAAL,IAAA,MAAAD;AAAAC,IAAA,MAAAQ;AAAAR,IAAA,MAAAW;AAAAX,IAAA,MAAAY;AAAAZ,IAAA,MAAAU;AAAAV,IAAA,MAAAc;OAAAA,MAAAd,EAAA;AAAA,QAnBbc;;AAuBJ,MAAMC,OAAOxC,WAAWsB,IAAI;AAE5BkB,KAAKC,cAAc"}
+{"version":3,"file":"Tag.js","names":["Styles","tasty","forwardRef","ItemVariant","useI18n","CloseIcon","mergeStyleLayers","CubeItemProps","Item","TagElement","qa","role","styles","padding","preset","border","Label","textAlign","placeSelf","CubeTagProps","theme","isClosable","onClose","closeButtonStyles","Tag","allProps","ref","$","_c","t","children","mods","props","t0","t1","size","undefined","type","t2","t3","color","t4","_Tag","displayName","Item","_c"],"sources":["../../../../src/components/content/Tag/Tag.tsx"],"sourcesContent":["import { Styles, tasty } from '@tenphi/tasty';\nimport { forwardRef } from 'react';\n\nimport { ItemVariant } from '../../../data/item-themes';\nimport { useI18n } from '../../../i18n';\nimport { CloseIcon } from '../../../icons/CloseIcon';\nimport { mergeStyleLayers } from '../../../utils/styles';\nimport { CubeItemProps, Item } from '../Item';\n\nconst TagElement = tasty(Item, {\n  qa: 'Tag',\n  role: 'status',\n  styles: {\n    padding: 0,\n    preset: {\n      '': 'tag',\n      'size=xsmall': 't4',\n      'size=small | size=medium': 't3',\n      'size=large | size=xlarge': 't2',\n    },\n    border: {\n      // extend\n      'type=primary': '#clear',\n    },\n\n    '$min-inline-padding': '.5x',\n\n    Label: {\n      textAlign: 'center',\n      placeSelf: 'center',\n    },\n  },\n});\n\nexport interface CubeTagProps extends CubeItemProps {\n  /**\n   * Visual theme. Every value but `special` is a soft card — pale fill, tinted\n   * border, strong colored text. `primary` and `special` are the same brand\n   * hue at two weights: `primary` is the soft card, `special` the solid fill.\n   */\n  theme?:\n    | 'default'\n    | 'primary'\n    | 'danger'\n    | 'success'\n    | 'warning'\n    | 'note'\n    | 'special';\n  isClosable?: boolean;\n  onClose?: () => void;\n  closeButtonStyles?: Styles;\n}\n\nfunction Tag(allProps: CubeTagProps, ref) {\n  const { t } = useI18n();\n\n  let {\n    theme = 'default',\n    isClosable,\n    onClose,\n    closeButtonStyles,\n    children,\n    size = 'inline',\n    mods,\n    ...props\n  } = allProps;\n\n  let type = 'card';\n\n  // `special` is the SOLID brand chip, and it is spelled as the `default`\n  // theme's `primary` type rather than as a theme of its own. Not a typo to be\n  // tidied into `theme = 'primary'`: that is the SOFT brand card\n  // (`primary.card`), which is a different weight and reachable under its own\n  // name. The two are deliberately separate spellings of the same hue.\n  if (theme === 'special') {\n    theme = 'default';\n    type = 'primary';\n  }\n\n  return (\n    <TagElement\n      ref={ref}\n      size={size}\n      data-type={type}\n      variant={`${theme}.${type}` as ItemVariant}\n      mods={mods}\n      actions={\n        isClosable ? (\n          <Item.Action\n            aria-label={t('tag.close', 'Close')}\n            styles={mergeStyleLayers({ color: '#current' }, closeButtonStyles)}\n            icon={<CloseIcon />}\n            onPress={onClose}\n          />\n        ) : undefined\n      }\n      {...props}\n    >\n      {children}\n    </TagElement>\n  );\n}\n\nconst _Tag = forwardRef(Tag);\n\n_Tag.displayName = 'Tag';\n\nexport { _Tag as Tag };\n"],"mappings":";;;;;;;;;;AASA,MAAMS,aAAaR,MAAMO,OAAM;CAC7BE,IAAI;CACJC,MAAM;CACNC,QAAQ;EACNC,SAAS;EACTC,QAAQ;GACN,IAAI;GACJ,eAAe;GACf,4BAA4B;GAC5B,4BAA4B;EAC9B;EACAC,QAAQ,EAEN,gBAAgB,SAClB;EAEA,uBAAuB;EAEvBC,OAAO;GACLC,WAAW;GACXC,WAAW;EACb;CACF;AACF,CAAC;AAqBD,SAAAM,IAAAC,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CACE,MAAA,EAAAC,MAAczB,QAAQ;CAAE,IAAA0B;CAAA,IAAAP;CAAA,IAAAF;CAAA,IAAAU;CAAA,IAAAT;CAAA,IAAAU;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAP,EAAA,OAAAF,UAAA;EAExB,CAAA,CAAAL,OAAAa,IAAAZ,YAAAC,SAAAC,mBAAAO,UAAAK,MAAAD,IAAAH,MAAA,GAAAC,SASIP;EAASE,EAAA,KAAAF;EAAAE,EAAA,KAAAG;EAAAH,EAAA,KAAAJ;EAAAI,EAAA,KAAAN;EAAAM,EAAA,KAAAI;EAAAJ,EAAA,KAAAL;EAAAK,EAAA,KAAAK;EAAAL,EAAA,KAAAM;EAAAN,EAAA,KAAAO;CAAA,OAAA;EAAAJ,WAAAH,EAAA;EAAAJ,oBAAAI,EAAA;EAAAN,aAAAM,EAAA;EAAAI,OAAAJ,EAAA;EAAAL,UAAAK,EAAA;EAAAK,QAAAL,EAAA;EAAAM,KAAAN,EAAA;EAAAO,KAAAP,EAAA;CAAA;CARX,IAAAP,QAAAa,OAAAG,KAAAA,IAAA,YAAAH;CAKA,MAAAE,OAAAD,OAAAE,KAAAA,IAAA,WAAAF;CAKF,IAAAG,OAAW;CAOX,IAAIjB,UAAU,WAAS;EACrBA,QAAQA;EACRiB,OAAOA;CAAH;CAQO,MAAAC,KAAA,GAAGlB,MAAK,GAAIiB;CAAqB,IAAAE;CAAA,IAAAZ,EAAA,OAAAJ,qBAAAI,EAAA,QAAAN,cAAAM,EAAA,QAAAL,WAAAK,EAAA,QAAAE,GAAA;EAGxCU,KAAAlB,aACE,oBAAAuB,MAAA,QAAA;GACc,cAAAf,EAAE,aAAa,OAAO;GAC1B,QAAAvB,iBAAiB,EAAAkC,OAAS,WAAW,GAAGjB,iBAAiB;GAC3D,MAAA,oBAAC,WAAD,CAAU,CAAA;GACPD,SAAAA;EAAO,CAAA,IALpBc,KAAAA;EAOaT,EAAA,KAAAJ;EAAAI,EAAA,MAAAN;EAAAM,EAAA,MAAAL;EAAAK,EAAA,MAAAE;EAAAF,EAAA,MAAAY;CAAA,OAAAA,KAAAZ,EAAA;CAAA,IAAAc;CAAA,IAAAd,EAAA,QAAAG,YAAAH,EAAA,QAAAI,QAAAJ,EAAA,QAAAK,SAAAL,EAAA,QAAAD,OAAAC,EAAA,QAAAQ,QAAAR,EAAA,QAAAW,MAAAX,EAAA,QAAAY,MAAAZ,EAAA,QAAAU,MAAA;EAdjBI,KAAA,oBAAC,YAAD;GACOf;GACCS;GACKE,aAAAA;GACF,SAAAC;GACHP;GAEJ,SAAAQ;GAOa,GAEXP;GAEHF;EAlBQ,CAAA;EAmBEH,EAAA,MAAAG;EAAAH,EAAA,MAAAI;EAAAJ,EAAA,MAAAK;EAAAL,EAAA,MAAAD;EAAAC,EAAA,MAAAQ;EAAAR,EAAA,MAAAW;EAAAX,EAAA,MAAAY;EAAAZ,EAAA,MAAAU;EAAAV,EAAA,MAAAc;CAAA,OAAAA,KAAAd,EAAA;CAAA,OAnBbc;AAmBa;AAIjB,MAAMC,OAAOxC,WAAWsB,GAAG;AAE3BkB,KAAKC,cAAc"}