@cube-dev/ui-kit 0.199.1 → 0.200.0

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

@@ -1 +1 @@
-{"version":3,"file":"Badge.js","names":["tasty","forwardRef","THEMES","CubeItemProps","Item","FILL_STYLES","Object","keys","reduce","map","type","fill","color","BadgeElement","qa","role","size","styles","radius","preset","border","Label","textAlign","placeSelf","CubeBadgeProps","theme","Badge","allProps","ref","$","_c","children","props","t0","t1","undefined","badgeTheme","t2","_Badge","displayName","THEMES","Item","_c"],"sources":["../../../../src/components/content/Badge/Badge.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport { forwardRef } from 'react';\n\nimport THEMES from '../../../data/themes';\nimport { CubeItemProps, Item } from '../Item';\n\nconst FILL_STYLES = Object.keys(THEMES).reduce((map, type) => {\n  map[`theme=${type}`] =\n    type === 'special' ? THEMES[type].fill : THEMES[type].color;\n\n  return map;\n}, {});\n\nconst BadgeElement = tasty(Item, {\n  qa: 'Badge',\n  role: 'status',\n  size: 'inline',\n  styles: {\n    radius: 'round',\n    color: {\n      '': '#white',\n      // Every other theme fills with a fixed accent; `disabled` fills with the\n      // adaptive `#surface-text-soft-2`, which turns light in dark, so its label\n      // flips with it (a fixed `#white` fell to 3.59:1 there).\n      'theme=disabled': '#surface',\n    },\n    fill: {\n      '': '#primary',\n      // eslint-disable-next-line tasty/no-style-spread -- per-theme fill states generated from THEMES\n      ...FILL_STYLES,\n    },\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    '$inline-padding': {\n      '': 'max($min-inline-padding, (($size - 1lh - 2bw) / 2 + $inline-compensation))',\n      'size=inline': '.5x',\n    },\n\n    Label: {\n      textAlign: 'center',\n      placeSelf: 'center',\n    },\n  },\n});\n\nexport interface CubeBadgeProps extends CubeItemProps {\n  /* @deprecated Use theme instead */\n  type?: keyof typeof THEMES | string;\n  theme?: keyof typeof THEMES | string;\n}\n\nfunction Badge(allProps: CubeBadgeProps, ref) {\n  let {\n    type,\n    theme = 'special',\n    children,\n    size = 'inline',\n    ...props\n  } = allProps;\n\n  const badgeTheme = theme ?? type;\n\n  return (\n    <BadgeElement\n      ref={ref}\n      size={size}\n      data-type=\"primary\"\n      data-theme={badgeTheme}\n      {...props}\n    >\n      {children}\n    </BadgeElement>\n  );\n}\n\nconst _Badge = forwardRef(Badge);\n\n_Badge.displayName = 'Badge';\n\nexport { _Badge as Badge };\n"],"mappings":";;;;;;;;AAMA,MAAMK,cAAcC,OAAOC,KAAKL,cAAM,CAAC,CAACM,QAAQC,KAAKC,SAAS;CAC5DD,IAAI,SAASC,UACXA,SAAS,YAAYR,eAAOQ,KAAK,CAACC,OAAOT,eAAOQ,KAAK,CAACE;CAExD,OAAOH;AACT,GAAG,CAAC,CAAC;AAEL,MAAMI,eAAeb,MAAMI,OAAM;CAC/BU,IAAI;CACJC,MAAM;CACNC,MAAM;CACNC,QAAQ;EACNC,QAAQ;EACRN,OAAO;GACL,IAAI;GAIJ,kBAAkB;EACpB;EACAD,MAAM;GACJ,IAAI;GAEJ,GAAGN;EACL;EACAc,QAAQ;GACN,IAAI;GACJ,eAAe;GACf,4BAA4B;GAC5B,4BAA4B;EAC9B;EACAC,QAAQ,EAEN,gBAAgB,SAClB;EAEA,mBAAmB;GACjB,IAAI;GACJ,eAAe;EACjB;EAEAC,OAAO;GACLC,WAAW;GACXC,WAAW;EACb;CACF;AACF,CAAC;AAQD,SAAAG,MAAAC,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAxB;CAAA,IAAAmB,EAAA,OAAAF,UAAA;EACE,CAAA,CAAAjB,MAAAe,OAAAQ,IAAAF,UAAAf,MAAAkB,IAAA,GAAAF,SAMIL;EAASE,EAAA,KAAAF;EAAAE,EAAA,KAAAE;EAAAF,EAAA,KAAAG;EAAAH,EAAA,KAAAI;EAAAJ,EAAA,KAAAK;EAAAL,EAAA,KAAAnB;CAAA,OAAA;EAAAqB,WAAAF,EAAA;EAAAG,QAAAH,EAAA;EAAAI,KAAAJ,EAAA;EAAAK,KAAAL,EAAA;EAAAnB,OAAAmB,EAAA;CAAA;CAJX,MAAAJ,QAAAQ,OAAAE,KAAAA,IAAA,YAAAF;CAEA,MAAAjB,OAAAkB,OAAAC,KAAAA,IAAA,WAAAD;CAIF,MAAAE,aAAmBX,SAAAf;CAAc,IAAA2B;CAAA,IAAAR,EAAA,OAAAO,cAAAP,EAAA,OAAAE,YAAAF,EAAA,OAAAG,SAAAH,EAAA,OAAAD,OAAAC,EAAA,QAAAb,MAAA;EAG/BqB,KAAA,oBAAC,cAAD;GACOT;GACCZ;GACI,aAAA;GACEoB,cAAAA;GAAU,GAClBJ;GAEHD;EAPU,CAAA;EAQEF,EAAA,KAAAO;EAAAP,EAAA,KAAAE;EAAAF,EAAA,KAAAG;EAAAH,EAAA,KAAAD;EAAAC,EAAA,MAAAb;EAAAa,EAAA,MAAAQ;CAAA,OAAAA,KAAAR,EAAA;CAAA,OARfQ;AAQe;AAInB,MAAMC,SAASrC,WAAWyB,KAAK;AAE/BY,OAAOC,cAAc"}
+{"version":3,"file":"Badge.js","names":["tasty","forwardRef","THEMES","CubeItemProps","Item","FILL_STYLES","Object","keys","reduce","map","type","fill","color","BadgeElement","qa","role","size","styles","radius","preset","border","overflow","Label","textAlign","placeSelf","CubeBadgeProps","theme","Badge","allProps","ref","$","_c","children","props","t0","t1","undefined","badgeTheme","t2","_Badge","displayName","THEMES","Item","_c"],"sources":["../../../../src/components/content/Badge/Badge.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport { forwardRef } from 'react';\n\nimport THEMES from '../../../data/themes';\nimport { CubeItemProps, Item } from '../Item';\n\nconst FILL_STYLES = Object.keys(THEMES).reduce((map, type) => {\n  map[`theme=${type}`] =\n    type === 'special' ? THEMES[type].fill : THEMES[type].color;\n\n  return map;\n}, {});\n\nconst BadgeElement = tasty(Item, {\n  qa: 'Badge',\n  role: 'status',\n  size: 'inline',\n  styles: {\n    radius: 'round',\n    color: {\n      '': '#white',\n      // Every other theme fills with a fixed accent; `disabled` fills with the\n      // adaptive `#surface-text-soft-2`, which turns light in dark, so its label\n      // flips with it (a fixed `#white` fell to 3.59:1 there).\n      'theme=disabled': '#surface',\n    },\n    fill: {\n      '': '#primary',\n      // eslint-disable-next-line tasty/no-style-spread -- per-theme fill states generated from THEMES, not a shared base; the plugin can't lint the generated map either way, so it stays in one place\n      ...FILL_STYLES,\n    },\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    '$inline-padding': {\n      '': 'max($min-inline-padding, (($size - 1lh - 2bw) / 2 + $inline-compensation))',\n      'size=inline': '.5x',\n    },\n\n    // Same squeeze as Tag's: keep the label's end-padding box after the icon\n    // and clip what passes the edge, unless end content zeroes that padding.\n    overflow: { '': 'clip', 'has-end-content': 'visible' },\n\n    Label: {\n      textAlign: 'center',\n      placeSelf: 'center stretch',\n    },\n  },\n});\n\nexport interface CubeBadgeProps extends CubeItemProps {\n  /* @deprecated Use theme instead */\n  type?: keyof typeof THEMES | string;\n  theme?: keyof typeof THEMES | string;\n}\n\nfunction Badge(allProps: CubeBadgeProps, ref) {\n  let {\n    type,\n    theme = 'special',\n    children,\n    size = 'inline',\n    ...props\n  } = allProps;\n\n  const badgeTheme = theme ?? type;\n\n  return (\n    <BadgeElement\n      ref={ref}\n      size={size}\n      data-type=\"primary\"\n      data-theme={badgeTheme}\n      {...props}\n    >\n      {children}\n    </BadgeElement>\n  );\n}\n\nconst _Badge = forwardRef(Badge);\n\n_Badge.displayName = 'Badge';\n\nexport { _Badge as Badge };\n"],"mappings":";;;;;;;;AAMA,MAAMK,cAAcC,OAAOC,KAAKL,cAAM,CAAC,CAACM,QAAQC,KAAKC,SAAS;CAC5DD,IAAI,SAASC,UACXA,SAAS,YAAYR,eAAOQ,KAAK,CAACC,OAAOT,eAAOQ,KAAK,CAACE;CAExD,OAAOH;AACT,GAAG,CAAC,CAAC;AAEL,MAAMI,eAAeb,MAAMI,OAAM;CAC/BU,IAAI;CACJC,MAAM;CACNC,MAAM;CACNC,QAAQ;EACNC,QAAQ;EACRN,OAAO;GACL,IAAI;GAIJ,kBAAkB;EACpB;EACAD,MAAM;GACJ,IAAI;GAEJ,GAAGN;EACL;EACAc,QAAQ;GACN,IAAI;GACJ,eAAe;GACf,4BAA4B;GAC5B,4BAA4B;EAC9B;EACAC,QAAQ,EAEN,gBAAgB,SAClB;EAEA,mBAAmB;GACjB,IAAI;GACJ,eAAe;EACjB;EAIAC,UAAU;GAAE,IAAI;GAAQ,mBAAmB;EAAU;EAErDC,OAAO;GACLC,WAAW;GACXC,WAAW;EACb;CACF;AACF,CAAC;AAQD,SAAAG,MAAAC,UAAAC,KAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAzB;CAAA,IAAAoB,EAAA,OAAAF,UAAA;EACE,CAAA,CAAAlB,MAAAgB,OAAAQ,IAAAF,UAAAhB,MAAAmB,IAAA,GAAAF,SAMIL;EAASE,EAAA,KAAAF;EAAAE,EAAA,KAAAE;EAAAF,EAAA,KAAAG;EAAAH,EAAA,KAAAI;EAAAJ,EAAA,KAAAK;EAAAL,EAAA,KAAApB;CAAA,OAAA;EAAAsB,WAAAF,EAAA;EAAAG,QAAAH,EAAA;EAAAI,KAAAJ,EAAA;EAAAK,KAAAL,EAAA;EAAApB,OAAAoB,EAAA;CAAA;CAJX,MAAAJ,QAAAQ,OAAAE,KAAAA,IAAA,YAAAF;CAEA,MAAAlB,OAAAmB,OAAAC,KAAAA,IAAA,WAAAD;CAIF,MAAAE,aAAmBX,SAAAhB;CAAc,IAAA4B;CAAA,IAAAR,EAAA,OAAAO,cAAAP,EAAA,OAAAE,YAAAF,EAAA,OAAAG,SAAAH,EAAA,OAAAD,OAAAC,EAAA,QAAAd,MAAA;EAG/BsB,KAAA,oBAAC,cAAD;GACOT;GACCb;GACI,aAAA;GACEqB,cAAAA;GAAU,GAClBJ;GAEHD;EAPU,CAAA;EAQEF,EAAA,KAAAO;EAAAP,EAAA,KAAAE;EAAAF,EAAA,KAAAG;EAAAH,EAAA,KAAAD;EAAAC,EAAA,MAAAd;EAAAc,EAAA,MAAAQ;CAAA,OAAAA,KAAAR,EAAA;CAAA,OARfQ;AAQe;AAInB,MAAMC,SAAStC,WAAW0B,KAAK;AAE/BY,OAAOC,cAAc"}

package/dist/components/content/Card/Card.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { c } from "react/compiler-runtime";
 import { CONTAINER_STYLES, filterBaseProps, tasty } from "@tenphi/tasty";

package/dist/components/content/Content.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { c } from "react/compiler-runtime";

package/dist/components/content/CopyPasteBlock/CopyPasteBlock.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { useTimer } from "../../../_internal/hooks/use-timer/use-timer.js";
 import { useI18n } from "../../../i18n/useI18n.js";
@@ -36,7 +36,7 @@ const CopyPasteBlockElement = tasty(Card, {
 		fill: "#surface-2",
 		radius: "1r",
 		padding: {
-			"": "0 1px",
+			"": "0 1bw",
 			":focus": "0"
 		},
 		color: {
@@ -45,7 +45,7 @@ const CopyPasteBlockElement = tasty(Card, {
 		},
 		border: {
 			"": "dashed #dark-03",
-			":focus": "2px dashed #primary-text",
+			":focus": "2bw dashed #primary-text",
 			error: "dashed #danger"
 		},
 		cursor: "$pointer",

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

@@ -1 +1 @@
-{"version":3,"file":"CopyPasteBlock.js","names":["POSITION_STYLES","PositionStyleProps","Styles","tasty","copy","ForwardedRef","forwardRef","ReactNode","useState","TextDropItem","useClipboard","useTimer","useI18n","CopyIcon","extractStyles","Button","useToast","Card","CubeCardProps","StyledBlock","styles","display","flow","placeContent","placeItems","gap","position","width","color","padding","userSelect","Label","whiteSpace","overflow","textOverflow","CopyPasteBlockElement","qa","fill","radius","error","border","cursor","preset","height","boxSizing","Grid","gridColumns","Shortcut","hide","CopyButton","type","icon","placeSelf","shadow","focused","outline","CubeCopyPasteBlockProps","Omit","value","placeholder","title","onPaste","text","Promise","onCopy","size","CopyPasteBlock","allProps","ref","HTMLDivElement","props","t","setError","toast","clipboardProps","items","pasted","all","filter","item","kind","types","has","map","getText","join","e","String","getItems","success","delay","callback","isDisabled","pristineValue","replace","_CopyPasteBlock","displayName"],"sources":["../../../../src/components/content/CopyPasteBlock/CopyPasteBlock.tsx"],"sourcesContent":["import {\n  POSITION_STYLES,\n  PositionStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport copy from 'clipboard-copy';\nimport { ForwardedRef, forwardRef, ReactNode, useState } from 'react';\nimport { TextDropItem, useClipboard } from 'react-aria';\n\nimport { useTimer } from '../../../_internal';\nimport { useI18n } from '../../../i18n';\nimport { CopyIcon } from '../../../icons/CopyIcon';\nimport { extractStyles } from '../../../utils/styles';\nimport { Button } from '../../actions';\nimport { useToast } from '../../overlays/Toast';\nimport { Card, CubeCardProps } from '../Card/Card';\n\nconst StyledBlock = tasty({\n  styles: {\n    display: 'grid',\n    flow: 'column',\n    placeContent: 'center space-between',\n    placeItems: 'center stretch',\n    gap: '1x',\n    position: 'relative',\n    width: 'max 100%',\n    color: 'inherit',\n    padding: '0 1.5x',\n    // height: {\n    //   '': '4.5x',\n    //   '[data-size=\"small\"]': '3.5x',\n    //   '[data-size=\"large\"]': '5.5x',\n    // },\n    userSelect: 'none',\n\n    Label: {\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n    },\n  },\n});\n\nconst CopyPasteBlockElement = tasty(Card, {\n  qa: 'CopyPasteBlock',\n  styles: {\n    display: 'grid',\n    fill: '#surface-2',\n    radius: '1r',\n    padding: {\n      '': '0 1px',\n      ':focus': '0',\n    },\n    color: {\n      '': '#dark',\n      error: '#danger-text',\n    },\n    border: {\n      '': 'dashed #dark-03',\n      ':focus': '2px dashed #primary-text',\n      error: 'dashed #danger',\n    },\n    cursor: '$pointer',\n    preset: {\n      '': 't3',\n      'size=large': 't2',\n    },\n    height: {\n      '': '5x',\n      'size=small': '4x',\n      'size=large': '6x',\n    },\n    boxSizing: 'border-box',\n\n    Grid: {\n      display: 'grid',\n      flow: 'row',\n      gridColumns: 'minmax(0, 1fr) min-content',\n      placeContent: 'stretch',\n      width: 'min 20x',\n      radius: '1r',\n      position: 'relative',\n    },\n\n    Shortcut: {\n      display: 'inline',\n      hide: {\n        '': true,\n        ':focus & !error': false,\n      },\n    },\n  },\n});\n\nconst CopyButton = tasty(Button, {\n  type: 'clear',\n  icon: <CopyIcon />,\n  styles: {\n    placeSelf: 'stretch',\n    border: '#clear',\n    shadow: {\n      '': '0 0 0 1ow #purple-03.0 inset',\n      focused: '0 0 0 1ow #purple-03 inset',\n    },\n    radius: {\n      '': '0 1r 1r 0',\n      'multiline | has-scroll': '1r top-right',\n    },\n    height: 'auto',\n    outline: false,\n  },\n});\n\nexport interface CubeCopyPasteBlockProps\n  extends Omit<CubeCardProps, 'onPaste' | 'onCopy'>, PositionStyleProps {\n  padding?: Styles['padding'];\n  /** The code snippet */\n  value?: string;\n  placeholder?: ReactNode;\n  /** The title of the snippet */\n  title?: string;\n  onPaste?: (text: string) => void | Promise<void | string>;\n  onCopy?: () => void;\n  size?: 'small' | 'medium' | 'large';\n}\n\nfunction CopyPasteBlock(\n  allProps: CubeCopyPasteBlockProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    value = '',\n    onPaste,\n    placeholder,\n    title,\n    size = 'medium',\n    ...props\n  } = allProps;\n  const styles = extractStyles(props, POSITION_STYLES);\n\n  const { t } = useI18n();\n  const [error, setError] = useState<string | null>(null);\n  const toast = useToast();\n\n  const { clipboardProps } = useClipboard({\n    async onPaste(items) {\n      let pasted = await Promise.all(\n        items\n          .filter(\n            (item) => item.kind === 'text' && item.types.has('text/plain'),\n          )\n          .map((item) => (item as TextDropItem).getText('text/plain')),\n      );\n      try {\n        await onPaste?.(pasted.join('\\n'));\n      } catch (e) {\n        setError(String(e));\n      }\n    },\n    getItems() {\n      return value\n        ? [\n            {\n              'text/plain': value,\n            },\n          ]\n        : [];\n    },\n    onCopy() {\n      if (value) {\n        toast.success(\n          t('copyPasteBlock.copied', '{{title}} copied', {\n            title: title || t('copyPasteBlock.defaultTitle', 'Text'),\n          }),\n        );\n      }\n    },\n  });\n\n  useTimer({\n    delay: 1000,\n    callback() {\n      setError(null);\n    },\n    isDisabled: !error,\n  });\n\n  async function onCopy() {\n    await copy(value);\n\n    toast.success(\n      t('copyPasteBlock.copied', '{{title}} copied', {\n        title: title || t('copyPasteBlock.defaultTitle', 'Text'),\n      }),\n    );\n  }\n\n  const pristineValue = value.replace(/\\n/, ' ');\n\n  return (\n    <CopyPasteBlockElement\n      ref={ref}\n      mods={{ error: !!error }}\n      data-size={size}\n      styles={styles}\n      tabIndex={0}\n      {...props}\n      {...clipboardProps}\n    >\n      <div data-element=\"Grid\">\n        <StyledBlock\n          data-size={size}\n          mods={{\n            placeholder: !!placeholder || !value,\n          }}\n        >\n          <div data-element=\"Label\">\n            {error != null ? (\n              error || t('copyPasteBlock.invalidData', 'Invalid data')\n            ) : value ? (\n              pristineValue\n            ) : (\n              <>\n                {placeholder\n                  ? placeholder\n                  : t('copyPasteBlock.selectAndPaste', 'Select and paste')}\n              </>\n            )}\n          </div>\n          <span data-element=\"Shortcut\">\n            <kbd>Cmd</kbd> + <kbd>V</kbd>\n          </span>\n        </StyledBlock>\n        {value && !error && (\n          <CopyButton\n            size={size}\n            aria-label={t(\n              'copyPasteBlock.copyToClipboard',\n              'Copy {{title}} to clipboard',\n              {\n                title: title || t('copyPasteBlock.defaultTitle', 'Text'),\n              },\n            )}\n            onPress={onCopy}\n          />\n        )}\n      </div>\n    </CopyPasteBlockElement>\n  );\n}\n\nconst _CopyPasteBlock = forwardRef(CopyPasteBlock);\n\n_CopyPasteBlock.displayName = 'CopyPasteBlock';\n\nexport { _CopyPasteBlock as CopyPasteBlock };\n"],"mappings":"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"}
+{"version":3,"file":"CopyPasteBlock.js","names":["POSITION_STYLES","PositionStyleProps","Styles","tasty","copy","ForwardedRef","forwardRef","ReactNode","useState","TextDropItem","useClipboard","useTimer","useI18n","CopyIcon","extractStyles","Button","useToast","Card","CubeCardProps","StyledBlock","styles","display","flow","placeContent","placeItems","gap","position","width","color","padding","userSelect","Label","whiteSpace","overflow","textOverflow","CopyPasteBlockElement","qa","fill","radius","error","border","cursor","preset","height","boxSizing","Grid","gridColumns","Shortcut","hide","CopyButton","type","icon","placeSelf","shadow","focused","outline","CubeCopyPasteBlockProps","Omit","value","placeholder","title","onPaste","text","Promise","onCopy","size","CopyPasteBlock","allProps","ref","HTMLDivElement","props","t","setError","toast","clipboardProps","items","pasted","all","filter","item","kind","types","has","map","getText","join","e","String","getItems","success","delay","callback","isDisabled","pristineValue","replace","_CopyPasteBlock","displayName"],"sources":["../../../../src/components/content/CopyPasteBlock/CopyPasteBlock.tsx"],"sourcesContent":["import {\n  POSITION_STYLES,\n  PositionStyleProps,\n  Styles,\n  tasty,\n} from '@tenphi/tasty';\nimport copy from 'clipboard-copy';\nimport { ForwardedRef, forwardRef, ReactNode, useState } from 'react';\nimport { TextDropItem, useClipboard } from 'react-aria';\n\nimport { useTimer } from '../../../_internal';\nimport { useI18n } from '../../../i18n';\nimport { CopyIcon } from '../../../icons/CopyIcon';\nimport { extractStyles } from '../../../utils/styles';\nimport { Button } from '../../actions';\nimport { useToast } from '../../overlays/Toast';\nimport { Card, CubeCardProps } from '../Card/Card';\n\nconst StyledBlock = tasty({\n  styles: {\n    display: 'grid',\n    flow: 'column',\n    placeContent: 'center space-between',\n    placeItems: 'center stretch',\n    gap: '1x',\n    position: 'relative',\n    width: 'max 100%',\n    color: 'inherit',\n    padding: '0 1.5x',\n    // height: {\n    //   '': '4.5x',\n    //   '[data-size=\"small\"]': '3.5x',\n    //   '[data-size=\"large\"]': '5.5x',\n    // },\n    userSelect: 'none',\n\n    Label: {\n      whiteSpace: 'nowrap',\n      overflow: 'hidden',\n      textOverflow: 'ellipsis',\n    },\n  },\n});\n\nconst CopyPasteBlockElement = tasty(Card, {\n  qa: 'CopyPasteBlock',\n  styles: {\n    display: 'grid',\n    fill: '#surface-2',\n    radius: '1r',\n    padding: {\n      '': '0 1bw',\n      ':focus': '0',\n    },\n    color: {\n      '': '#dark',\n      error: '#danger-text',\n    },\n    border: {\n      '': 'dashed #dark-03',\n      ':focus': '2bw dashed #primary-text',\n      error: 'dashed #danger',\n    },\n    cursor: '$pointer',\n    preset: {\n      '': 't3',\n      'size=large': 't2',\n    },\n    height: {\n      '': '5x',\n      'size=small': '4x',\n      'size=large': '6x',\n    },\n    boxSizing: 'border-box',\n\n    Grid: {\n      display: 'grid',\n      flow: 'row',\n      gridColumns: 'minmax(0, 1fr) min-content',\n      placeContent: 'stretch',\n      width: 'min 20x',\n      radius: '1r',\n      position: 'relative',\n    },\n\n    Shortcut: {\n      display: 'inline',\n      hide: {\n        '': true,\n        ':focus & !error': false,\n      },\n    },\n  },\n});\n\nconst CopyButton = tasty(Button, {\n  type: 'clear',\n  icon: <CopyIcon />,\n  styles: {\n    placeSelf: 'stretch',\n    border: '#clear',\n    shadow: {\n      '': '0 0 0 1ow #purple-03.0 inset',\n      focused: '0 0 0 1ow #purple-03 inset',\n    },\n    radius: {\n      '': '0 1r 1r 0',\n      'multiline | has-scroll': '1r top-right',\n    },\n    height: 'auto',\n    outline: false,\n  },\n});\n\nexport interface CubeCopyPasteBlockProps\n  extends Omit<CubeCardProps, 'onPaste' | 'onCopy'>, PositionStyleProps {\n  padding?: Styles['padding'];\n  /** The code snippet */\n  value?: string;\n  placeholder?: ReactNode;\n  /** The title of the snippet */\n  title?: string;\n  onPaste?: (text: string) => void | Promise<void | string>;\n  onCopy?: () => void;\n  size?: 'small' | 'medium' | 'large';\n}\n\nfunction CopyPasteBlock(\n  allProps: CubeCopyPasteBlockProps,\n  ref: ForwardedRef<HTMLDivElement>,\n) {\n  const {\n    value = '',\n    onPaste,\n    placeholder,\n    title,\n    size = 'medium',\n    ...props\n  } = allProps;\n  const styles = extractStyles(props, POSITION_STYLES);\n\n  const { t } = useI18n();\n  const [error, setError] = useState<string | null>(null);\n  const toast = useToast();\n\n  const { clipboardProps } = useClipboard({\n    async onPaste(items) {\n      let pasted = await Promise.all(\n        items\n          .filter(\n            (item) => item.kind === 'text' && item.types.has('text/plain'),\n          )\n          .map((item) => (item as TextDropItem).getText('text/plain')),\n      );\n      try {\n        await onPaste?.(pasted.join('\\n'));\n      } catch (e) {\n        setError(String(e));\n      }\n    },\n    getItems() {\n      return value\n        ? [\n            {\n              'text/plain': value,\n            },\n          ]\n        : [];\n    },\n    onCopy() {\n      if (value) {\n        toast.success(\n          t('copyPasteBlock.copied', '{{title}} copied', {\n            title: title || t('copyPasteBlock.defaultTitle', 'Text'),\n          }),\n        );\n      }\n    },\n  });\n\n  useTimer({\n    delay: 1000,\n    callback() {\n      setError(null);\n    },\n    isDisabled: !error,\n  });\n\n  async function onCopy() {\n    await copy(value);\n\n    toast.success(\n      t('copyPasteBlock.copied', '{{title}} copied', {\n        title: title || t('copyPasteBlock.defaultTitle', 'Text'),\n      }),\n    );\n  }\n\n  const pristineValue = value.replace(/\\n/, ' ');\n\n  return (\n    <CopyPasteBlockElement\n      ref={ref}\n      mods={{ error: !!error }}\n      data-size={size}\n      styles={styles}\n      tabIndex={0}\n      {...props}\n      {...clipboardProps}\n    >\n      <div data-element=\"Grid\">\n        <StyledBlock\n          data-size={size}\n          mods={{\n            placeholder: !!placeholder || !value,\n          }}\n        >\n          <div data-element=\"Label\">\n            {error != null ? (\n              error || t('copyPasteBlock.invalidData', 'Invalid data')\n            ) : value ? (\n              pristineValue\n            ) : (\n              <>\n                {placeholder\n                  ? placeholder\n                  : t('copyPasteBlock.selectAndPaste', 'Select and paste')}\n              </>\n            )}\n          </div>\n          <span data-element=\"Shortcut\">\n            <kbd>Cmd</kbd> + <kbd>V</kbd>\n          </span>\n        </StyledBlock>\n        {value && !error && (\n          <CopyButton\n            size={size}\n            aria-label={t(\n              'copyPasteBlock.copyToClipboard',\n              'Copy {{title}} to clipboard',\n              {\n                title: title || t('copyPasteBlock.defaultTitle', 'Text'),\n              },\n            )}\n            onPress={onCopy}\n          />\n        )}\n      </div>\n    </CopyPasteBlockElement>\n  );\n}\n\nconst _CopyPasteBlock = forwardRef(CopyPasteBlock);\n\n_CopyPasteBlock.displayName = 'CopyPasteBlock';\n\nexport { _CopyPasteBlock as CopyPasteBlock };\n"],"mappings":"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"}

package/dist/components/content/CopySnippet/CopySnippet.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { Tooltip as _Tooltip } from "../../overlays/Tooltip/Tooltip.js";
 import { TooltipTrigger } from "../../overlays/Tooltip/TooltipTrigger.js";
 import { useI18n } from "../../../i18n/useI18n.js";
@@ -16,6 +16,10 @@ import { useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import copy from "clipboard-copy";
 //#region src/components/content/CopySnippet/CopySnippet.tsx
+const COPY_SNIPPET_CODE_STYLES = {
+	margin: 0,
+	overflow: "visible"
+};
 const ActionElement = tasty(Action, { styles: {
 	display: "block",
 	cursor: "default",
@@ -131,7 +135,7 @@ function replaceSymbolsToHidden(str) {
 	return HIDDEN_SYMBOL.repeat(str.length);
 }
 function CopySnippet(allProps) {
-	const $ = c(66);
+	const $ = c(65);
 	const { t } = useI18n();
 	let actions;
 	let hideText;
@@ -235,127 +239,119 @@ function CopySnippet(allProps) {
 	const mods = t6;
 	const T0 = CopySnippetElement;
 	const t7 = "Grid";
-	let t8;
-	if ($[28] === Symbol.for("react.memo_cache_sentinel")) {
-		t8 = {
-			margin: 0,
-			overflow: "visible"
-		};
-		$[28] = t8;
-	} else t8 = $[28];
-	const t9 = language || "javascript";
-	let t10;
-	if ($[29] !== formattedCode || $[30] !== shouldWrap || $[31] !== t9) {
-		t10 = /* @__PURE__ */ jsx(_PrismCode, {
-			style: t8,
+	const t8 = language || "javascript";
+	let t9;
+	if ($[28] !== formattedCode || $[29] !== shouldWrap || $[30] !== t8) {
+		t9 = /* @__PURE__ */ jsx(_PrismCode, {
+			styles: COPY_SNIPPET_CODE_STYLES,
 			code: formattedCode,
-			language: t9,
+			language: t8,
 			isWrapped: shouldWrap
 		});
-		$[29] = formattedCode;
-		$[30] = shouldWrap;
+		$[28] = formattedCode;
+		$[29] = shouldWrap;
+		$[30] = t8;
 		$[31] = t9;
-		$[32] = t10;
-	} else t10 = $[32];
-	let t11;
-	if ($[33] !== mods || $[34] !== t10) {
-		t11 = /* @__PURE__ */ jsx(StyledBlock, {
+	} else t9 = $[31];
+	let t10;
+	if ($[32] !== mods || $[33] !== t9) {
+		t10 = /* @__PURE__ */ jsx(StyledBlock, {
 			mods,
-			children: t10
+			children: t9
 		});
-		$[33] = mods;
+		$[32] = mods;
+		$[33] = t9;
 		$[34] = t10;
-		$[35] = t11;
-	} else t11 = $[35];
+	} else t10 = $[34];
 	const T1 = ButtonContainer;
 	const T2 = CopyButton;
-	const t12 = t("copySnippet.copyToClipboard", "Copy {{title}} to clipboard", { title });
-	let t13;
-	if ($[36] !== T2 || $[37] !== onCopy || $[38] !== t12) {
-		t13 = /* @__PURE__ */ jsx(T2, {
-			"aria-label": t12,
+	const t11 = t("copySnippet.copyToClipboard", "Copy {{title}} to clipboard", { title });
+	let t12;
+	if ($[35] !== T2 || $[36] !== onCopy || $[37] !== t11) {
+		t12 = /* @__PURE__ */ jsx(T2, {
+			"aria-label": t11,
 			onPress: onCopy
 		});
-		$[36] = T2;
-		$[37] = onCopy;
+		$[35] = T2;
+		$[36] = onCopy;
+		$[37] = t11;
 		$[38] = t12;
-		$[39] = t13;
-	} else t13 = $[39];
-	let t14;
-	if ($[40] !== hideText || $[41] !== setShowHidden || $[42] !== showHidden || $[43] !== t) {
-		t14 = hideText && /* @__PURE__ */ jsx(ShowButton, {
+	} else t12 = $[38];
+	let t13;
+	if ($[39] !== hideText || $[40] !== setShowHidden || $[41] !== showHidden || $[42] !== t) {
+		t13 = hideText && /* @__PURE__ */ jsx(ShowButton, {
 			"aria-label": t("copySnippet.showHiddenParts", "Show hidden parts"),
 			icon: showHidden ? /* @__PURE__ */ jsx(EyeInvisibleIcon, {}) : /* @__PURE__ */ jsx(EyeIcon, {}),
 			onPress: () => setShowHidden(!showHidden)
 		});
-		$[40] = hideText;
-		$[41] = setShowHidden;
-		$[42] = showHidden;
-		$[43] = t;
-		$[44] = t14;
-	} else t14 = $[44];
-	let t15;
-	if ($[45] !== T1 || $[46] !== actions || $[47] !== mods || $[48] !== t13 || $[49] !== t14) {
-		t15 = /* @__PURE__ */ jsxs(T1, {
+		$[39] = hideText;
+		$[40] = setShowHidden;
+		$[41] = showHidden;
+		$[42] = t;
+		$[43] = t13;
+	} else t13 = $[43];
+	let t14;
+	if ($[44] !== T1 || $[45] !== actions || $[46] !== mods || $[47] !== t12 || $[48] !== t13) {
+		t14 = /* @__PURE__ */ jsxs(T1, {
 			mods,
 			children: [
+				t12,
 				t13,
-				t14,
 				actions
 			]
 		});
-		$[45] = T1;
-		$[46] = actions;
-		$[47] = mods;
+		$[44] = T1;
+		$[45] = actions;
+		$[46] = mods;
+		$[47] = t12;
 		$[48] = t13;
 		$[49] = t14;
-		$[50] = t15;
-	} else t15 = $[50];
-	let t16;
-	if ($[51] !== t11 || $[52] !== t15) {
-		t16 = /* @__PURE__ */ jsxs("div", {
+	} else t14 = $[49];
+	let t15;
+	if ($[50] !== t10 || $[51] !== t14) {
+		t15 = /* @__PURE__ */ jsxs("div", {
 			"data-element": t7,
-			children: [t11, t15]
+			children: [t10, t14]
 		});
-		$[51] = t11;
+		$[50] = t10;
+		$[51] = t14;
 		$[52] = t15;
-		$[53] = t16;
-	} else t16 = $[53];
-	let t17;
-	if ($[54] !== T0 || $[55] !== mods || $[56] !== props || $[57] !== t16) {
-		t17 = /* @__PURE__ */ jsx(T0, {
+	} else t15 = $[52];
+	let t16;
+	if ($[53] !== T0 || $[54] !== mods || $[55] !== props || $[56] !== t15) {
+		t16 = /* @__PURE__ */ jsx(T0, {
 			mods,
 			...props,
-			children: t16
+			children: t15
 		});
-		$[54] = T0;
-		$[55] = mods;
-		$[56] = props;
+		$[53] = T0;
+		$[54] = mods;
+		$[55] = props;
+		$[56] = t15;
 		$[57] = t16;
-		$[58] = t17;
-	} else t17 = $[58];
-	const Snippet = t17;
+	} else t16 = $[57];
+	const Snippet = t16;
 	if (showTooltip) {
+		let t17;
+		if ($[58] !== Snippet) {
+			t17 = /* @__PURE__ */ jsx(ActionElement, { children: Snippet });
+			$[58] = Snippet;
+			$[59] = t17;
+		} else t17 = $[59];
 		let t18;
-		if ($[59] !== Snippet) {
-			t18 = /* @__PURE__ */ jsx(ActionElement, { children: Snippet });
-			$[59] = Snippet;
-			$[60] = t18;
-		} else t18 = $[60];
+		if ($[60] !== formattedCode) {
+			t18 = /* @__PURE__ */ jsx(_Tooltip, { children: formattedCode });
+			$[60] = formattedCode;
+			$[61] = t18;
+		} else t18 = $[61];
 		let t19;
-		if ($[61] !== formattedCode) {
-			t19 = /* @__PURE__ */ jsx(_Tooltip, { children: formattedCode });
-			$[61] = formattedCode;
-			$[62] = t19;
-		} else t19 = $[62];
-		let t20;
-		if ($[63] !== t18 || $[64] !== t19) {
-			t20 = /* @__PURE__ */ jsxs(TooltipTrigger, { children: [t18, t19] });
+		if ($[62] !== t17 || $[63] !== t18) {
+			t19 = /* @__PURE__ */ jsxs(TooltipTrigger, { children: [t17, t18] });
+			$[62] = t17;
 			$[63] = t18;
 			$[64] = t19;
-			$[65] = t20;
-		} else t20 = $[65];
-		return t20;
+		} else t19 = $[64];
+		return t19;
 	}
 	return Snippet;
 }

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

@@ -1 +1 @@
-{"version":3,"file":"CopySnippet.js","names":["tasty","copy","ReactNode","useState","useI18n","CopyIcon","EyeIcon","EyeInvisibleIcon","Action","Button","CubePrismCodeProps","PrismCode","useToast","Tooltip","TooltipTrigger","Card","CubeCardProps","ActionElement","styles","display","cursor","width","StyledBlock","position","overflow","multiline","height","boxSizing","whiteSpace","nowrap","scrollbar","padding","fade","Code","$","preset","serif","font","ButtonContainer","flow","placeContent","border","CopySnippetElement","qa","gridRows","fill","radius","Grid","gridColumns","ActionButton","type","placeSelf","shadow","focused","outline","CopyButton","icon","ShowButton","CubeCopySnippetProps","code","title","isWrapped","prefix","language","showTooltip","hideText","actions","HIDDEN_SYMBOL","replaceSymbolsToHidden","str","repeat","length","CopySnippet","allProps","_c","t","props","t0","t1","t2","t3","undefined","toast","showHidden","setShowHidden","onCopy","success","formattedCode","shouldWrap","pristineCode","replace","includes","t4","line","split","map","join","trim","replaceAll","Array","isArray","forEach","text","t5","t6","hidden","mods","T0","t7","t8","Symbol","for","margin","t9","t10","t11","T1","T2","t12","t13","t14","t15","t16","t17","Snippet","t18","t19","t20","_CopySnippet","Object","assign","displayName","_c","PrismCode","Tooltip"],"sources":["../../../../src/components/content/CopySnippet/CopySnippet.tsx"],"sourcesContent":["import { tasty } from '@tenphi/tasty';\nimport copy from 'clipboard-copy';\nimport { ReactNode, useState } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { CopyIcon } from '../../../icons/CopyIcon';\nimport { EyeIcon } from '../../../icons/EyeIcon';\nimport { EyeInvisibleIcon } from '../../../icons/EyeInvisibleIcon';\nimport { Action, Button } from '../../actions';\nimport {\n  CubePrismCodeProps,\n  PrismCode,\n} from '../../content/PrismCode/PrismCode';\nimport { useToast } from '../../overlays/Toast';\nimport { Tooltip } from '../../overlays/Tooltip/Tooltip';\nimport { TooltipTrigger } from '../../overlays/Tooltip/TooltipTrigger';\nimport { Card, CubeCardProps } from '../Card/Card';\n\nconst ActionElement = tasty(Action, {\n  styles: {\n    display: 'block',\n    cursor: 'default',\n    width: '100%',\n  },\n});\n\nconst StyledBlock = tasty({\n  styles: {\n    position: 'relative',\n    overflow: {\n      '': 'auto clip',\n      multiline: 'auto',\n    },\n    width: 'initial auto 100%',\n    height: {\n      '': 'max 5x',\n      multiline: 'auto',\n    },\n    boxSizing: 'border-box',\n    whiteSpace: {\n      '': 'initial',\n      nowrap: 'nowrap',\n    },\n    scrollbar: 'styled',\n    padding: '1.125x 1.5x',\n    fade: {\n      '': 'right 2x',\n      multiline: false,\n    },\n\n    Code: {\n      $: 'code',\n      preset: {\n        '': 's3',\n        serif: 't3',\n      },\n      // `s3` carries `fontFamily: var(--font-mono)` but `t3` sets no family at\n      // all, so the preset alone cannot express \"serif\". Left to the preset, the\n      // `serif` variant would inherit the `<code>` element's UA monospace\n      // default and render monospace anyway. Keep the family explicit:\n      // `font: 'monospace'` for the default, `font: true` for the design\n      // system's default (non-mono) stack under `serif`.\n      font: {\n        '': 'monospace',\n        serif: true,\n      },\n      // The wrapping itself (`white-space` / `overflow-wrap` on the `<code>`)\n      // is owned by `PrismCode` via its `isWrapped` prop, which this component\n      // forwards.\n    },\n  },\n});\n\nconst ButtonContainer = tasty({\n  styles: {\n    position: 'relative',\n    display: 'flex',\n    flow: {\n      '': 'row-reverse',\n      multiline: 'column',\n    },\n    placeContent: 'start',\n\n    '$button-size': {\n      '': '5x',\n      multiline: '4x',\n    },\n\n    '$first-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 0',\n    },\n\n    '$last-button-radius': {\n      '': '0',\n      multiline: '0 0 0 1r',\n    },\n\n    '$first-and-last-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 1r',\n    },\n\n    // Make sure there's a small gap between buttons and the content\n    border: 'left #clear',\n  },\n});\n\nconst CopySnippetElement = tasty(Card, {\n  qa: 'CopySnippet',\n  styles: {\n    display: 'grid',\n    gridRows: 'minmax(0, 1fr)',\n    fill: '#surface-2',\n    border: 0,\n    padding: 0,\n    preset: 'default',\n    radius: '1r',\n    overflow: 'hidden',\n    height: 'max-content',\n\n    Grid: {\n      display: 'grid',\n      flow: 'row',\n      gridColumns: 'minmax(0, 1fr) auto',\n      gridRows: 'minmax(0, 1fr)',\n      width: 'min 20x',\n      position: 'relative',\n    },\n  },\n});\n\nconst ActionButton = tasty(Button, {\n  type: 'clear',\n  styles: {\n    width: '4x',\n    padding: 0,\n    placeSelf: 'stretch',\n    border: '#clear',\n    shadow: {\n      '': 'inset 0 0 0 1ow #purple-03.0',\n      focused: 'inset 0 0 0 1ow #purple-03',\n    },\n    outline: false,\n    height: '$button-size',\n    radius: {\n      '': 0,\n      ':last-child': '$last-button-radius',\n      ':first-child': '$first-button-radius',\n      ':first-child & :last-child': '$first-and-last-button-radius',\n    },\n  },\n});\n\nconst CopyButton = tasty(ActionButton, {\n  icon: <CopyIcon />,\n});\n\nconst ShowButton = tasty(ActionButton, {});\n\nexport interface CubeCopySnippetProps extends CubeCardProps {\n  /** The code snippet */\n  code: string;\n  /** The title of the snippet */\n  title?: string;\n  /** Whether the snippet is single-lined */\n  nowrap?: boolean;\n  /**\n   * Soft-wrap long content onto multiple lines instead of scrolling it\n   * horizontally. The block grows vertically to fit (so even a single long line\n   * is fully readable rather than clamped), and unbreakable runs like URLs,\n   * tokens and identifiers wrap too. Useful for error messages and logs.\n   * Has no effect when `nowrap` is set. Note this is a different axis from\n   * `nowrap`: `nowrap` collapses real newlines into one scrolling line, while\n   * `isWrapped` breaks long lines that would otherwise scroll.\n   */\n  isWrapped?: boolean;\n  /** The prefix for each line of code. Useful for bash snippets. */\n  prefix?: string;\n  /** The code language of the snippet */\n  language?: CubePrismCodeProps['language'];\n  /** Whether the snippet uses a serif font */\n  serif?: boolean;\n  /** Whether to show the tooltip with the full content */\n  showTooltip?: boolean;\n  hideText?: string[] | string | boolean;\n  actions?: ReactNode;\n}\n\n// const HIDDEN_SYMBOL = '●';\nconst HIDDEN_SYMBOL = '•';\n\nfunction replaceSymbolsToHidden(str: string) {\n  return HIDDEN_SYMBOL.repeat(str.length);\n}\n\nfunction CopySnippet(allProps: CubeCopySnippetProps) {\n  const { t } = useI18n();\n\n  const {\n    code = '',\n    title = t('copySnippet.title', 'Code example'),\n    nowrap,\n    isWrapped,\n    prefix = '',\n    language,\n    serif,\n    actions,\n    showTooltip = false,\n    hideText,\n    ...props\n  } = allProps;\n\n  const toast = useToast();\n\n  const [showHidden, setShowHidden] = useState(false);\n\n  async function onCopy() {\n    await copy(code);\n\n    toast.success(t('copySnippet.copied', '{{title}} copied', { title }));\n  }\n\n  const pristineCode = code.replace(/\\n$/, '');\n\n  const multiline = pristineCode.includes('\\n') && !nowrap;\n  // `isWrapped` reuses the multiline block layout (auto height, no right fade,\n  // copy button on top) so wrapped content grows vertically instead of being\n  // clamped to the single-line height. `nowrap` (force one scrolling line) wins\n  // over it.\n  const shouldWrap = !!isWrapped && !nowrap;\n  let formattedCode = pristineCode\n    .replace(/\\r/g, '')\n    .split(/\\n/g)\n    .map((line) => `${prefix}${line}`)\n    .join('\\n')\n    .trim();\n\n  if (!showHidden) {\n    if (hideText === true) {\n      formattedCode = replaceSymbolsToHidden(formattedCode);\n    } else if (typeof hideText === 'string') {\n      formattedCode = formattedCode.replaceAll(\n        hideText,\n        replaceSymbolsToHidden(hideText),\n      );\n    } else if (Array.isArray(hideText)) {\n      hideText.forEach((text) => {\n        formattedCode = formattedCode.replaceAll(\n          text,\n          replaceSymbolsToHidden(text),\n        );\n      });\n    }\n  }\n\n  const mods = {\n    nowrap,\n    multiline: multiline || shouldWrap,\n    serif,\n    hidden: !!hideText,\n  };\n\n  const Snippet = (\n    <CopySnippetElement mods={mods} {...props}>\n      <div data-element=\"Grid\">\n        <StyledBlock mods={mods}>\n          <PrismCode\n            style={{ margin: 0, overflow: 'visible' }}\n            code={formattedCode}\n            language={language || 'javascript'}\n            isWrapped={shouldWrap}\n          />\n        </StyledBlock>\n        <ButtonContainer mods={mods}>\n          <CopyButton\n            aria-label={t(\n              'copySnippet.copyToClipboard',\n              'Copy {{title}} to clipboard',\n              { title },\n            )}\n            onPress={onCopy}\n          />\n          {hideText && (\n            <ShowButton\n              aria-label={t('copySnippet.showHiddenParts', 'Show hidden parts')}\n              icon={showHidden ? <EyeInvisibleIcon /> : <EyeIcon />}\n              onPress={() => setShowHidden(!showHidden)}\n            />\n          )}\n          {actions}\n        </ButtonContainer>\n      </div>\n    </CopySnippetElement>\n  );\n\n  if (showTooltip) {\n    return (\n      <TooltipTrigger>\n        <ActionElement>{Snippet}</ActionElement>\n        <Tooltip>{formattedCode}</Tooltip>\n      </TooltipTrigger>\n    );\n  }\n\n  return Snippet;\n}\n\nconst _CopySnippet = Object.assign(\n  CopySnippet as typeof CopySnippet & {\n    Button: typeof ActionButton;\n  },\n  {\n    Button: ActionButton,\n  },\n);\n\n(_CopySnippet as any).displayName = 'CopySnippet';\n\nexport { _CopySnippet as CopySnippet };\n"],"mappings":"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"}
+{"version":3,"file":"CopySnippet.js","names":["Styles","tasty","copy","ReactNode","useState","useI18n","CopyIcon","EyeIcon","EyeInvisibleIcon","Action","Button","CubePrismCodeProps","PrismCode","useToast","Tooltip","TooltipTrigger","Card","CubeCardProps","COPY_SNIPPET_CODE_STYLES","margin","overflow","ActionElement","styles","display","cursor","width","StyledBlock","position","multiline","height","boxSizing","whiteSpace","nowrap","scrollbar","padding","fade","Code","$","preset","serif","font","ButtonContainer","flow","placeContent","border","CopySnippetElement","qa","gridRows","fill","radius","Grid","gridColumns","ActionButton","type","placeSelf","shadow","focused","outline","CopyButton","icon","ShowButton","CubeCopySnippetProps","code","title","isWrapped","prefix","language","showTooltip","hideText","actions","HIDDEN_SYMBOL","replaceSymbolsToHidden","str","repeat","length","CopySnippet","allProps","_c","t","props","t0","t1","t2","t3","undefined","toast","showHidden","setShowHidden","onCopy","success","formattedCode","shouldWrap","pristineCode","replace","includes","t4","line","split","map","join","trim","replaceAll","Array","isArray","forEach","text","t5","t6","hidden","mods","T0","t7","t8","t9","t10","T1","T2","t11","t12","t13","t14","t15","t16","Snippet","t17","t18","t19","_CopySnippet","Object","assign","displayName","_c","PrismCode","Tooltip"],"sources":["../../../../src/components/content/CopySnippet/CopySnippet.tsx"],"sourcesContent":["import { Styles, tasty } from '@tenphi/tasty';\nimport copy from 'clipboard-copy';\nimport { ReactNode, useState } from 'react';\n\nimport { useI18n } from '../../../i18n';\nimport { CopyIcon } from '../../../icons/CopyIcon';\nimport { EyeIcon } from '../../../icons/EyeIcon';\nimport { EyeInvisibleIcon } from '../../../icons/EyeInvisibleIcon';\nimport { Action, Button } from '../../actions';\nimport {\n  CubePrismCodeProps,\n  PrismCode,\n} from '../../content/PrismCode/PrismCode';\nimport { useToast } from '../../overlays/Toast';\nimport { Tooltip } from '../../overlays/Tooltip/Tooltip';\nimport { TooltipTrigger } from '../../overlays/Tooltip/TooltipTrigger';\nimport { Card, CubeCardProps } from '../Card/Card';\n\n// The snippet's grid scrolls the code, so the code block itself must not clip.\nconst COPY_SNIPPET_CODE_STYLES: Styles = { margin: 0, overflow: 'visible' };\n\nconst ActionElement = tasty(Action, {\n  styles: {\n    display: 'block',\n    cursor: 'default',\n    width: '100%',\n  },\n});\n\nconst StyledBlock = tasty({\n  styles: {\n    position: 'relative',\n    overflow: {\n      '': 'auto clip',\n      multiline: 'auto',\n    },\n    width: 'initial auto 100%',\n    height: {\n      '': 'max 5x',\n      multiline: 'auto',\n    },\n    boxSizing: 'border-box',\n    whiteSpace: {\n      '': 'initial',\n      nowrap: 'nowrap',\n    },\n    scrollbar: 'styled',\n    padding: '1.125x 1.5x',\n    fade: {\n      '': 'right 2x',\n      multiline: false,\n    },\n\n    Code: {\n      $: 'code',\n      preset: {\n        '': 's3',\n        serif: 't3',\n      },\n      // `s3` carries `fontFamily: var(--font-mono)` but `t3` sets no family at\n      // all, so the preset alone cannot express \"serif\". Left to the preset, the\n      // `serif` variant would inherit the `<code>` element's UA monospace\n      // default and render monospace anyway. Keep the family explicit:\n      // `font: 'monospace'` for the default, `font: true` for the design\n      // system's default (non-mono) stack under `serif`.\n      font: {\n        '': 'monospace',\n        serif: true,\n      },\n      // The wrapping itself (`white-space` / `overflow-wrap` on the `<code>`)\n      // is owned by `PrismCode` via its `isWrapped` prop, which this component\n      // forwards.\n    },\n  },\n});\n\nconst ButtonContainer = tasty({\n  styles: {\n    position: 'relative',\n    display: 'flex',\n    flow: {\n      '': 'row-reverse',\n      multiline: 'column',\n    },\n    placeContent: 'start',\n\n    '$button-size': {\n      '': '5x',\n      multiline: '4x',\n    },\n\n    '$first-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 0',\n    },\n\n    '$last-button-radius': {\n      '': '0',\n      multiline: '0 0 0 1r',\n    },\n\n    '$first-and-last-button-radius': {\n      '': '0 1r 1r 0',\n      multiline: '0 1r 0 1r',\n    },\n\n    // Make sure there's a small gap between buttons and the content\n    border: 'left #clear',\n  },\n});\n\nconst CopySnippetElement = tasty(Card, {\n  qa: 'CopySnippet',\n  styles: {\n    display: 'grid',\n    gridRows: 'minmax(0, 1fr)',\n    fill: '#surface-2',\n    border: 0,\n    padding: 0,\n    preset: 'default',\n    radius: '1r',\n    overflow: 'hidden',\n    height: 'max-content',\n\n    Grid: {\n      display: 'grid',\n      flow: 'row',\n      gridColumns: 'minmax(0, 1fr) auto',\n      gridRows: 'minmax(0, 1fr)',\n      width: 'min 20x',\n      position: 'relative',\n    },\n  },\n});\n\nconst ActionButton = tasty(Button, {\n  type: 'clear',\n  styles: {\n    width: '4x',\n    padding: 0,\n    placeSelf: 'stretch',\n    border: '#clear',\n    shadow: {\n      '': 'inset 0 0 0 1ow #purple-03.0',\n      focused: 'inset 0 0 0 1ow #purple-03',\n    },\n    outline: false,\n    height: '$button-size',\n    radius: {\n      '': 0,\n      ':last-child': '$last-button-radius',\n      ':first-child': '$first-button-radius',\n      ':first-child & :last-child': '$first-and-last-button-radius',\n    },\n  },\n});\n\nconst CopyButton = tasty(ActionButton, {\n  icon: <CopyIcon />,\n});\n\nconst ShowButton = tasty(ActionButton, {});\n\nexport interface CubeCopySnippetProps extends CubeCardProps {\n  /** The code snippet */\n  code: string;\n  /** The title of the snippet */\n  title?: string;\n  /** Whether the snippet is single-lined */\n  nowrap?: boolean;\n  /**\n   * Soft-wrap long content onto multiple lines instead of scrolling it\n   * horizontally. The block grows vertically to fit (so even a single long line\n   * is fully readable rather than clamped), and unbreakable runs like URLs,\n   * tokens and identifiers wrap too. Useful for error messages and logs.\n   * Has no effect when `nowrap` is set. Note this is a different axis from\n   * `nowrap`: `nowrap` collapses real newlines into one scrolling line, while\n   * `isWrapped` breaks long lines that would otherwise scroll.\n   */\n  isWrapped?: boolean;\n  /** The prefix for each line of code. Useful for bash snippets. */\n  prefix?: string;\n  /** The code language of the snippet */\n  language?: CubePrismCodeProps['language'];\n  /** Whether the snippet uses a serif font */\n  serif?: boolean;\n  /** Whether to show the tooltip with the full content */\n  showTooltip?: boolean;\n  hideText?: string[] | string | boolean;\n  actions?: ReactNode;\n}\n\n// const HIDDEN_SYMBOL = '●';\nconst HIDDEN_SYMBOL = '•';\n\nfunction replaceSymbolsToHidden(str: string) {\n  return HIDDEN_SYMBOL.repeat(str.length);\n}\n\nfunction CopySnippet(allProps: CubeCopySnippetProps) {\n  const { t } = useI18n();\n\n  const {\n    code = '',\n    title = t('copySnippet.title', 'Code example'),\n    nowrap,\n    isWrapped,\n    prefix = '',\n    language,\n    serif,\n    actions,\n    showTooltip = false,\n    hideText,\n    ...props\n  } = allProps;\n\n  const toast = useToast();\n\n  const [showHidden, setShowHidden] = useState(false);\n\n  async function onCopy() {\n    await copy(code);\n\n    toast.success(t('copySnippet.copied', '{{title}} copied', { title }));\n  }\n\n  const pristineCode = code.replace(/\\n$/, '');\n\n  const multiline = pristineCode.includes('\\n') && !nowrap;\n  // `isWrapped` reuses the multiline block layout (auto height, no right fade,\n  // copy button on top) so wrapped content grows vertically instead of being\n  // clamped to the single-line height. `nowrap` (force one scrolling line) wins\n  // over it.\n  const shouldWrap = !!isWrapped && !nowrap;\n  let formattedCode = pristineCode\n    .replace(/\\r/g, '')\n    .split(/\\n/g)\n    .map((line) => `${prefix}${line}`)\n    .join('\\n')\n    .trim();\n\n  if (!showHidden) {\n    if (hideText === true) {\n      formattedCode = replaceSymbolsToHidden(formattedCode);\n    } else if (typeof hideText === 'string') {\n      formattedCode = formattedCode.replaceAll(\n        hideText,\n        replaceSymbolsToHidden(hideText),\n      );\n    } else if (Array.isArray(hideText)) {\n      hideText.forEach((text) => {\n        formattedCode = formattedCode.replaceAll(\n          text,\n          replaceSymbolsToHidden(text),\n        );\n      });\n    }\n  }\n\n  const mods = {\n    nowrap,\n    multiline: multiline || shouldWrap,\n    serif,\n    hidden: !!hideText,\n  };\n\n  const Snippet = (\n    <CopySnippetElement mods={mods} {...props}>\n      <div data-element=\"Grid\">\n        <StyledBlock mods={mods}>\n          <PrismCode\n            styles={COPY_SNIPPET_CODE_STYLES}\n            code={formattedCode}\n            language={language || 'javascript'}\n            isWrapped={shouldWrap}\n          />\n        </StyledBlock>\n        <ButtonContainer mods={mods}>\n          <CopyButton\n            aria-label={t(\n              'copySnippet.copyToClipboard',\n              'Copy {{title}} to clipboard',\n              { title },\n            )}\n            onPress={onCopy}\n          />\n          {hideText && (\n            <ShowButton\n              aria-label={t('copySnippet.showHiddenParts', 'Show hidden parts')}\n              icon={showHidden ? <EyeInvisibleIcon /> : <EyeIcon />}\n              onPress={() => setShowHidden(!showHidden)}\n            />\n          )}\n          {actions}\n        </ButtonContainer>\n      </div>\n    </CopySnippetElement>\n  );\n\n  if (showTooltip) {\n    return (\n      <TooltipTrigger>\n        <ActionElement>{Snippet}</ActionElement>\n        <Tooltip>{formattedCode}</Tooltip>\n      </TooltipTrigger>\n    );\n  }\n\n  return Snippet;\n}\n\nconst _CopySnippet = Object.assign(\n  CopySnippet as typeof CopySnippet & {\n    Button: typeof ActionButton;\n  },\n  {\n    Button: ActionButton,\n  },\n);\n\n(_CopySnippet as any).displayName = 'CopySnippet';\n\nexport { _CopySnippet as CopySnippet };\n"],"mappings":"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"}

package/dist/components/content/Disclosure/Disclosure.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { extractStyles, mergeStyleLayers } from "../../../utils/styles.js";
 import { mergeRefs } from "../../../utils/react/useCombinedRefs.js";
 import { DisplayTransition } from "../../helpers/DisplayTransition/DisplayTransition.js";

package/dist/components/content/Divider.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { useCombinedRefs } from "../../utils/react/useCombinedRefs.js";
 import { c } from "react/compiler-runtime";

package/dist/components/content/Footer.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { c } from "react/compiler-runtime";

package/dist/components/content/Header.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { extractStyles } from "../../utils/styles.js";
 import { useSlotProps } from "../../utils/react/Slots.js";
 import { c } from "react/compiler-runtime";

package/dist/components/content/HotKeys/HotKeys.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { extractStyles } from "../../../utils/styles.js";
 import { Text as _Text } from "../Text.js";
 import { useI18n } from "../../../i18n/useI18n.js";

package/dist/components/content/InfoBadge/InfoBadge.js

@@ -1,4 +1,4 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
 import { useWarn } from "../../../_internal/hooks/use-warn.js";
 import { ItemAction } from "../../actions/ItemAction/ItemAction.js";
 import { ItemBadge } from "../ItemBadge/ItemBadge.js";

package/dist/components/content/InlineInput/InlineInput.js

@@ -1,5 +1,5 @@
-/** @license MIT | @cube-dev/ui-kit v0.199.1 | Cube Dev Team */
-import { extractStyles } from "../../../utils/styles.js";
+/** @license MIT | @cube-dev/ui-kit v0.200.0 | Cube Dev Team */
+import { extractStyles, mergeStyleLayers } from "../../../utils/styles.js";
 import { mergeProps as mergeProps$1 } from "../../../utils/react/mergeProps.js";
 import { useEvent } from "../../../_internal/hooks/use-event.js";
 import { useAutoTooltip } from "../use-auto-tooltip.js";
@@ -50,10 +50,10 @@ const InlineInputRoot = tasty({
 			"styled & disabled": true
 		},
 		outline: {
-			"": "1bw #primary.0",
-			"focused & !styled": "1bw #primary"
+			"": "$ring-width #primary.0",
+			"focused & !styled": "$ring-width #primary"
 		},
-		outlineOffset: 1,
+		outlineOffset: "$outline-offset",
 		radius: {
 			"": 0,
 			focused: true,
@@ -508,14 +508,7 @@ const InlineInput = forwardRef(function InlineInput(allProps, ref) {
 		$[77] = t36;
 	} else t36 = $[77];
 	const mods = t36;
-	const existingInput = stylesProp?.Input;
-	const mergedStyles = inputStyles ? {
-		...stylesProp,
-		Input: existingInput ? {
-			...existingInput,
-			...inputStyles
-		} : inputStyles
-	} : stylesProp;
+	const mergedStyles = mergeStyleLayers(stylesProp, inputStyles ? { Input: inputStyles } : null);
 	const extractedStyles = extractStyles(otherProps, STYLE_PROPS, mergedStyles);
 	const t37 = inputWidth != null ? `${inputWidth}px` : "auto";
 	let t38;