intergalactic 15.60.1 → 15.61.0-prerelease.0-prerelease-07b38ef0

package/tag/lib/es6/Tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tag.js","names":["React","createComponent","Component","sstyled","Root","Box","addonTextChildren","logger","CloseM","localizedMessages","i18nEnhance","resolveColorEnhance","uniqueIDEnhancement","style","_sstyled","insert","callAllEventHandlers","legacyThemeRecommendedMigration","primary","muted","info","success","warning","danger","secondary","RootTag","_Component","_inherits","_super","_createSuper","props","_legacyThemeRecommend","_this","_classCallCheck","call","_defineProperty","_assertThisInitialized","e","_this$asProps$onClick","_this$asProps","key","preventDefault","asProps","onClick","warn","use","concat","theme","Tag","displayName","_createClass","value","getCircleProps","size","getCloseProps","_this$asProps2","getI18nText","id","uid","tagId","render","_ref","_ref6","STag","_this$asProps3","Children","styles","color","interactive","disabled","addonLeft","addonRight","resolveColor","outerId","onKeyDown","createElement","cn","_objectSpread","_assignProps","undefined","handleKeyDown","Addon","tag","Text","i18n","locale","_ref2","arguments[0]","_ref7","SText","_assignProps2","Close","_ref3","_ref8","SClose","event","code","_assignProps3","_ref4","_ref9","SAddon","_assignProps4","Circle","_ref5","_ref10","SCircle","_assignProps5"],"sources":["../../src/Tag.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport logger from '@semcore/utils/lib/logger';\nimport CloseM from '@semcore/icon/Close/m';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\nimport i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';\nimport resolveColorEnhance from '@semcore/utils/lib/enhances/resolveColorEnhance';\nimport uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';\n\nimport style from './style/tag.shadow.css';\nimport { callAllEventHandlers } from '@semcore/utils/lib/assignProps';\n\nconst legacyThemeRecommendedMigration = {\n  primary: {\n    muted: 'gray-500',\n    info: 'blue-500',\n    success: 'green-500',\n    warning: 'orange-500',\n    danger: 'red-500',\n  },\n  secondary: {\n    muted: 'gray-50',\n  },\n};\n\nclass RootTag extends Component {\n  static displayName = 'Tag';\n  static style = style;\n  static enhance = [i18nEnhance(localizedMessages), uniqueIDEnhancement(), resolveColorEnhance()];\n  static defaultProps = {\n    theme: 'primary',\n    color: 'gray-500',\n    size: 'm',\n    i18n: localizedMessages,\n    locale: 'en',\n  };\n\n  constructor(props) {\n    super(props);\n\n    logger.warn(\n      props.use,\n      `Property 'use' is deprecated, replace property to \"theme='${props.use}' color='${\n        legacyThemeRecommendedMigration[props.use]?.[props.theme]\n      }'\"`,\n      props['data-ui-name'] || Tag.displayName,\n    );\n  }\n\n  getCircleProps() {\n    const { size } = this.asProps;\n    return { size };\n  }\n\n  getCloseProps() {\n    const { getI18nText, id, uid } = this.asProps;\n\n    return { getI18nText, tagId: id || `igc-${uid}-tag`, uid };\n  }\n\n  handleKeyDown = (e) => {\n    switch (e.key) {\n      case ' ':\n      case 'Enter':\n        e.preventDefault();\n        this.asProps.onClick?.(e);\n        break;\n    }\n  };\n\n  render() {\n    const STag = Root;\n    const {\n      Children,\n      styles,\n      color,\n      interactive,\n      disabled,\n      addonLeft,\n      addonRight,\n      resolveColor,\n      onClick,\n      id: outerId,\n      uid,\n      onKeyDown,\n    } = this.asProps;\n    const id = outerId || `igc-${uid}-tag`;\n\n    return sstyled(styles)(\n      <STag\n        render={Box}\n        id={id}\n        use:interactive={!disabled && interactive}\n        tabIndex={interactive && onClick ? 0 : undefined}\n        tag-color={resolveColor(color)}\n        onKeyDown={callAllEventHandlers(onKeyDown, this.handleKeyDown)}\n      >\n        {addonLeft ? <Tag.Addon tag={addonLeft} /> : null}\n        {addonTextChildren(Children, Tag.Text, Tag.Addon)}\n        {addonRight ? <Tag.Addon tag={addonRight} /> : null}\n      </STag>,\n    );\n  }\n}\n\nfunction Text(props) {\n  const SText = Root;\n  const { styles } = props;\n  return sstyled(styles)(<SText render={Box} tag='span' />);\n}\n\nfunction Close(props) {\n  const SClose = Root;\n  const { styles, getI18nText, tagId, uid } = props;\n\n  function onKeyDown(event) {\n    if (props.onKeyDown) {\n      return props.onKeyDown(event);\n    }\n\n    if (props.onClick && (event.code === 'Enter' || event.code === 'Space')) {\n      event.preventDefault();\n      props.onClick(event);\n    }\n  }\n\n  return sstyled(styles)(\n    <SClose\n      render={Box}\n      tag={CloseM}\n      interactive\n      id={`igc-${uid}-tag-clear`}\n      aria-labelledby={`igc-${uid}-tag-clear ${tagId}`}\n      aria-label={getI18nText('remove')}\n      onKeyDown={onKeyDown}\n    />,\n  );\n}\n\nfunction Addon(props) {\n  const SAddon = Root;\n  const { styles } = props;\n  return sstyled(styles)(<SAddon render={Box} tag='span' />);\n}\n\nfunction Circle(props) {\n  const SCircle = Root;\n  const { styles } = props;\n  return sstyled(styles)(<SCircle render={Box} tag='span' />);\n}\n\nconst Tag = createComponent(RootTag, {\n  Text,\n  Addon,\n  Close,\n  Circle,\n});\n\nexport default Tag;\n"],"mappings":";;;;;;;;;;;;;AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,eAAe,IAAIC,SAAS,EAAEC,OAAO,EAAEC,IAAI,QAAQ,eAAe;AACzE,SAASC,GAAG,QAAQ,mBAAmB;AACvC,OAAOC,iBAAiB,MAAM,sCAAsC;AACpE,OAAOC,MAAM,MAAM,2BAA2B;AAC9C,OAAOC,MAAM,MAAM,uBAAuB;AAC1C,SAASC,iBAAiB,QAAQ,gDAAgD;AAClF,OAAOC,WAAW,MAAM,yCAAyC;AACjE,OAAOC,mBAAmB,MAAM,iDAAiD;AACjF,OAAOC,mBAAmB,MAAM,6BAA6B;AAAC;AAAA,IAAAC,KAAA,+BAAAC,QAAA,CAAAC,MAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAG9D,SAASC,oBAAoB,QAAQ,gCAAgC;AAErE,IAAMC,+BAA+B,GAAG;EACtCC,OAAO,EAAE;IACPC,KAAK,EAAE,UAAU;IACjBC,IAAI,EAAE,UAAU;IAChBC,OAAO,EAAE,WAAW;IACpBC,OAAO,EAAE,YAAY;IACrBC,MAAM,EAAE;EACV,CAAC;EACDC,SAAS,EAAE;IACTL,KAAK,EAAE;EACT;AACF,CAAC;AAAC,IAEIM,OAAO,0BAAAC,UAAA;EAAAC,SAAA,CAAAF,OAAA,EAAAC,UAAA;EAAA,IAAAE,MAAA,GAAAC,YAAA,CAAAJ,OAAA;EAYX,SAAAA,QAAYK,KAAK,EAAE;IAAA,IAAAC,qBAAA;IAAA,IAAAC,KAAA;IAAAC,eAAA,OAAAR,OAAA;IACjBO,KAAA,GAAAJ,MAAA,CAAAM,IAAA,OAAMJ,KAAK;IAAEK,eAAA,CAAAC,sBAAA,CAAAJ,KAAA,oBAsBC,UAACK,CAAC,EAAK;MAAA,IAAAC,qBAAA,EAAAC,aAAA;MACrB,QAAQF,CAAC,CAACG,GAAG;QACX,KAAK,GAAG;QACR,KAAK,OAAO;UACVH,CAAC,CAACI,cAAc,EAAE;UAClB,CAAAH,qBAAA,IAAAC,aAAA,GAAAP,KAAA,CAAKU,OAAO,EAACC,OAAO,cAAAL,qBAAA,uBAApBA,qBAAA,CAAAJ,IAAA,CAAAK,aAAA,EAAuBF,CAAC,CAAC;UACzB;MAAM;IAEZ,CAAC;IA5BC9B,MAAM,CAACqC,IAAI,CACTd,KAAK,CAACe,GAAG,gEAAAC,MAAA,CACoDhB,KAAK,CAACe,GAAG,eAAAC,MAAA,EAAAf,qBAAA,GACpEd,+BAA+B,CAACa,KAAK,CAACe,GAAG,CAAC,cAAAd,qBAAA,uBAA1CA,qBAAA,CAA6CD,KAAK,CAACiB,KAAK,CAAC,UAE3DjB,KAAK,CAAC,cAAc,CAAC,IAAIkB,GAAG,CAACC,WAAW,CACzC;IAAC,OAAAjB,KAAA;EACJ;EAACkB,YAAA,CAAAzB,OAAA;IAAAe,GAAA;IAAAW,KAAA,EAED,SAAAC,eAAA,EAAiB;MACf,IAAQC,IAAI,GAAK,IAAI,CAACX,OAAO,CAArBW,IAAI;MACZ,OAAO;QAAEA,IAAI,EAAJA;MAAK,CAAC;IACjB;EAAC;IAAAb,GAAA;IAAAW,KAAA,EAED,SAAAG,cAAA,EAAgB;MACd,IAAAC,cAAA,GAAiC,IAAI,CAACb,OAAO;QAArCc,WAAW,GAAAD,cAAA,CAAXC,WAAW;QAAEC,EAAE,GAAAF,cAAA,CAAFE,EAAE;QAAEC,GAAG,GAAAH,cAAA,CAAHG,GAAG;MAE5B,OAAO;QAAEF,WAAW,EAAXA,WAAW;QAAEG,KAAK,EAAEF,EAAE,WAAAX,MAAA,CAAWY,GAAG,SAAM;QAAEA,GAAG,EAAHA;MAAI,CAAC;IAC5D;EAAC;IAAAlB,GAAA;IAAAW,KAAA,EAYD,SAAAS,OAAA,EAAS;MAAA,IAAAC,IAAA,QAAAnB,OAAA;QAAAoB,KAAA;MACP,IAAMC,IAAI,GAmBE1D,GAAG;MAlBf,IAAA2D,cAAA,GAaI,IAAI,CAACtB,OAAO;QAZduB,QAAQ,GAAAD,cAAA,CAARC,QAAQ;QACRC,MAAM,GAAAF,cAAA,CAANE,MAAM;QACNC,KAAK,GAAAH,cAAA,CAALG,KAAK;QACLC,WAAW,GAAAJ,cAAA,CAAXI,WAAW;QACXC,QAAQ,GAAAL,cAAA,CAARK,QAAQ;QACRC,SAAS,GAAAN,cAAA,CAATM,SAAS;QACTC,UAAU,GAAAP,cAAA,CAAVO,UAAU;QACVC,YAAY,GAAAR,cAAA,CAAZQ,YAAY;QACZ7B,OAAO,GAAAqB,cAAA,CAAPrB,OAAO;QACH8B,OAAO,GAAAT,cAAA,CAAXP,EAAE;QACFC,GAAG,GAAAM,cAAA,CAAHN,GAAG;QACHgB,SAAS,GAAAV,cAAA,CAATU,SAAS;MAEX,IAAMjB,EAAE,GAAGgB,OAAO,WAAA3B,MAAA,CAAWY,GAAG,SAAM;MAEtC,OAAAI,KAAA,GAAO3D,OAAO,CAAC+D,MAAM,CAAC,eACpBlE,KAAA,CAAA2E,aAAA,CAACZ,IAAI,EAAAD,KAAA,CAAAc,EAAA,SAAAC,aAAA,KAAAC,YAAA;QAAA,MAECrB,EAAE;QAAA,mBACW,CAACY,QAAQ,IAAID,WAAW;QAAA,YAC/BA,WAAW,IAAIzB,OAAO,GAAG,CAAC,GAAGoC,SAAS;QAAA,aACrCP,YAAY,CAACL,KAAK,CAAC;QAAA,aACnBnD,oBAAoB,CAAC0D,SAAS,EAAE,IAAI,CAACM,aAAa;MAAC,GAAAnB,IAAA,KAE7DS,SAAS,gBAAGtE,KAAA,CAAA2E,aAAA,CAAC3B,GAAG,CAACiC,KAAK;QAACC,GAAG,EAAEZ;MAAU,EAAG,GAAG,IAAI,EAChDhE,iBAAiB,CAAC2D,QAAQ,EAAEjB,GAAG,CAACmC,IAAI,EAAEnC,GAAG,CAACiC,KAAK,CAAC,EAChDV,UAAU,gBAAGvE,KAAA,CAAA2E,aAAA,CAAC3B,GAAG,CAACiC,KAAK;QAACC,GAAG,EAAEX;MAAW,EAAG,GAAG,IAAI,CAC9C;IAEX;EAAC;EAAA,OAAA9C,OAAA;AAAA,EA7EmBvB,SAAS;AAAAiC,eAAA,CAAzBV,OAAO,iBACU,KAAK;AAAAU,eAAA,CADtBV,OAAO,WAEIZ,KAAK;AAAAsB,eAAA,CAFhBV,OAAO,aAGM,CAACf,WAAW,CAACD,iBAAiB,CAAC,EAAEG,mBAAmB,EAAE,EAAED,mBAAmB,EAAE,CAAC;AAAAwB,eAAA,CAH3FV,OAAO,kBAIW;EACpBsB,KAAK,EAAE,SAAS;EAChBoB,KAAK,EAAE,UAAU;EACjBd,IAAI,EAAE,GAAG;EACT+B,IAAI,EAAE3E,iBAAiB;EACvB4E,MAAM,EAAE;AACV,CAAC;AAsEH,SAASF,IAAIA,CAACrD,KAAK,EAAE;EAAA,IAAAwD,KAAA,GAAAC,YAAA;IAAAC,KAAA;EACnB,IAAMC,KAAK,GAE2BpF,GAAG;EADzC,IAAQ6D,MAAM,GAAKpC,KAAK,CAAhBoC,MAAM;EACd,OAAAsB,KAAA,GAAOrF,OAAO,CAAC+D,MAAM,CAAC,eAAClE,KAAA,CAAA2E,aAAA,CAACc,KAAK,EAAAD,KAAA,CAAAZ,EAAA,UAAAC,aAAA,KAAAa,aAAA;IAAA,OAAkB;EAAM,GAAAJ,KAAA,IAAG;AAC1D;AAEA,SAASK,KAAKA,CAAC7D,KAAK,EAAE;EAAA,IAAA8D,KAAA,GAAAL,YAAA;IAAAM,KAAA;EACpB,IAAMC,MAAM,GAgBAzF,GAAG;EAff,IAAQ6D,MAAM,GAA8BpC,KAAK,CAAzCoC,MAAM;IAAEV,WAAW,GAAiB1B,KAAK,CAAjC0B,WAAW;IAAEG,KAAK,GAAU7B,KAAK,CAApB6B,KAAK;IAAED,GAAG,GAAK5B,KAAK,CAAb4B,GAAG;EAEvC,SAASgB,SAASA,CAACqB,KAAK,EAAE;IACxB,IAAIjE,KAAK,CAAC4C,SAAS,EAAE;MACnB,OAAO5C,KAAK,CAAC4C,SAAS,CAACqB,KAAK,CAAC;IAC/B;IAEA,IAAIjE,KAAK,CAACa,OAAO,KAAKoD,KAAK,CAACC,IAAI,KAAK,OAAO,IAAID,KAAK,CAACC,IAAI,KAAK,OAAO,CAAC,EAAE;MACvED,KAAK,CAACtD,cAAc,EAAE;MACtBX,KAAK,CAACa,OAAO,CAACoD,KAAK,CAAC;IACtB;EACF;EAEA,OAAAF,KAAA,GAAO1F,OAAO,CAAC+D,MAAM,CAAC,eACpBlE,KAAA,CAAA2E,aAAA,CAACmB,MAAM,EAAAD,KAAA,CAAAjB,EAAA,WAAAC,aAAA,KAAAoB,aAAA;IAAA,OAEAzF,MAAM;IAAA;IAAA,aAAAsC,MAAA,CAEAY,GAAG;IAAA,0BAAAZ,MAAA,CACUY,GAAG,iBAAAZ,MAAA,CAAca,KAAK;IAAA,cAClCH,WAAW,CAAC,QAAQ,CAAC;IAAA,aACtBkB;EAAS,GAAAkB,KAAA,IACpB;AAEN;AAEA,SAASX,KAAKA,CAACnD,KAAK,EAAE;EAAA,IAAAoE,KAAA,GAAAX,YAAA;IAAAY,KAAA;EACpB,IAAMC,MAAM,GAE2B/F,GAAG;EAD1C,IAAQ6D,MAAM,GAAKpC,KAAK,CAAhBoC,MAAM;EACd,OAAAiC,KAAA,GAAOhG,OAAO,CAAC+D,MAAM,CAAC,eAAClE,KAAA,CAAA2E,aAAA,CAACyB,MAAM,EAAAD,KAAA,CAAAvB,EAAA,WAAAC,aAAA,KAAAwB,aAAA;IAAA,OAAkB;EAAM,GAAAH,KAAA,IAAG;AAC3D;AAEA,SAASI,MAAMA,CAACxE,KAAK,EAAE;EAAA,IAAAyE,KAAA,GAAAhB,YAAA;IAAAiB,MAAA;EACrB,IAAMC,OAAO,GAE2BpG,GAAG;EAD3C,IAAQ6D,MAAM,GAAKpC,KAAK,CAAhBoC,MAAM;EACd,OAAAsC,MAAA,GAAOrG,OAAO,CAAC+D,MAAM,CAAC,eAAClE,KAAA,CAAA2E,aAAA,CAAC8B,OAAO,EAAAD,MAAA,CAAA5B,EAAA,YAAAC,aAAA,KAAA6B,aAAA;IAAA,OAAkB;EAAM,GAAAH,KAAA,IAAG;AAC5D;AAEA,IAAMvD,GAAG,GAAG/C,eAAe,CAACwB,OAAO,EAAE;EACnC0D,IAAI,EAAJA,IAAI;EACJF,KAAK,EAALA,KAAK;EACLU,KAAK,EAALA,KAAK;EACLW,MAAM,EAANA;AACF,CAAC,CAAC;AAEF,eAAetD,GAAG"}
+{"version":3,"file":"Tag.js","names":["React","createComponent","Component","sstyled","Root","Box","addonTextChildren","logger","CloseM","localizedMessages","i18nEnhance","resolveColorEnhance","uniqueIDEnhancement","keyboardFocusEnhance","style","_sstyled","insert","callAllEventHandlers","legacyThemeRecommendedMigration","primary","muted","info","success","warning","danger","secondary","RootTag","_Component","_inherits","_super","_createSuper","props","_legacyThemeRecommend","_this","_classCallCheck","call","_defineProperty","_assertThisInitialized","focusable","setState","event","code","asProps","onClick","preventDefault","warn","use","concat","theme","Tag","displayName","_createClass","key","value","getCircleProps","size","getTextProps","interactive","id","uid","state","tabIndex","getCloseProps","getI18nText","onMount","handleCloseMount","onUnmount","handleCloseUnmount","render","_ref","_ref6","STag","_this$asProps","Children","styles","color","disabled","addonLeft","addonRight","resolveColor","outerId","onKeyDown","createElement","cn","_objectSpread","_assignProps","undefined","handleKeyDown","Addon","tag","Text","i18n","locale","_ref2","arguments[0]","_ref7","SText","_assignProps2","enhance","Close","_ref3","_ref8","SClose","useEffect","_props$onMount","_props$onUnmount","useCallback","_assignProps3","_ref4","_ref9","SAddon","_assignProps4","Circle","_ref5","_ref10","SCircle","_assignProps5"],"sources":["../../src/Tag.jsx"],"sourcesContent":["import React from 'react';\nimport createComponent, { Component, sstyled, Root } from '@semcore/core';\nimport { Box } from '@semcore/flex-box';\nimport addonTextChildren from '@semcore/utils/lib/addonTextChildren';\nimport logger from '@semcore/utils/lib/logger';\nimport CloseM from '@semcore/icon/Close/m';\nimport { localizedMessages } from './translations/__intergalactic-dynamic-locales';\nimport i18nEnhance from '@semcore/utils/lib/enhances/i18nEnhance';\nimport resolveColorEnhance from '@semcore/utils/lib/enhances/resolveColorEnhance';\nimport uniqueIDEnhancement from '@semcore/utils/lib/uniqueID';\nimport keyboardFocusEnhance from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\n\nimport style from './style/tag.shadow.css';\nimport { callAllEventHandlers } from '@semcore/utils/lib/assignProps';\n\nconst legacyThemeRecommendedMigration = {\n  primary: {\n    muted: 'gray-500',\n    info: 'blue-500',\n    success: 'green-500',\n    warning: 'orange-500',\n    danger: 'red-500',\n  },\n  secondary: {\n    muted: 'gray-50',\n  },\n};\n\nclass RootTag extends Component {\n  static displayName = 'Tag';\n  static style = style;\n  static enhance = [\n    i18nEnhance(localizedMessages),\n    uniqueIDEnhancement(),\n    resolveColorEnhance(),\n    keyboardFocusEnhance(),\n  ];\n  static defaultProps = {\n    theme: 'primary',\n    color: 'gray-500',\n    size: 'm',\n    i18n: localizedMessages,\n    locale: 'en',\n  };\n  state = {\n    focusable: 'container',\n  };\n\n  constructor(props) {\n    super(props);\n\n    logger.warn(\n      props.use,\n      `Property 'use' is deprecated, replace property to \"theme='${props.use}' color='${\n        legacyThemeRecommendedMigration[props.use]?.[props.theme]\n      }'\"`,\n      props['data-ui-name'] || Tag.displayName,\n    );\n  }\n\n  getCircleProps() {\n    const { size } = this.asProps;\n    return { size };\n  }\n\n  getTextProps() {\n    const { interactive } = this.asProps;\n    const id = this.asProps.id || `igc-${this.asProps.uid}-tag`;\n    const { focusable } = this.state;\n\n    return {\n      tabIndex: focusable === 'text' && interactive ? 0 : -1,\n      id: `${id}-text`,\n    };\n  }\n  handleCloseMount = () => {\n    this.setState({ focusable: 'text' });\n  };\n  handleCloseUnmount = () => {\n    this.setState({ focusable: 'container' });\n  };\n  getCloseProps() {\n    const { getI18nText } = this.asProps;\n    const id = this.asProps.id || `igc-${this.asProps.uid}-tag`;\n\n    return {\n      getI18nText,\n      id: `${id}-clear`,\n      'aria-labelledby': `${id}-clear ${id}-text`,\n      'aria-label': getI18nText('remove'),\n      'aria-hidden': 'true',\n      onMount: this.handleCloseMount,\n      onUnmount: this.handleCloseUnmount,\n    };\n  }\n\n  handleKeyDown = (event) => {\n    switch (event.code) {\n      case 'Space':\n      case 'Enter':\n        if (this.asProps.onClick) {\n          event.preventDefault();\n          this.asProps.onClick(event);\n        }\n        break;\n    }\n  };\n\n  render() {\n    const STag = Root;\n    const {\n      Children,\n      styles,\n      color,\n      interactive,\n      disabled,\n      addonLeft,\n      addonRight,\n      resolveColor,\n      id: outerId,\n      uid,\n      onKeyDown,\n    } = this.asProps;\n    const { focusable } = this.state;\n    const id = outerId || `igc-${uid}-tag`;\n\n    return sstyled(styles)(\n      <STag\n        render={Box}\n        id={id}\n        use:interactive={!disabled && interactive}\n        role={interactive ? 'button' : undefined}\n        tag-color={resolveColor(color)}\n        onKeyDown={callAllEventHandlers(onKeyDown, this.handleKeyDown)}\n        use:tabIndex={interactive && focusable === 'container' ? 0 : -1}\n      >\n        {addonLeft ? <Tag.Addon tag={addonLeft} /> : null}\n        {addonTextChildren(Children, Tag.Text, Tag.Addon)}\n        {addonRight ? <Tag.Addon tag={addonRight} /> : null}\n      </STag>,\n    );\n  }\n}\n\nfunction Text(props) {\n  const SText = Root;\n  const { styles } = props;\n  return sstyled(styles)(<SText render={Box} tag='span' />);\n}\nText.enhance = [keyboardFocusEnhance()];\n\nfunction Close(props) {\n  const SClose = Root;\n  const { styles } = props;\n\n  React.useEffect(() => {\n    props.onMount?.();\n    return () => props.onUnmount?.();\n  }, []);\n\n  const onKeyDown = React.useCallback(\n    (event) => {\n      if (props.onKeyDown) {\n        return props.onKeyDown(event);\n      }\n\n      if (props.onClick && (event.code === 'Enter' || event.code === 'Space')) {\n        event.preventDefault();\n        props.onClick(event);\n      }\n    },\n    [props.onKeyDown, props.onClick],\n  );\n\n  return sstyled(styles)(<SClose render={Box} tag={CloseM} interactive onKeyDown={onKeyDown} />);\n}\n\nfunction Addon(props) {\n  const SAddon = Root;\n  const { styles } = props;\n  return sstyled(styles)(<SAddon render={Box} tag='span' />);\n}\n\nfunction Circle(props) {\n  const SCircle = Root;\n  const { styles } = props;\n  return sstyled(styles)(<SCircle render={Box} tag='span' />);\n}\n\nconst Tag = createComponent(RootTag, {\n  Text,\n  Addon,\n  Close,\n  Circle,\n});\n\nexport default Tag;\n"],"mappings":"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"}

package/tag/lib/es6/index.d.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { BoxProps } from '@semcore/flex-box';\nimport { IconProps } from '@semcore/icon';\n\nexport type TagSize = 'xl' | 'l' | 'm';\n/** @deprecated */\nexport type TagThemeOld =\n  | 'muted'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'danger'\n  | 'invert'\n  | 'additional';\nexport type TagTheme = 'primary' | 'secondary' | TagThemeOld;\nexport type TagUse = 'primary' | 'secondary';\n\n/** @deprecated */\nexport interface ITagProps extends TagProps, UnknownProperties {}\nexport type TagProps = BoxProps & {\n  /** Value responsible for tag availability\n   */\n  disabled?: boolean;\n  /** Value responsible for tag activity\n   */\n  active?: boolean;\n  /** Interactive tag\n   */\n  interactive?: boolean;\n  /** Tag type\n   * @default secondary\n   * @deprecated v4.0.0\n   * @use ITagProps.theme\n   */\n  use?: TagUse;\n  /** Tag theme, there are several default themes or you can use your color\n   * @default primary\n   */\n  theme?: TagTheme;\n  /** Tag color text */\n  color?: string;\n  /** Tag size\n   * @default m\n   */\n  size?: TagSize;\n  /** Left addon tag */\n  addonLeft?: React.ElementType;\n  /** Right addon tag */\n  addonRight?: React.ElementType;\n  locale?: string;\n};\n\n/** @deprecated */\nexport interface ITagCloseProps extends TagCloseProps, UnknownProperties {}\nexport type TagCloseProps = IconProps & {\n  /** Tag type\n   * @default secondary\n   */\n  use?: TagUse;\n  /** Tag theme, there are several default themes or you can use your color\n   * @default muted\n   */\n  theme?: TagTheme;\n};\n\n/** @deprecated */\nexport interface ITagContext extends TagContext, UnknownProperties {}\nexport type TagContext = TagProps & {\n  getCloseProps?: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface ITagAddonProps extends TagAddonProps, UnknownProperties {}\nexport type TagAddonProps = BoxProps & {};\n\n/** @deprecated */\nexport interface ITagTextProps extends TagTextProps, UnknownProperties {}\nexport type TagTextProps = BoxProps & {};\n\ndeclare const Tag: Intergalactic.Component<'div', TagProps, TagContext> & {\n  Text: Intergalactic.Component<'div', TagTextProps>;\n  Addon: Intergalactic.Component<'div', TagAddonProps>;\n  Close: Intergalactic.Component<'div', TagCloseProps>;\n  Circle: Intergalactic.Component<'div', TagAddonProps>;\n};\n\nexport default Tag;\n"],"mappings":""}
+{"version":3,"file":"index.d.js","names":[],"sources":["../../src/index.d.ts"],"sourcesContent":["import React from 'react';\nimport { PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';\nimport { BoxProps } from '@semcore/flex-box';\nimport { IconProps } from '@semcore/icon';\nimport { KeyboardFocusProps } from '@semcore/utils/lib/enhances/keyboardFocusEnhance';\n\nexport type TagSize = 'xl' | 'l' | 'm';\n/** @deprecated */\nexport type TagThemeOld =\n  | 'muted'\n  | 'info'\n  | 'success'\n  | 'warning'\n  | 'danger'\n  | 'invert'\n  | 'additional';\nexport type TagTheme = 'primary' | 'secondary' | TagThemeOld;\nexport type TagUse = 'primary' | 'secondary';\n\n/** @deprecated */\nexport interface ITagProps extends TagProps, UnknownProperties {}\nexport type TagProps = BoxProps &\n  KeyboardFocusProps & {\n    /** Value responsible for tag availability\n     */\n    disabled?: boolean;\n    /** Value responsible for tag activity\n     */\n    active?: boolean;\n    /** Interactive tag\n     */\n    interactive?: boolean;\n    /** Tag type\n     * @default secondary\n     * @deprecated v4.0.0\n     * @use ITagProps.theme\n     */\n    use?: TagUse;\n    /** Tag theme, there are several default themes or you can use your color\n     * @default primary\n     */\n    theme?: TagTheme;\n    /** Tag color text */\n    color?: string;\n    /** Tag size\n     * @default m\n     */\n    size?: TagSize;\n    /** Left addon tag */\n    addonLeft?: React.ElementType;\n    /** Right addon tag */\n    addonRight?: React.ElementType;\n    locale?: string;\n  };\n\n/** @deprecated */\nexport interface ITagCloseProps extends TagCloseProps, UnknownProperties {}\nexport type TagCloseProps = IconProps & {\n  /** Tag type\n   * @default secondary\n   */\n  use?: TagUse;\n  /** Tag theme, there are several default themes or you can use your color\n   * @default muted\n   */\n  theme?: TagTheme;\n};\n\n/** @deprecated */\nexport interface ITagContext extends TagContext, UnknownProperties {}\nexport type TagContext = TagProps & {\n  getCloseProps?: PropGetterFn;\n};\n\n/** @deprecated */\nexport interface ITagAddonProps extends TagAddonProps, UnknownProperties {}\nexport type TagAddonProps = BoxProps & {};\n\n/** @deprecated */\nexport interface ITagTextProps extends TagTextProps, UnknownProperties {}\nexport type TagTextProps = BoxProps & KeyboardFocusProps & {};\n\ndeclare const Tag: Intergalactic.Component<'div', TagProps, TagContext> & {\n  Text: Intergalactic.Component<'div', TagTextProps>;\n  Addon: Intergalactic.Component<'div', TagAddonProps>;\n  Close: Intergalactic.Component<'div', TagCloseProps>;\n  Circle: Intergalactic.Component<'div', TagAddonProps>;\n};\n\nexport default Tag;\n"],"mappings":""}

package/tag/lib/es6/style/tag.shadow.css

@@ -43,8 +43,25 @@ STag {
     opacity: 0.1;
     filter: brightness(150%);
   }
+
+  &:active,
+  &:hover,
+  &:focus {
+    outline: 0;
+    text-decoration: none;
+  }
+}
+
+STag[keyboardFocused] {
+  box-shadow: var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));
+  z-index: 1;
+}
+
+STag[keyboardFocused]:has(:focus) {
+  box-shadow: none;
 }
 
+
 STag[disabled] {
   opacity: var(--intergalactic-disabled-opacity, 0.3);
   cursor: default;
@@ -165,6 +182,11 @@ SText {
   position: relative;
 }
 
+SText[keyboardFocused] {
+  box-shadow: var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5));
+  z-index: 1;
+}
+
 SText:not(:only-child):first-child {
   padding-right: 0;
 }
@@ -227,9 +249,12 @@ SClose {
   align-items: center;
   justify-content: center;
   padding: var(--intergalactic-spacing-1x, 4px);
-  opacity: 0.5;
 
-  &:hover {
+  & path {
+    opacity: 0.5;
+  }
+
+  &:hover path {
     opacity: 1;
   }
 }

package/tag/lib/types/index.d.ts

@@ -2,6 +2,7 @@ import React from 'react';
 import { PropGetterFn, UnknownProperties, Intergalactic } from 'intergalactic/core';
 import { BoxProps } from 'intergalactic/flex-box';
 import { IconProps } from 'intergalactic/icon';
+import { KeyboardFocusProps } from 'intergalactic/utils/lib/enhances/keyboardFocusEnhance';
 
 export type TagSize = 'xl' | 'l' | 'm';
 /** @deprecated */
@@ -18,38 +19,39 @@ export type TagUse = 'primary' | 'secondary';
 
 /** @deprecated */
 export interface ITagProps extends TagProps, UnknownProperties {}
-export type TagProps = BoxProps & {
-  /** Value responsible for tag availability
-   */
-  disabled?: boolean;
-  /** Value responsible for tag activity
-   */
-  active?: boolean;
-  /** Interactive tag
-   */
-  interactive?: boolean;
-  /** Tag type
-   * @default secondary
-   * @deprecated v4.0.0
-   * @use ITagProps.theme
-   */
-  use?: TagUse;
-  /** Tag theme, there are several default themes or you can use your color
-   * @default primary
-   */
-  theme?: TagTheme;
-  /** Tag color text */
-  color?: string;
-  /** Tag size
-   * @default m
-   */
-  size?: TagSize;
-  /** Left addon tag */
-  addonLeft?: React.ElementType;
-  /** Right addon tag */
-  addonRight?: React.ElementType;
-  locale?: string;
-};
+export type TagProps = BoxProps &
+  KeyboardFocusProps & {
+    /** Value responsible for tag availability
+     */
+    disabled?: boolean;
+    /** Value responsible for tag activity
+     */
+    active?: boolean;
+    /** Interactive tag
+     */
+    interactive?: boolean;
+    /** Tag type
+     * @default secondary
+     * @deprecated v4.0.0
+     * @use ITagProps.theme
+     */
+    use?: TagUse;
+    /** Tag theme, there are several default themes or you can use your color
+     * @default primary
+     */
+    theme?: TagTheme;
+    /** Tag color text */
+    color?: string;
+    /** Tag size
+     * @default m
+     */
+    size?: TagSize;
+    /** Left addon tag */
+    addonLeft?: React.ElementType;
+    /** Right addon tag */
+    addonRight?: React.ElementType;
+    locale?: string;
+  };
 
 /** @deprecated */
 export interface ITagCloseProps extends TagCloseProps, UnknownProperties {}
@@ -76,7 +78,7 @@ export type TagAddonProps = BoxProps & {};
 
 /** @deprecated */
 export interface ITagTextProps extends TagTextProps, UnknownProperties {}
-export type TagTextProps = BoxProps & {};
+export type TagTextProps = BoxProps & KeyboardFocusProps & {};
 
 declare const Tag: Intergalactic.Component<'div', TagProps, TagContext> & {
   Text: Intergalactic.Component<'div', TagTextProps>;

package/time-picker/lib/cjs/TimePicker.js

@@ -29,18 +29,18 @@ var _intergalacticDynamicLocales = require("./translations/__intergalactic-dynam
 var _i18nEnhance = _interopRequireDefault(require("intergalactic/utils/lib/enhances/i18nEnhance"));
 var _keyboardFocusEnhance = _interopRequireDefault(require("intergalactic/utils/lib/enhances/keyboardFocusEnhance"));
 /*__reshadow-styles__:"./style/time-picker.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___STimePicker_dmux5_gg_{position:relative;width:auto;outline:0}.___STimePicker_dmux5_gg_.__keyboardFocused_dmux5_gg_:focus{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___STimePicker_dmux5_gg_.__disabled_dmux5_gg_{color:var(--intergalactic-text-secondary, #6c6e79);cursor:default}.___SPickerInput_dmux5_gg_{box-sizing:content-box;text-align:center;z-index:1;height:1.5em}.___SPickerInput_dmux5_gg_.__placeholder_dmux5_gg_{text-overflow:initial}.___SPickerInput_dmux5_gg_:focus{background-color:var(--intergalactic-bg-highlight-focus, rgba(0, 143, 248, 0.2))}.___SPickerInput_dmux5_gg_._size_l_dmux5_gg_,.___SPickerInput_dmux5_gg_._size_m_dmux5_gg_{width:19px;margin:0 var(--intergalactic-spacing-2x, 8px);padding:0}.___SPickerInput_dmux5_gg_._size_l_dmux5_gg_{width:21px}.___SPickerFormat_dmux5_gg_{flex-shrink:0;position:relative;display:inline-flex;padding:0;white-space:nowrap;font-family:inherit;font-weight:var(--intergalactic-medium, 500);line-height:normal;-webkit-text-decoration:none;text-decoration:none;align-items:center;border:1px solid var(--intergalactic-border-primary, #c4c7cf);border-radius:0 var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0;outline:0;box-shadow:none;cursor:pointer;box-sizing:border-box;overflow:visible;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}@media (hover:hover){.___SPickerFormat_dmux5_gg_:hover{color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral-hover, #e0e1e9)}}.___SPickerFormat_dmux5_gg_.__active_dmux5_gg_,.___SPickerFormat_dmux5_gg_:active{color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral-active, #c4c7cf)}.___SPickerFormat_dmux5_gg_._size_m_dmux5_gg_{height:var(--intergalactic-form-control-m, 28px);font-size:var(--intergalactic-fs-200, 14px);margin:0-1px 0 0}.___SPickerFormat_dmux5_gg_._size_m_dmux5_gg_ .___SPickerFormatText_dmux5_gg_{margin:0 var(--intergalactic-spacing-2x, 8px)}.___SPickerFormat_dmux5_gg_._size_l_dmux5_gg_{height:var(--intergalactic-form-control-l, 40px);font-size:var(--intergalactic-fs-300, 16px);margin:0 calc(-1*var(--intergalactic-spacing-1x, 4px))0 0}.___SPickerFormat_dmux5_gg_._size_l_dmux5_gg_ .___SPickerFormatText_dmux5_gg_{margin:0 var(--intergalactic-spacing-3x, 12px)}.___SPickerFormat_dmux5_gg_.__disabled_dmux5_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none;border-color:transparent transparent transparent var(--intergalactic-border-primary, #c4c7cf)}.___SPickerFormat_dmux5_gg_.__keyboardFocused_dmux5_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___STimePickerSeparator_dmux5_gg_{color:var(--intergalactic-text-primary, #191b23)}.___STimePickerSeparator_dmux5_gg_.__disabled_dmux5_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);pointer-events:none}" /*__inner_css_end__*/, "dmux5_gg_") /*__reshadow_css_end__*/, {
-  "__STimePicker": "___STimePicker_dmux5_gg_",
-  "_keyboardFocused": "__keyboardFocused_dmux5_gg_",
-  "_disabled": "__disabled_dmux5_gg_",
-  "__SPickerInput": "___SPickerInput_dmux5_gg_",
-  "_size_m": "_size_m_dmux5_gg_",
-  "_size_l": "_size_l_dmux5_gg_",
-  "__SPickerFormat": "___SPickerFormat_dmux5_gg_",
-  "__STimePickerSeparator": "___STimePickerSeparator_dmux5_gg_",
-  "_placeholder": "__placeholder_dmux5_gg_",
-  "_active": "__active_dmux5_gg_",
-  "__SPickerFormatText": "___SPickerFormatText_dmux5_gg_"
+var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___STimePicker_w0j5e_gg_{position:relative;width:auto;outline:0}.___STimePicker_w0j5e_gg_.__keyboardFocused_w0j5e_gg_:focus{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___STimePicker_w0j5e_gg_.__disabled_w0j5e_gg_{color:var(--intergalactic-text-secondary, #6c6e79);cursor:default}.___SPickerInput_w0j5e_gg_{box-sizing:content-box;text-align:center;z-index:1;height:1.5em}.___SPickerInput_w0j5e_gg_.__placeholder_w0j5e_gg_{text-overflow:initial}.___SPickerInput_w0j5e_gg_:focus{background-color:var(--intergalactic-bg-highlight-focus, rgba(0, 143, 248, 0.2))}.___SPickerInput_w0j5e_gg_._size_l_w0j5e_gg_,.___SPickerInput_w0j5e_gg_._size_m_w0j5e_gg_{width:19px;margin:0 var(--intergalactic-spacing-2x, 8px);padding:0}.___SPickerInput_w0j5e_gg_._size_l_w0j5e_gg_{width:21px}.___SPickerFormat_w0j5e_gg_{flex-shrink:0;position:relative;display:inline-flex;padding:0;white-space:nowrap;font-family:inherit;font-weight:var(--intergalactic-medium, 500);line-height:normal;-webkit-text-decoration:none;text-decoration:none;align-items:center;border:1px solid var(--intergalactic-border-primary, #c4c7cf);border-radius:0 var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0;outline:0;box-shadow:none;cursor:pointer;box-sizing:border-box;overflow:visible;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}@media (hover:hover){.___SPickerFormat_w0j5e_gg_:hover{color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral-hover, #e0e1e9)}}.___SPickerFormat_w0j5e_gg_.__active_w0j5e_gg_,.___SPickerFormat_w0j5e_gg_:active{color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral-active, #c4c7cf)}.___SPickerFormat_w0j5e_gg_._size_m_w0j5e_gg_{height:var(--intergalactic-form-control-m, 28px);font-size:var(--intergalactic-fs-200, 14px);margin:0-1px 0 0}.___SPickerFormat_w0j5e_gg_._size_m_w0j5e_gg_ .___SPickerFormatText_w0j5e_gg_{margin:0 var(--intergalactic-spacing-2x, 8px)}.___SPickerFormat_w0j5e_gg_._size_l_w0j5e_gg_{height:var(--intergalactic-form-control-l, 40px);font-size:var(--intergalactic-fs-300, 16px);margin:0 calc(-1*var(--intergalactic-spacing-1x, 4px))0 0}.___SPickerFormat_w0j5e_gg_._size_l_w0j5e_gg_ .___SPickerFormatText_w0j5e_gg_{margin:0 var(--intergalactic-spacing-3x, 12px)}.___SPickerFormat_w0j5e_gg_.__disabled_w0j5e_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none;border-color:transparent transparent transparent var(--intergalactic-border-primary, #c4c7cf)}.___SPickerFormat_w0j5e_gg_.__keyboardFocused_w0j5e_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___STimePickerSeparator_w0j5e_gg_{color:var(--intergalactic-text-primary, #191b23)}.___STimePickerSeparator_w0j5e_gg_.__disabled_w0j5e_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);pointer-events:none}" /*__inner_css_end__*/, "w0j5e_gg_") /*__reshadow_css_end__*/, {
+  "__STimePicker": "___STimePicker_w0j5e_gg_",
+  "_keyboardFocused": "__keyboardFocused_w0j5e_gg_",
+  "_disabled": "__disabled_w0j5e_gg_",
+  "__SPickerInput": "___SPickerInput_w0j5e_gg_",
+  "_size_m": "_size_m_w0j5e_gg_",
+  "_size_l": "_size_l_w0j5e_gg_",
+  "__SPickerFormat": "___SPickerFormat_w0j5e_gg_",
+  "__STimePickerSeparator": "___STimePickerSeparator_w0j5e_gg_",
+  "_placeholder": "__placeholder_w0j5e_gg_",
+  "_active": "__active_w0j5e_gg_",
+  "__SPickerFormatText": "___SPickerFormatText_w0j5e_gg_"
 });
 var MAP_MERIDIEM = {
   AM: 'PM',

package/time-picker/lib/es6/TimePicker.js

@@ -18,18 +18,18 @@ import Format from './PickerFormat';
 import { localizedMessages } from './translations/__intergalactic-dynamic-locales';
 import i18nEnhance from 'intergalactic/utils/lib/enhances/i18nEnhance';
 /*__reshadow-styles__:"./style/time-picker.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___STimePicker_dmux5_gg_{position:relative;width:auto;outline:0}.___STimePicker_dmux5_gg_.__keyboardFocused_dmux5_gg_:focus{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___STimePicker_dmux5_gg_.__disabled_dmux5_gg_{color:var(--intergalactic-text-secondary, #6c6e79);cursor:default}.___SPickerInput_dmux5_gg_{box-sizing:content-box;text-align:center;z-index:1;height:1.5em}.___SPickerInput_dmux5_gg_.__placeholder_dmux5_gg_{text-overflow:initial}.___SPickerInput_dmux5_gg_:focus{background-color:var(--intergalactic-bg-highlight-focus, rgba(0, 143, 248, 0.2))}.___SPickerInput_dmux5_gg_._size_l_dmux5_gg_,.___SPickerInput_dmux5_gg_._size_m_dmux5_gg_{width:19px;margin:0 var(--intergalactic-spacing-2x, 8px);padding:0}.___SPickerInput_dmux5_gg_._size_l_dmux5_gg_{width:21px}.___SPickerFormat_dmux5_gg_{flex-shrink:0;position:relative;display:inline-flex;padding:0;white-space:nowrap;font-family:inherit;font-weight:var(--intergalactic-medium, 500);line-height:normal;-webkit-text-decoration:none;text-decoration:none;align-items:center;border:1px solid var(--intergalactic-border-primary, #c4c7cf);border-radius:0 var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0;outline:0;box-shadow:none;cursor:pointer;box-sizing:border-box;overflow:visible;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}@media (hover:hover){.___SPickerFormat_dmux5_gg_:hover{color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral-hover, #e0e1e9)}}.___SPickerFormat_dmux5_gg_.__active_dmux5_gg_,.___SPickerFormat_dmux5_gg_:active{color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral-active, #c4c7cf)}.___SPickerFormat_dmux5_gg_._size_m_dmux5_gg_{height:var(--intergalactic-form-control-m, 28px);font-size:var(--intergalactic-fs-200, 14px);margin:0-1px 0 0}.___SPickerFormat_dmux5_gg_._size_m_dmux5_gg_ .___SPickerFormatText_dmux5_gg_{margin:0 var(--intergalactic-spacing-2x, 8px)}.___SPickerFormat_dmux5_gg_._size_l_dmux5_gg_{height:var(--intergalactic-form-control-l, 40px);font-size:var(--intergalactic-fs-300, 16px);margin:0 calc(-1*var(--intergalactic-spacing-1x, 4px))0 0}.___SPickerFormat_dmux5_gg_._size_l_dmux5_gg_ .___SPickerFormatText_dmux5_gg_{margin:0 var(--intergalactic-spacing-3x, 12px)}.___SPickerFormat_dmux5_gg_.__disabled_dmux5_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none;border-color:transparent transparent transparent var(--intergalactic-border-primary, #c4c7cf)}.___SPickerFormat_dmux5_gg_.__keyboardFocused_dmux5_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___STimePickerSeparator_dmux5_gg_{color:var(--intergalactic-text-primary, #191b23)}.___STimePickerSeparator_dmux5_gg_.__disabled_dmux5_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);pointer-events:none}" /*__inner_css_end__*/, "dmux5_gg_") /*__reshadow_css_end__*/, {
-  "__STimePicker": "___STimePicker_dmux5_gg_",
-  "_keyboardFocused": "__keyboardFocused_dmux5_gg_",
-  "_disabled": "__disabled_dmux5_gg_",
-  "__SPickerInput": "___SPickerInput_dmux5_gg_",
-  "_size_m": "_size_m_dmux5_gg_",
-  "_size_l": "_size_l_dmux5_gg_",
-  "__SPickerFormat": "___SPickerFormat_dmux5_gg_",
-  "__STimePickerSeparator": "___STimePickerSeparator_dmux5_gg_",
-  "_placeholder": "__placeholder_dmux5_gg_",
-  "_active": "__active_dmux5_gg_",
-  "__SPickerFormatText": "___SPickerFormatText_dmux5_gg_"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___STimePicker_w0j5e_gg_{position:relative;width:auto;outline:0}.___STimePicker_w0j5e_gg_.__keyboardFocused_w0j5e_gg_:focus{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___STimePicker_w0j5e_gg_.__disabled_w0j5e_gg_{color:var(--intergalactic-text-secondary, #6c6e79);cursor:default}.___SPickerInput_w0j5e_gg_{box-sizing:content-box;text-align:center;z-index:1;height:1.5em}.___SPickerInput_w0j5e_gg_.__placeholder_w0j5e_gg_{text-overflow:initial}.___SPickerInput_w0j5e_gg_:focus{background-color:var(--intergalactic-bg-highlight-focus, rgba(0, 143, 248, 0.2))}.___SPickerInput_w0j5e_gg_._size_l_w0j5e_gg_,.___SPickerInput_w0j5e_gg_._size_m_w0j5e_gg_{width:19px;margin:0 var(--intergalactic-spacing-2x, 8px);padding:0}.___SPickerInput_w0j5e_gg_._size_l_w0j5e_gg_{width:21px}.___SPickerFormat_w0j5e_gg_{flex-shrink:0;position:relative;display:inline-flex;padding:0;white-space:nowrap;font-family:inherit;font-weight:var(--intergalactic-medium, 500);line-height:normal;-webkit-text-decoration:none;text-decoration:none;align-items:center;border:1px solid var(--intergalactic-border-primary, #c4c7cf);border-radius:0 var(--intergalactic-control-rounded, 6px) var(--intergalactic-control-rounded, 6px)0;outline:0;box-shadow:none;cursor:pointer;box-sizing:border-box;overflow:visible;-webkit-user-select:none;-moz-user-select:none;user-select:none;touch-action:manipulation;-webkit-tap-highlight-color:transparent;color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral, #f4f5f9)}@media (hover:hover){.___SPickerFormat_w0j5e_gg_:hover{color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral-hover, #e0e1e9)}}.___SPickerFormat_w0j5e_gg_.__active_w0j5e_gg_,.___SPickerFormat_w0j5e_gg_:active{color:var(--intergalactic-text-secondary, #6c6e79);background-color:var(--intergalactic-bg-secondary-neutral-active, #c4c7cf)}.___SPickerFormat_w0j5e_gg_._size_m_w0j5e_gg_{height:var(--intergalactic-form-control-m, 28px);font-size:var(--intergalactic-fs-200, 14px);margin:0-1px 0 0}.___SPickerFormat_w0j5e_gg_._size_m_w0j5e_gg_ .___SPickerFormatText_w0j5e_gg_{margin:0 var(--intergalactic-spacing-2x, 8px)}.___SPickerFormat_w0j5e_gg_._size_l_w0j5e_gg_{height:var(--intergalactic-form-control-l, 40px);font-size:var(--intergalactic-fs-300, 16px);margin:0 calc(-1*var(--intergalactic-spacing-1x, 4px))0 0}.___SPickerFormat_w0j5e_gg_._size_l_w0j5e_gg_ .___SPickerFormatText_w0j5e_gg_{margin:0 var(--intergalactic-spacing-3x, 12px)}.___SPickerFormat_w0j5e_gg_.__disabled_w0j5e_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);cursor:default;pointer-events:none;border-color:transparent transparent transparent var(--intergalactic-border-primary, #c4c7cf)}.___SPickerFormat_w0j5e_gg_.__keyboardFocused_w0j5e_gg_{box-shadow:var(--intergalactic-keyboard-focus, 0px 0px 0px 3px rgba(0, 143, 248, 0.5))}.___STimePickerSeparator_w0j5e_gg_{color:var(--intergalactic-text-primary, #191b23)}.___STimePickerSeparator_w0j5e_gg_.__disabled_w0j5e_gg_{opacity:var(--intergalactic-disabled-opacity, 0.3);pointer-events:none}" /*__inner_css_end__*/, "w0j5e_gg_") /*__reshadow_css_end__*/, {
+  "__STimePicker": "___STimePicker_w0j5e_gg_",
+  "_keyboardFocused": "__keyboardFocused_w0j5e_gg_",
+  "_disabled": "__disabled_w0j5e_gg_",
+  "__SPickerInput": "___SPickerInput_w0j5e_gg_",
+  "_size_m": "_size_m_w0j5e_gg_",
+  "_size_l": "_size_l_w0j5e_gg_",
+  "__SPickerFormat": "___SPickerFormat_w0j5e_gg_",
+  "__STimePickerSeparator": "___STimePickerSeparator_w0j5e_gg_",
+  "_placeholder": "__placeholder_w0j5e_gg_",
+  "_active": "__active_w0j5e_gg_",
+  "__SPickerFormatText": "___SPickerFormatText_w0j5e_gg_"
 });
 import keyboardFocusEnhance from 'intergalactic/utils/lib/enhances/keyboardFocusEnhance';
 var MAP_MERIDIEM = {

package/tooltip/lib/cjs/Tooltip.js

@@ -24,13 +24,13 @@ var _logger = _interopRequireDefault(require("intergalactic/utils/lib/logger"));
 var _uniqueID = _interopRequireDefault(require("intergalactic/utils/lib/uniqueID"));
 var _excluded = ["Children", "title", "offset", "forcedAdvancedMode"];
 /*__reshadow-styles__:"./style/tooltip.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___STooltip_1vx3l_gg_{position:relative;padding:var(--intergalactic-spacing-3x, 12px);border-radius:var(--intergalactic-popper-rounded, 6px);box-sizing:border-box;color:var(--intergalactic-text-primary, #191b23);font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);word-wrap:break-word;max-width:250px;font-weight:400;white-space:normal;box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15))}.___STooltip_1vx3l_gg_._theme_default_1vx3l_gg_{background-color:var(--intergalactic-tooltip-default, #ffffff);border:1px solid var(--intergalactic-border-secondary, #e0e1e9)}.___STooltip_1vx3l_gg_._theme_invert_1vx3l_gg_{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-tooltip-invert, #191b23);border:1px solid var(--intergalactic-border-tooltip-invert, #6c6e79)}.___STooltip_1vx3l_gg_._theme_warning_1vx3l_gg_{background-color:var(--intergalactic-tooltip-warning, #ffd7df);border:1px solid var(--intergalactic-border-critical-active, #d1002f)}.___STooltip_1vx3l_gg_[data-popper-reference-hidden]{visibility:hidden;pointer-events:none}.___SArrow_1vx3l_gg_,.___SArrow_1vx3l_gg_:before{position:absolute;border:6px solid}.___SArrow_1vx3l_gg_:before{content:\"\"}.___SArrow_1vx3l_gg_._theme_default_1vx3l_gg_{border-color:var(--intergalactic-border-secondary, #e0e1e9)}.___SArrow_1vx3l_gg_._theme_default_1vx3l_gg_:before{border-color:var(--intergalactic-tooltip-default, #ffffff)}.___SArrow_1vx3l_gg_._theme_invert_1vx3l_gg_{border-color:var(--intergalactic-border-tooltip-invert, #6c6e79)}.___SArrow_1vx3l_gg_._theme_invert_1vx3l_gg_::before{border-color:var(--intergalactic-tooltip-invert, #191b23)}.___SArrow_1vx3l_gg_._theme_warning_1vx3l_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SArrow_1vx3l_gg_._theme_warning_1vx3l_gg_::before{border-color:var(--intergalactic-tooltip-warning, #ffd7df)}.___STooltip_1vx3l_gg_[data-popper-placement^=top] .___SArrow_1vx3l_gg_,.___STooltip_1vx3l_gg_[data-popper-placement^=top] .___SArrow_1vx3l_gg_::before{top:100%;border-bottom:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_1vx3l_gg_[data-popper-placement^=top] .___SArrow_1vx3l_gg_::before{top:-7px;left:-6px}.___STooltip_1vx3l_gg_[data-popper-placement^=bottom] .___SArrow_1vx3l_gg_{bottom:100%;border-top:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_1vx3l_gg_[data-popper-placement^=bottom] .___SArrow_1vx3l_gg_::before{top:1px;left:-6px;border-top:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_1vx3l_gg_[data-popper-placement^=left] .___SArrow_1vx3l_gg_,.___STooltip_1vx3l_gg_[data-popper-placement^=left] .___SArrow_1vx3l_gg_::before{left:100%;border-right:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltip_1vx3l_gg_[data-popper-placement^=left] .___SArrow_1vx3l_gg_::before{top:-6px;left:-7px}.___STooltip_1vx3l_gg_[data-popper-placement^=right] .___SArrow_1vx3l_gg_{right:100%;border-left:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltip_1vx3l_gg_[data-popper-placement^=right] .___SArrow_1vx3l_gg_::before{top:-6px;left:1px;border-left:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltipContent_1vx3l_gg_{display:contents}" /*__inner_css_end__*/, "1vx3l_gg_") /*__reshadow_css_end__*/, {
-  "__STooltip": "___STooltip_1vx3l_gg_",
-  "_theme_default": "_theme_default_1vx3l_gg_",
-  "_theme_invert": "_theme_invert_1vx3l_gg_",
-  "_theme_warning": "_theme_warning_1vx3l_gg_",
-  "__STooltipContent": "___STooltipContent_1vx3l_gg_",
-  "__SArrow": "___SArrow_1vx3l_gg_"
+var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___STooltip_it8mm_gg_{position:relative;padding:var(--intergalactic-spacing-3x, 12px);border-radius:var(--intergalactic-popper-rounded, 6px);box-sizing:border-box;color:var(--intergalactic-text-primary, #191b23);font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);word-wrap:break-word;max-width:250px;font-weight:400;white-space:normal;box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15))}.___STooltip_it8mm_gg_._theme_default_it8mm_gg_{background-color:var(--intergalactic-tooltip-default, #ffffff);border:1px solid var(--intergalactic-border-secondary, #e0e1e9)}.___STooltip_it8mm_gg_._theme_invert_it8mm_gg_{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-tooltip-invert, #191b23);border:1px solid var(--intergalactic-border-tooltip-invert, #6c6e79)}.___STooltip_it8mm_gg_._theme_warning_it8mm_gg_{background-color:var(--intergalactic-tooltip-warning, #ffd7df);border:1px solid var(--intergalactic-border-critical-active, #d1002f)}.___STooltip_it8mm_gg_[data-popper-reference-hidden]{visibility:hidden;pointer-events:none}.___SArrow_it8mm_gg_,.___SArrow_it8mm_gg_:before{position:absolute;border:6px solid}.___SArrow_it8mm_gg_:before{content:\"\"}.___SArrow_it8mm_gg_._theme_default_it8mm_gg_{border-color:var(--intergalactic-border-secondary, #e0e1e9)}.___SArrow_it8mm_gg_._theme_default_it8mm_gg_:before{border-color:var(--intergalactic-tooltip-default, #ffffff)}.___SArrow_it8mm_gg_._theme_invert_it8mm_gg_{border-color:var(--intergalactic-border-tooltip-invert, #6c6e79)}.___SArrow_it8mm_gg_._theme_invert_it8mm_gg_::before{border-color:var(--intergalactic-tooltip-invert, #191b23)}.___SArrow_it8mm_gg_._theme_warning_it8mm_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SArrow_it8mm_gg_._theme_warning_it8mm_gg_::before{border-color:var(--intergalactic-tooltip-warning, #ffd7df)}.___STooltip_it8mm_gg_[data-popper-placement^=top] .___SArrow_it8mm_gg_,.___STooltip_it8mm_gg_[data-popper-placement^=top] .___SArrow_it8mm_gg_::before{top:100%;border-bottom:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_it8mm_gg_[data-popper-placement^=top] .___SArrow_it8mm_gg_::before{top:-7px;left:-6px}.___STooltip_it8mm_gg_[data-popper-placement^=bottom] .___SArrow_it8mm_gg_{bottom:100%;border-top:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_it8mm_gg_[data-popper-placement^=bottom] .___SArrow_it8mm_gg_::before{top:1px;left:-6px;border-top:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_it8mm_gg_[data-popper-placement^=left] .___SArrow_it8mm_gg_,.___STooltip_it8mm_gg_[data-popper-placement^=left] .___SArrow_it8mm_gg_::before{left:100%;border-right:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltip_it8mm_gg_[data-popper-placement^=left] .___SArrow_it8mm_gg_::before{top:-6px;left:-7px}.___STooltip_it8mm_gg_[data-popper-placement^=right] .___SArrow_it8mm_gg_{right:100%;border-left:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltip_it8mm_gg_[data-popper-placement^=right] .___SArrow_it8mm_gg_::before{top:-6px;left:1px;border-left:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltipContent_it8mm_gg_{display:contents}" /*__inner_css_end__*/, "it8mm_gg_") /*__reshadow_css_end__*/, {
+  "__STooltip": "___STooltip_it8mm_gg_",
+  "_theme_default": "_theme_default_it8mm_gg_",
+  "_theme_invert": "_theme_invert_it8mm_gg_",
+  "_theme_warning": "_theme_warning_it8mm_gg_",
+  "__STooltipContent": "___STooltipContent_it8mm_gg_",
+  "__SArrow": "___SArrow_it8mm_gg_"
 });
 var Popper = _popper["default"][_core.CREATE_COMPONENT]();
 var TooltipRoot = /*#__PURE__*/function (_Component) {

package/tooltip/lib/es6/Tooltip.js

@@ -20,13 +20,13 @@ import { isAdvanceMode } from 'intergalactic/utils/lib/findComponent';
 import logger from 'intergalactic/utils/lib/logger';
 import uniqueIDEnhancement from 'intergalactic/utils/lib/uniqueID';
 /*__reshadow-styles__:"./style/tooltip.shadow.css"*/
-var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___STooltip_1vx3l_gg_{position:relative;padding:var(--intergalactic-spacing-3x, 12px);border-radius:var(--intergalactic-popper-rounded, 6px);box-sizing:border-box;color:var(--intergalactic-text-primary, #191b23);font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);word-wrap:break-word;max-width:250px;font-weight:400;white-space:normal;box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15))}.___STooltip_1vx3l_gg_._theme_default_1vx3l_gg_{background-color:var(--intergalactic-tooltip-default, #ffffff);border:1px solid var(--intergalactic-border-secondary, #e0e1e9)}.___STooltip_1vx3l_gg_._theme_invert_1vx3l_gg_{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-tooltip-invert, #191b23);border:1px solid var(--intergalactic-border-tooltip-invert, #6c6e79)}.___STooltip_1vx3l_gg_._theme_warning_1vx3l_gg_{background-color:var(--intergalactic-tooltip-warning, #ffd7df);border:1px solid var(--intergalactic-border-critical-active, #d1002f)}.___STooltip_1vx3l_gg_[data-popper-reference-hidden]{visibility:hidden;pointer-events:none}.___SArrow_1vx3l_gg_,.___SArrow_1vx3l_gg_:before{position:absolute;border:6px solid}.___SArrow_1vx3l_gg_:before{content:\"\"}.___SArrow_1vx3l_gg_._theme_default_1vx3l_gg_{border-color:var(--intergalactic-border-secondary, #e0e1e9)}.___SArrow_1vx3l_gg_._theme_default_1vx3l_gg_:before{border-color:var(--intergalactic-tooltip-default, #ffffff)}.___SArrow_1vx3l_gg_._theme_invert_1vx3l_gg_{border-color:var(--intergalactic-border-tooltip-invert, #6c6e79)}.___SArrow_1vx3l_gg_._theme_invert_1vx3l_gg_::before{border-color:var(--intergalactic-tooltip-invert, #191b23)}.___SArrow_1vx3l_gg_._theme_warning_1vx3l_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SArrow_1vx3l_gg_._theme_warning_1vx3l_gg_::before{border-color:var(--intergalactic-tooltip-warning, #ffd7df)}.___STooltip_1vx3l_gg_[data-popper-placement^=top] .___SArrow_1vx3l_gg_,.___STooltip_1vx3l_gg_[data-popper-placement^=top] .___SArrow_1vx3l_gg_::before{top:100%;border-bottom:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_1vx3l_gg_[data-popper-placement^=top] .___SArrow_1vx3l_gg_::before{top:-7px;left:-6px}.___STooltip_1vx3l_gg_[data-popper-placement^=bottom] .___SArrow_1vx3l_gg_{bottom:100%;border-top:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_1vx3l_gg_[data-popper-placement^=bottom] .___SArrow_1vx3l_gg_::before{top:1px;left:-6px;border-top:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_1vx3l_gg_[data-popper-placement^=left] .___SArrow_1vx3l_gg_,.___STooltip_1vx3l_gg_[data-popper-placement^=left] .___SArrow_1vx3l_gg_::before{left:100%;border-right:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltip_1vx3l_gg_[data-popper-placement^=left] .___SArrow_1vx3l_gg_::before{top:-6px;left:-7px}.___STooltip_1vx3l_gg_[data-popper-placement^=right] .___SArrow_1vx3l_gg_{right:100%;border-left:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltip_1vx3l_gg_[data-popper-placement^=right] .___SArrow_1vx3l_gg_::before{top:-6px;left:1px;border-left:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltipContent_1vx3l_gg_{display:contents}" /*__inner_css_end__*/, "1vx3l_gg_") /*__reshadow_css_end__*/, {
-  "__STooltip": "___STooltip_1vx3l_gg_",
-  "_theme_default": "_theme_default_1vx3l_gg_",
-  "_theme_invert": "_theme_invert_1vx3l_gg_",
-  "_theme_warning": "_theme_warning_1vx3l_gg_",
-  "__STooltipContent": "___STooltipContent_1vx3l_gg_",
-  "__SArrow": "___SArrow_1vx3l_gg_"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___STooltip_it8mm_gg_{position:relative;padding:var(--intergalactic-spacing-3x, 12px);border-radius:var(--intergalactic-popper-rounded, 6px);box-sizing:border-box;color:var(--intergalactic-text-primary, #191b23);font-size:var(--intergalactic-fs-200, 14px);line-height:var(--intergalactic-lh-200, 142%);word-wrap:break-word;max-width:250px;font-weight:400;white-space:normal;box-shadow:var(--intergalactic-box-shadow-popper, 0px 1px 12px 0px rgba(25, 27, 35, 0.15))}.___STooltip_it8mm_gg_._theme_default_it8mm_gg_{background-color:var(--intergalactic-tooltip-default, #ffffff);border:1px solid var(--intergalactic-border-secondary, #e0e1e9)}.___STooltip_it8mm_gg_._theme_invert_it8mm_gg_{color:var(--intergalactic-text-primary-invert, #ffffff);background-color:var(--intergalactic-tooltip-invert, #191b23);border:1px solid var(--intergalactic-border-tooltip-invert, #6c6e79)}.___STooltip_it8mm_gg_._theme_warning_it8mm_gg_{background-color:var(--intergalactic-tooltip-warning, #ffd7df);border:1px solid var(--intergalactic-border-critical-active, #d1002f)}.___STooltip_it8mm_gg_[data-popper-reference-hidden]{visibility:hidden;pointer-events:none}.___SArrow_it8mm_gg_,.___SArrow_it8mm_gg_:before{position:absolute;border:6px solid}.___SArrow_it8mm_gg_:before{content:\"\"}.___SArrow_it8mm_gg_._theme_default_it8mm_gg_{border-color:var(--intergalactic-border-secondary, #e0e1e9)}.___SArrow_it8mm_gg_._theme_default_it8mm_gg_:before{border-color:var(--intergalactic-tooltip-default, #ffffff)}.___SArrow_it8mm_gg_._theme_invert_it8mm_gg_{border-color:var(--intergalactic-border-tooltip-invert, #6c6e79)}.___SArrow_it8mm_gg_._theme_invert_it8mm_gg_::before{border-color:var(--intergalactic-tooltip-invert, #191b23)}.___SArrow_it8mm_gg_._theme_warning_it8mm_gg_{border-color:var(--intergalactic-border-critical-active, #d1002f)}.___SArrow_it8mm_gg_._theme_warning_it8mm_gg_::before{border-color:var(--intergalactic-tooltip-warning, #ffd7df)}.___STooltip_it8mm_gg_[data-popper-placement^=top] .___SArrow_it8mm_gg_,.___STooltip_it8mm_gg_[data-popper-placement^=top] .___SArrow_it8mm_gg_::before{top:100%;border-bottom:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_it8mm_gg_[data-popper-placement^=top] .___SArrow_it8mm_gg_::before{top:-7px;left:-6px}.___STooltip_it8mm_gg_[data-popper-placement^=bottom] .___SArrow_it8mm_gg_{bottom:100%;border-top:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_it8mm_gg_[data-popper-placement^=bottom] .___SArrow_it8mm_gg_::before{top:1px;left:-6px;border-top:0 transparent;border-right-color:transparent!important;border-left-color:transparent!important}.___STooltip_it8mm_gg_[data-popper-placement^=left] .___SArrow_it8mm_gg_,.___STooltip_it8mm_gg_[data-popper-placement^=left] .___SArrow_it8mm_gg_::before{left:100%;border-right:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltip_it8mm_gg_[data-popper-placement^=left] .___SArrow_it8mm_gg_::before{top:-6px;left:-7px}.___STooltip_it8mm_gg_[data-popper-placement^=right] .___SArrow_it8mm_gg_{right:100%;border-left:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltip_it8mm_gg_[data-popper-placement^=right] .___SArrow_it8mm_gg_::before{top:-6px;left:1px;border-left:0 transparent;border-top-color:transparent!important;border-bottom-color:transparent!important}.___STooltipContent_it8mm_gg_{display:contents}" /*__inner_css_end__*/, "it8mm_gg_") /*__reshadow_css_end__*/, {
+  "__STooltip": "___STooltip_it8mm_gg_",
+  "_theme_default": "_theme_default_it8mm_gg_",
+  "_theme_invert": "_theme_invert_it8mm_gg_",
+  "_theme_warning": "_theme_warning_it8mm_gg_",
+  "__STooltipContent": "___STooltipContent_it8mm_gg_",
+  "__SArrow": "___SArrow_it8mm_gg_"
 });
 var Popper = PopperOrigin[CREATE_COMPONENT]();
 var TooltipRoot = /*#__PURE__*/function (_Component) {

package/utils/lib/themes/auto.css

@@ -139,8 +139,6 @@
   --intergalactic-border-critical: #ffaeb5;
   /* Active border in the focused input field with invalid state, and active state of the other components with invalid state. */
   --intergalactic-border-critical-active: #d1002f;
-  /* Used for the invalidStatePattern utils component to mark all kinds of inputs with invalid states. */
-  --intergalactic-border-critical-pattern: repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%);
   /* Subtle secondary border in the warning message. */
   --intergalactic-border-warning: #ffb26e;
   /* Active border in components with warning intention. */
@@ -155,6 +153,8 @@
   --intergalactic-border-table-accent: #a9abb6;
   /* Border color of the second period for the comparison mode in the DatePicker. */
   --intergalactic-border-date-picker-range-comparison: #8649e1;
+  /* Used for the invalidStatePattern utils component to mark all kinds of inputs with invalid states. */
+  --intergalactic-border-critical-pattern: repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%);
   /* Subtle background of the Switch control. */
   --intergalactic-control-switch-bg: #a9abb6;
   /* Background of the regular primary control. */
@@ -313,8 +313,6 @@
   --intergalactic-progress-bar-bg-invert: rgba(255, 255, 255, 0.2);
   /* Hover state for the inverted version of the background color of the ProgressBar. */
   --intergalactic-progress-bar-bg-invert-hover: rgba(255, 255, 255, 0.4);
-  /* Value color of the ProgressBar. */
-  --intergalactic-progress-bar-value: #009f81;
   /* Value with gradient for the ProgressBar. */
   --intergalactic-progress-bar-value-gradient: linear-gradient(-45deg, rgba(0, 159, 129, 0.9) 25%, rgba(0, 159, 129, 1) 0%, rgba(0, 159, 129, 1) 50%, rgba(0, 159, 129, 0.9) 0%, rgba(0, 159, 129, 0.9) 75%, rgba(0, 159, 129, 1) 0%);
   /* Null value gradient for the ProgressBar. */
@@ -401,6 +399,10 @@
   --intergalactic-box-shadow-modal: 0px 3px 8px 0px rgba(25, 27, 35, 0.2);
   /* Default shadow of all Poppers, Dropdowns and Tooltips. */
   --intergalactic-box-shadow-popper: 0px 1px 12px 0px rgba(25, 27, 35, 0.15);
+  /* Color for default keyboard focus outline styles. */
+  --intergalactic-keyboard-focus-outline: rgba(0, 143, 248, 0.5);
+  /* Color for default keyboard focus outline styles to use on the dark and color background. */
+  --intergalactic-keyboard-focus-outline-invert: rgba(255, 255, 255, 0.7);
   /* Default keyboard focus styles. */
   --intergalactic-keyboard-focus: 0px 0px 0px 3px rgba(0, 143, 248, 0.5);
   /* Keyboard focus styles for elements with invalid state. */
@@ -1029,8 +1031,6 @@
   --intergalactic-progress-bar-bg-invert: rgba(255, 255, 255, 0.2);
   /* Hover state for the inverted version of the background color of the ProgressBar. */
   --intergalactic-progress-bar-bg-invert-hover: rgba(255, 255, 255, 0.4);
-  /* Value color of the ProgressBar. */
-  --intergalactic-progress-bar-value: #009f81;
   /* Value with gradient for the ProgressBar. */
   --intergalactic-progress-bar-value-gradient: linear-gradient(-45deg, rgba(0, 159, 129, 0.9) 25%, rgba(0, 159, 129, 1) 0%, rgba(0, 159, 129, 1) 50%, rgba(0, 159, 129, 0.9) 0%, rgba(0, 159, 129, 0.9) 75%, rgba(0, 159, 129, 1) 0%);
   /* Null value gradient for the ProgressBar. */

package/utils/lib/themes/dark.css

@@ -303,8 +303,6 @@
   --intergalactic-progress-bar-bg-invert: rgba(255, 255, 255, 0.2);
   /* Hover state for the inverted version of the background color of the ProgressBar. */
   --intergalactic-progress-bar-bg-invert-hover: rgba(255, 255, 255, 0.4);
-  /* Value color of the ProgressBar. */
-  --intergalactic-progress-bar-value: #009f81;
   /* Value with gradient for the ProgressBar. */
   --intergalactic-progress-bar-value-gradient: linear-gradient(-45deg, rgba(0, 159, 129, 0.9) 25%, rgba(0, 159, 129, 1) 0%, rgba(0, 159, 129, 1) 50%, rgba(0, 159, 129, 0.9) 0%, rgba(0, 159, 129, 0.9) 75%, rgba(0, 159, 129, 1) 0%);
   /* Null value gradient for the ProgressBar. */

package/utils/lib/themes/dark.json

@@ -152,7 +152,6 @@
   "--intergalactic-progress-bar-bg-hover": "#c4c7cf",
   "--intergalactic-progress-bar-bg-invert": "rgba(255, 255, 255, 0.2)",
   "--intergalactic-progress-bar-bg-invert-hover": "rgba(255, 255, 255, 0.4)",
-  "--intergalactic-progress-bar-value": "#009f81",
   "--intergalactic-progress-bar-value-gradient": "linear-gradient(-45deg, rgba(0, 159, 129, 0.9) 25%, rgba(0, 159, 129, 1) 0%, rgba(0, 159, 129, 1) 50%, rgba(0, 159, 129, 0.9) 0%, rgba(0, 159, 129, 0.9) 75%, rgba(0, 159, 129, 1) 0%)",
   "--intergalactic-progress-bar-pattern-gradient": "linear-gradient(-45deg, rgba(224, 225, 233, 0.9) 25%, rgba(224, 225, 233, 1) 0%, rgba(224, 225, 233, 1) 50%, rgba(224, 225, 233, 0.9) 0%, rgba(224, 225, 233, 0.9) 75%, rgba(224, 225, 233, 1) 0%)",
   "--intergalactic-progress-bar-value-bg": "#000000",

package/utils/lib/themes/default.css

@@ -139,8 +139,6 @@
   --intergalactic-border-critical: #ffaeb5;
   /* Active border in the focused input field with invalid state, and active state of the other components with invalid state. */
   --intergalactic-border-critical-active: #d1002f;
-  /* Used for the invalidStatePattern utils component to mark all kinds of inputs with invalid states. */
-  --intergalactic-border-critical-pattern: repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%);
   /* Subtle secondary border in the warning message. */
   --intergalactic-border-warning: #ffb26e;
   /* Active border in components with warning intention. */
@@ -155,6 +153,8 @@
   --intergalactic-border-table-accent: #a9abb6;
   /* Border color of the second period for the comparison mode in the DatePicker. */
   --intergalactic-border-date-picker-range-comparison: #8649e1;
+  /* Used for the invalidStatePattern utils component to mark all kinds of inputs with invalid states. */
+  --intergalactic-border-critical-pattern: repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%);
   /* Subtle background of the Switch control. */
   --intergalactic-control-switch-bg: #a9abb6;
   /* Background of the regular primary control. */
@@ -313,8 +313,6 @@
   --intergalactic-progress-bar-bg-invert: rgba(255, 255, 255, 0.2);
   /* Hover state for the inverted version of the background color of the ProgressBar. */
   --intergalactic-progress-bar-bg-invert-hover: rgba(255, 255, 255, 0.4);
-  /* Value color of the ProgressBar. */
-  --intergalactic-progress-bar-value: #009f81;
   /* Value with gradient for the ProgressBar. */
   --intergalactic-progress-bar-value-gradient: linear-gradient(-45deg, rgba(0, 159, 129, 0.9) 25%, rgba(0, 159, 129, 1) 0%, rgba(0, 159, 129, 1) 50%, rgba(0, 159, 129, 0.9) 0%, rgba(0, 159, 129, 0.9) 75%, rgba(0, 159, 129, 1) 0%);
   /* Null value gradient for the ProgressBar. */
@@ -401,6 +399,10 @@
   --intergalactic-box-shadow-modal: 0px 3px 8px 0px rgba(25, 27, 35, 0.2);
   /* Default shadow of all Poppers, Dropdowns and Tooltips. */
   --intergalactic-box-shadow-popper: 0px 1px 12px 0px rgba(25, 27, 35, 0.15);
+  /* Color for default keyboard focus outline styles. */
+  --intergalactic-keyboard-focus-outline: rgba(0, 143, 248, 0.5);
+  /* Color for default keyboard focus outline styles to use on the dark and color background. */
+  --intergalactic-keyboard-focus-outline-invert: rgba(255, 255, 255, 0.7);
   /* Default keyboard focus styles. */
   --intergalactic-keyboard-focus: 0px 0px 0px 3px rgba(0, 143, 248, 0.5);
   /* Keyboard focus styles for elements with invalid state. */

package/utils/lib/themes/default.json

@@ -69,7 +69,6 @@
   "--intergalactic-border-success-active": "#007c65",
   "--intergalactic-border-critical": "#ffaeb5",
   "--intergalactic-border-critical-active": "#d1002f",
-  "--intergalactic-border-critical-pattern": "repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%)",
   "--intergalactic-border-warning": "#ffb26e",
   "--intergalactic-border-warning-active": "#c33909",
   "--intergalactic-border-primary-invert": "#ffffff",
@@ -77,6 +76,7 @@
   "--intergalactic-border-tooltip-invert": "#6c6e79",
   "--intergalactic-border-table-accent": "#a9abb6",
   "--intergalactic-border-date-picker-range-comparison": "#8649e1",
+  "--intergalactic-border-critical-pattern": "repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%)",
   "--intergalactic-control-switch-bg": "#a9abb6",
   "--intergalactic-control-primary-info": "#008ff8",
   "--intergalactic-control-primary-info-hover": "#006dca",
@@ -156,7 +156,6 @@
   "--intergalactic-progress-bar-bg-hover": "#c4c7cf",
   "--intergalactic-progress-bar-bg-invert": "rgba(255, 255, 255, 0.2)",
   "--intergalactic-progress-bar-bg-invert-hover": "rgba(255, 255, 255, 0.4)",
-  "--intergalactic-progress-bar-value": "#009f81",
   "--intergalactic-progress-bar-value-gradient": "linear-gradient(-45deg, rgba(0, 159, 129, 0.9) 25%, rgba(0, 159, 129, 1) 0%, rgba(0, 159, 129, 1) 50%, rgba(0, 159, 129, 0.9) 0%, rgba(0, 159, 129, 0.9) 75%, rgba(0, 159, 129, 1) 0%)",
   "--intergalactic-progress-bar-pattern-gradient": "linear-gradient(-45deg, rgba(224, 225, 233, 0.9) 25%, rgba(224, 225, 233, 1) 0%, rgba(224, 225, 233, 1) 50%, rgba(224, 225, 233, 0.9) 0%, rgba(224, 225, 233, 0.9) 75%, rgba(224, 225, 233, 1) 0%)",
   "--intergalactic-progress-bar-value-bg": "#000000",
@@ -200,6 +199,8 @@
   "--intergalactic-box-shadow-dnd": "0px 0px 1px 0px rgba(25, 27, 35, 0.16), 0px 12px 40px 0px rgba(25, 27, 35, 0.16)",
   "--intergalactic-box-shadow-modal": "0px 3px 8px 0px rgba(25, 27, 35, 0.2)",
   "--intergalactic-box-shadow-popper": "0px 1px 12px 0px rgba(25, 27, 35, 0.15)",
+  "--intergalactic-keyboard-focus-outline": "rgba(0, 143, 248, 0.5)",
+  "--intergalactic-keyboard-focus-outline-invert": "rgba(255, 255, 255, 0.7)",
   "--intergalactic-keyboard-focus": "0px 0px 0px 3px rgba(0, 143, 248, 0.5)",
   "--intergalactic-keyboard-focus-invalid": "0px 0px 0px 3px rgba(255, 73, 83, 0.5)",
   "--intergalactic-keyboard-focus-valid": "0px 0px 0px 3px rgba(0, 159, 129, 0.5)",

package/utils/lib/themes/light.css

@@ -139,8 +139,6 @@
   --intergalactic-border-critical: #ffaeb5;
   /* Active border in the focused input field with invalid state, and active state of the other components with invalid state. */
   --intergalactic-border-critical-active: #d1002f;
-  /* Used for the invalidStatePattern utils component to mark all kinds of inputs with invalid states. */
-  --intergalactic-border-critical-pattern: repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%);
   /* Subtle secondary border in the warning message. */
   --intergalactic-border-warning: #ffb26e;
   /* Active border in components with warning intention. */
@@ -155,6 +153,8 @@
   --intergalactic-border-table-accent: #a9abb6;
   /* Border color of the second period for the comparison mode in the DatePicker. */
   --intergalactic-border-date-picker-range-comparison: #8649e1;
+  /* Used for the invalidStatePattern utils component to mark all kinds of inputs with invalid states. */
+  --intergalactic-border-critical-pattern: repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%);
   /* Subtle background of the Switch control. */
   --intergalactic-control-switch-bg: #a9abb6;
   /* Background of the regular primary control. */
@@ -313,8 +313,6 @@
   --intergalactic-progress-bar-bg-invert: rgba(255, 255, 255, 0.2);
   /* Hover state for the inverted version of the background color of the ProgressBar. */
   --intergalactic-progress-bar-bg-invert-hover: rgba(255, 255, 255, 0.4);
-  /* Value color of the ProgressBar. */
-  --intergalactic-progress-bar-value: #009f81;
   /* Value with gradient for the ProgressBar. */
   --intergalactic-progress-bar-value-gradient: linear-gradient(-45deg, rgba(0, 159, 129, 0.9) 25%, rgba(0, 159, 129, 1) 0%, rgba(0, 159, 129, 1) 50%, rgba(0, 159, 129, 0.9) 0%, rgba(0, 159, 129, 0.9) 75%, rgba(0, 159, 129, 1) 0%);
   /* Null value gradient for the ProgressBar. */
@@ -401,6 +399,10 @@
   --intergalactic-box-shadow-modal: 0px 3px 8px 0px rgba(25, 27, 35, 0.2);
   /* Default shadow of all Poppers, Dropdowns and Tooltips. */
   --intergalactic-box-shadow-popper: 0px 1px 12px 0px rgba(25, 27, 35, 0.15);
+  /* Color for default keyboard focus outline styles. */
+  --intergalactic-keyboard-focus-outline: rgba(0, 143, 248, 0.5);
+  /* Color for default keyboard focus outline styles to use on the dark and color background. */
+  --intergalactic-keyboard-focus-outline-invert: rgba(255, 255, 255, 0.7);
   /* Default keyboard focus styles. */
   --intergalactic-keyboard-focus: 0px 0px 0px 3px rgba(0, 143, 248, 0.5);
   /* Keyboard focus styles for elements with invalid state. */

package/utils/lib/themes/light.json

@@ -69,7 +69,6 @@
   "--intergalactic-border-success-active": "#007c65",
   "--intergalactic-border-critical": "#ffaeb5",
   "--intergalactic-border-critical-active": "#d1002f",
-  "--intergalactic-border-critical-pattern": "repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%)",
   "--intergalactic-border-warning": "#ffb26e",
   "--intergalactic-border-warning-active": "#c33909",
   "--intergalactic-border-primary-invert": "#ffffff",
@@ -77,6 +76,7 @@
   "--intergalactic-border-tooltip-invert": "#6c6e79",
   "--intergalactic-border-table-accent": "#a9abb6",
   "--intergalactic-border-date-picker-range-comparison": "#8649e1",
+  "--intergalactic-border-critical-pattern": "repeating-linear-gradient(315deg, rgba(209, 0, 47, 1) 0, rgba(209, 0, 47, 1) 2px, transparent 0, transparent 50%)",
   "--intergalactic-control-switch-bg": "#a9abb6",
   "--intergalactic-control-primary-info": "#008ff8",
   "--intergalactic-control-primary-info-hover": "#006dca",
@@ -156,7 +156,6 @@
   "--intergalactic-progress-bar-bg-hover": "#c4c7cf",
   "--intergalactic-progress-bar-bg-invert": "rgba(255, 255, 255, 0.2)",
   "--intergalactic-progress-bar-bg-invert-hover": "rgba(255, 255, 255, 0.4)",
-  "--intergalactic-progress-bar-value": "#009f81",
   "--intergalactic-progress-bar-value-gradient": "linear-gradient(-45deg, rgba(0, 159, 129, 0.9) 25%, rgba(0, 159, 129, 1) 0%, rgba(0, 159, 129, 1) 50%, rgba(0, 159, 129, 0.9) 0%, rgba(0, 159, 129, 0.9) 75%, rgba(0, 159, 129, 1) 0%)",
   "--intergalactic-progress-bar-pattern-gradient": "linear-gradient(-45deg, rgba(224, 225, 233, 0.9) 25%, rgba(224, 225, 233, 1) 0%, rgba(224, 225, 233, 1) 50%, rgba(224, 225, 233, 0.9) 0%, rgba(224, 225, 233, 0.9) 75%, rgba(224, 225, 233, 1) 0%)",
   "--intergalactic-progress-bar-value-bg": "#000000",
@@ -200,6 +199,8 @@
   "--intergalactic-box-shadow-dnd": "0px 0px 1px 0px rgba(25, 27, 35, 0.16), 0px 12px 40px 0px rgba(25, 27, 35, 0.16)",
   "--intergalactic-box-shadow-modal": "0px 3px 8px 0px rgba(25, 27, 35, 0.2)",
   "--intergalactic-box-shadow-popper": "0px 1px 12px 0px rgba(25, 27, 35, 0.15)",
+  "--intergalactic-keyboard-focus-outline": "rgba(0, 143, 248, 0.5)",
+  "--intergalactic-keyboard-focus-outline-invert": "rgba(255, 255, 255, 0.7)",
   "--intergalactic-keyboard-focus": "0px 0px 0px 3px rgba(0, 143, 248, 0.5)",
   "--intergalactic-keyboard-focus-invalid": "0px 0px 0px 3px rgba(255, 73, 83, 0.5)",
   "--intergalactic-keyboard-focus-valid": "0px 0px 0px 3px rgba(0, 159, 129, 0.5)",