@semcore/base-components 17.0.0-prerelease.27 → 17.0.0-prerelease.30

package/CHANGELOG.md

@@ -2,7 +2,7 @@
 
 CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangelog.com/en/1.0.0/).
 
-## [17.0.0] - 2026-02-23
+## [17.0.0] - 2026-03-09
 
 ### BREAK
 
@@ -11,89 +11,105 @@ CHANGELOG.md standards are inspired by [keepachangelog.com](https://keepachangel
 - **outside-click**: Removed using `getNodeByRef`. Use `React.RefObject` instead.
 - **scroll-area**: Removed using `getNodeByRef`. Use `React.RefObject` instead.
 
-### Added
-
-- `inset` property for the Box component.
-
-### Changed
-
-- `Hint` now has slicker and more compact styles.
-
 ## [16.4.2] - 2025-12-01
 
 ### Fixed
 
-- **popper**: The "Popper" with focus or hover interaction opens after moving to the
+- The "Popper" with focus or hover interaction opens after moving to the
 trigger from the popper using the Tab key.
 
 ## [16.4.1] - 2025-10-17
 
 ### Fixed
 
-- **scroll-area**: Mouse interaction with elements inside a `ScrollArea.Container` when the container has focus-visible.
+- Mouse interaction with elements inside a `ScrollArea.Container` when the container has focus-visible.
 
 ## [16.4.0] - 2025-10-03
 
 ### Changed
 
-- **flex-box**: Styles for `:focus-visible`.
-- **flex-box**: Border-radius for invalid pattern in InvalidStateBox.
+- Styles for `:focus-visible` in Box and ScrollArea.
+- Border-radius for invalid pattern in InvalidStateBox.
 
 ## [16.3.0] - 2025-09-20
 
 ### Added
 
-- **flex-box**: Ability to use two tags in `tag` property. First for some logic like `Ellipsis` or `Select.Trigger` and second for real `html` tag.
+- Ability to use two tags in `tag` property. First for some logic like `Ellipsis` or `Select.Trigger` and second for real `html` tag.
 
 ## [16.2.4] - 2025-09-12
 
 ### Changed
 
-- **popper**: Don't open popper `onFocus` if last interaction was with mouse.
+- Don't open popper `onFocus` if last interaction was with mouse.
+
+## [16.2.3] - 2025-09-17
+
+### Changed
+
+- Version patch update due to children dependencies update (`@semcore/core` [16.2.0 ~> 16.3.0]).
+
+## [16.2.2] - 2025-09-05
+
+### Changed
+
+- Version patch update due to children dependencies update (`@semcore/core` [16.1.1 ~> 16.2.0]).
 
 ## [16.2.1] - 2025-08-29
 
 ### Changed
 
-- **popper**: Type description for `PopperPopperProps`/`PopperProps`/`ScrollAreaProps`/`ScrollBarProps`/`BoxProps`.
+- Type description for `PopperPopperProps`/`PopperProps`/`ScrollAreaProps`/`ScrollBarProps`/`BoxProps`.
 
 ## [16.2.0] - 2025-08-08
 
 ### Added
 
-- **flex-box**: `text-align` CSS property to `Box` component.
+- `text-align` CSS property to `Box` component.
+
+## [16.1.2] - 2025-07-23
+
+### Changed
+
+- Version patch update due to children dependencies update (`@semcore/core` [16.0.3 ~> 16.0.4]).
+
+## [16.1.1] - 2025-07-04
+
+### Changed
+
+- Version patch update due to children dependencies update (`@semcore/core` [16.0.1 ~> 16.0.3]).
 
 ## [16.1.0] - 2025-06-20
 
 ### Added
 
-- **scroll-area**: New properties - `shadowSize` and `shadowTheme` for customize Shadows.
+- New properties - `shadowSize` and `shadowTheme` for customize Shadows.
 
 ## [16.0.2] - 2025-06-12
 
 ### Added
 
-- **scroll-area**: ResizeObserver for the `Wrapper` component in the `ScrollArea`.
+- ResizeObserver for the `Wrapper` component in the `ScrollArea`.
 
 ### Changed
 
-- **popper**: `keyboardFocus` to `focus` event for popper triggers with `hover` interaction.
+- `keyboardFocus` to `focus` event for popper triggers with `hover` interaction.
 
 ## [16.0.1] - 2025-05-26
 
 ### Fixed
 
-- **animation**: `Delay` doesn't work for the `Collapse` component.
+- `Delay` doesn't work for the `Collapse` component.
 
 ## [16.0.0] - 2025-05-19
 
 ### Added
 
 - Package with base components.
-- **flex-box**: `outline` for all Box'es with `:focus-visible`.
-- **scroll-area**: `topOffset` and `bottomOffset` to Bars.
-- **portal**: `nodeToMount` property.
+- `outline` for all Box'es with `:focus-visible`.
+- `topOffset` and `bottomOffset` to Bars in ScrollArea.
+- `nodeToMount` property to `Portal`.
 
 ### Fixed
 
-- **popper**: `keydown` event was propagated from Popper.
+- `keydown` event was propagated from `Popper`.

package/lib/cjs/components/flex-box/Box/useBox.js

@@ -5,12 +5,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = useBox;
-exports.removeUndefinedKeys = removeUndefinedKeys;
 var _core = require("@semcore/core");
+var _indentStyles = require("@semcore/core/lib/utils/indentStyles");
 var _propsForElement = _interopRequireDefault(require("@semcore/core/lib/utils/propsForElement"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _react = _interopRequireDefault(require("react"));
-var _utils = require("../utils");
 /*!__reshadow-styles__:"../style/use-box.shadow.css"*/
 const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SBox_1suvb_gg_._inAfterOutline_false_1suvb_gg_:focus-visible,.___SBox_1suvb_gg_._inAfterOutline_true_1suvb_gg_:focus-visible::after{z-index:1;outline-color:var(--intergalactic-keyboard-focus-outline, #008ff8);outline-style:solid;outline-width:2px;outline-offset:2px;transition-duration:calc(var(--intergalactic-duration-extra-fast, 100)*1ms);transition-timing-function:ease-in-out;transition-property:outline-color,outline-width,outline-offset}.___SBox_1suvb_gg_._inAfterOutline_false_1suvb_gg_.__invertOutline_1suvb_gg_:focus-visible,.___SBox_1suvb_gg_._inAfterOutline_true_1suvb_gg_.__invertOutline_1suvb_gg_:focus-visible::after{outline-color:var(--intergalactic-keyboard-focus-invert-outline, rgba(255, 255, 255, 0.8))}.___SBox_1suvb_gg_._inAfterOutline_true_1suvb_gg_:focus-visible::after{position:absolute;display:block;content:\"\";top:0;right:0;bottom:0;left:0;top:var(0);right:var(0);bottom:var(0);left:var(0)}.___SBoxInnerOutline_1suvb_gg_._inAfterOutline_false_1suvb_gg_:focus-visible,.___SBoxInnerOutline_1suvb_gg_._inAfterOutline_true_1suvb_gg_:focus-visible::after{outline-offset:-2px}.___SBoxSizing_1suvb_gg_{box-sizing:border-box}.___SBoxInline_1suvb_gg_{display:inline-block}", /*__inner_css_end__*/"1suvb_gg_"),
 /*__reshadow_css_end__*/
@@ -23,56 +22,35 @@ const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_star
   "__SBox": "___SBox_1suvb_gg_",
   "_invertOutline": "__invertOutline_1suvb_gg_"
 });
-function removeUndefinedKeys(obj) {
-  return Object.entries(obj).reduce((acc, [key, value]) => {
-    if (value !== undefined) {
-      acc[key] = value;
-    }
-    return acc;
-  }, {});
-}
-function getSize(size) {
-  if (typeof size !== 'number') {
-    return size;
-  }
-  if (size < 1) {
-    return `${100 * size}%`;
-  }
-  if (size >= 1) {
-    return `${size}px`;
-  }
-}
-
 /** @deprecated */
-
 function calculateIndentStyles(props, scaleIndent) {
-  return removeUndefinedKeys({
+  return (0, _indentStyles.removeUndefinedKeys)({
     display: props['display'],
-    width: getSize(props['w']),
-    height: getSize(props['h']),
-    minWidth: getSize(props['wMin']),
-    maxWidth: getSize(props['wMax']),
-    minHeight: getSize(props['hMin']),
-    maxHeight: getSize(props['hMax']),
+    width: (0, _indentStyles.getSize)(props['w']),
+    height: (0, _indentStyles.getSize)(props['h']),
+    minWidth: (0, _indentStyles.getSize)(props['wMin']),
+    maxWidth: (0, _indentStyles.getSize)(props['wMax']),
+    minHeight: (0, _indentStyles.getSize)(props['hMin']),
+    maxHeight: (0, _indentStyles.getSize)(props['hMax']),
     position: props['position'],
-    top: getSize(props['top']),
-    left: getSize(props['left']),
-    bottom: getSize(props['bottom']),
-    right: getSize(props['right']),
+    top: (0, _indentStyles.getSize)(props['top']),
+    left: (0, _indentStyles.getSize)(props['left']),
+    bottom: (0, _indentStyles.getSize)(props['bottom']),
+    right: (0, _indentStyles.getSize)(props['right']),
     inset: props.inset,
     flex: props.flex,
     zIndex: props.zIndex,
     textAlign: props.textAlign,
-    margin: (0, _utils.getAutoOrScaleIndent)(props['m'], scaleIndent),
-    marginTop: (0, _utils.getAutoOrScaleIndent)(props['mt'], scaleIndent) || (0, _utils.getAutoOrScaleIndent)(props['my'], scaleIndent),
-    marginBottom: (0, _utils.getAutoOrScaleIndent)(props['mb'], scaleIndent) || (0, _utils.getAutoOrScaleIndent)(props['my'], scaleIndent),
-    marginLeft: (0, _utils.getAutoOrScaleIndent)(props['ml'], scaleIndent) || (0, _utils.getAutoOrScaleIndent)(props['mx'], scaleIndent),
-    marginRight: (0, _utils.getAutoOrScaleIndent)(props['mr'], scaleIndent) || (0, _utils.getAutoOrScaleIndent)(props['mx'], scaleIndent),
-    padding: (0, _utils.getAutoOrScaleIndent)(props['p'], scaleIndent),
-    paddingTop: (0, _utils.getAutoOrScaleIndent)(props['pt'], scaleIndent) || (0, _utils.getAutoOrScaleIndent)(props['py'], scaleIndent),
-    paddingBottom: (0, _utils.getAutoOrScaleIndent)(props['pb'], scaleIndent) || (0, _utils.getAutoOrScaleIndent)(props['py'], scaleIndent),
-    paddingLeft: (0, _utils.getAutoOrScaleIndent)(props['pl'], scaleIndent) || (0, _utils.getAutoOrScaleIndent)(props['px'], scaleIndent),
-    paddingRight: (0, _utils.getAutoOrScaleIndent)(props['pr'], scaleIndent) || (0, _utils.getAutoOrScaleIndent)(props['px'], scaleIndent)
+    margin: (0, _indentStyles.getAutoOrScaleIndent)(props['m'], scaleIndent),
+    marginTop: (0, _indentStyles.getAutoOrScaleIndent)(props['mt'], scaleIndent) || (0, _indentStyles.getAutoOrScaleIndent)(props['my'], scaleIndent),
+    marginBottom: (0, _indentStyles.getAutoOrScaleIndent)(props['mb'], scaleIndent) || (0, _indentStyles.getAutoOrScaleIndent)(props['my'], scaleIndent),
+    marginLeft: (0, _indentStyles.getAutoOrScaleIndent)(props['ml'], scaleIndent) || (0, _indentStyles.getAutoOrScaleIndent)(props['mx'], scaleIndent),
+    marginRight: (0, _indentStyles.getAutoOrScaleIndent)(props['mr'], scaleIndent) || (0, _indentStyles.getAutoOrScaleIndent)(props['mx'], scaleIndent),
+    padding: (0, _indentStyles.getAutoOrScaleIndent)(props['p'], scaleIndent),
+    paddingTop: (0, _indentStyles.getAutoOrScaleIndent)(props['pt'], scaleIndent) || (0, _indentStyles.getAutoOrScaleIndent)(props['py'], scaleIndent),
+    paddingBottom: (0, _indentStyles.getAutoOrScaleIndent)(props['pb'], scaleIndent) || (0, _indentStyles.getAutoOrScaleIndent)(props['py'], scaleIndent),
+    paddingLeft: (0, _indentStyles.getAutoOrScaleIndent)(props['pl'], scaleIndent) || (0, _indentStyles.getAutoOrScaleIndent)(props['px'], scaleIndent),
+    paddingRight: (0, _indentStyles.getAutoOrScaleIndent)(props['pr'], scaleIndent) || (0, _indentStyles.getAutoOrScaleIndent)(props['px'], scaleIndent)
   });
 }
 function useBox(props, ref) {

package/lib/cjs/components/flex-box/Box/useBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBox.js","names":["_core","require","_propsForElement","_interopRequireDefault","_classnames","_react","_utils","style","sstyled","insert","removeUndefinedKeys","obj","Object","entries","reduce","acc","key","value","undefined","getSize","size","calculateIndentStyles","props","scaleIndent","display","width","height","minWidth","maxWidth","minHeight","maxHeight","position","top","left","bottom","right","inset","flex","zIndex","textAlign","margin","getAutoOrScaleIndent","marginTop","marginBottom","marginLeft","marginRight","padding","paddingTop","paddingBottom","paddingLeft","paddingRight","useBox","ref","tag","Tag","className","styleProp","boxSizing","inline","innerOutline","invertOutline","inAfterOutline","w","h","wMin","wMax","hMin","hMax","m","mt","mb","my","ml","mr","mx","p","pt","pb","py","pl","pr","px","css","other","indentStyles","React","useMemo","styles","Fragment","children","cn","SBoxSizing","SBoxInline","SBoxInnerOutline","assign","propsForElement"],"sources":["../../../../../src/components/flex-box/Box/useBox.tsx"],"sourcesContent":["import { sstyled, type UnknownProperties, type IStyledProps } from '@semcore/core';\nimport propsForElement from '@semcore/core/lib/utils/propsForElement';\nimport cn from 'classnames';\nimport type { Properties, Property } from 'csstype';\nimport React from 'react';\n\nimport style from '../style/use-box.shadow.css';\nimport { getAutoOrScaleIndent } from '../utils';\n\nexport function removeUndefinedKeys<T extends {}>(obj: T) {\n  return Object.entries(obj).reduce((acc: any, [key, value]) => {\n    if (value !== undefined) {\n      acc[key] = value;\n    }\n    return acc;\n  }, {});\n}\n\nfunction getSize(size: any) {\n  if (typeof size !== 'number') {\n    return size;\n  }\n  if (size < 1) {\n    return `${100 * size}%`;\n  }\n  if (size >= 1) {\n    return `${size}px`;\n  }\n}\n\nexport type BoxProps = IStyledProps & {\n  /**\n   * CSS `display` property\n   */\n  display?: Property.Display;\n\n  /** Sets the `inline-block` property */\n  inline?: boolean;\n\n  /** CSS `box-sizing: border-box` property */\n  boxSizing?: boolean | 'border-box';\n\n  /** CSS `flex` property */\n  flex?: Property.Flex<string>;\n\n  /** CSS `margin` property */\n  m?: number | string;\n\n  /** CSS `margin-top` property */\n  mt?: number | string;\n\n  /** CSS `margin-right` property */\n  mr?: number | string;\n\n  /** CSS `margin-bottom` property */\n  mb?: number | string;\n\n  /** CSS `margin-left` property */\n  ml?: number | string;\n\n  /** CSS `margin-left` and `margin-right` property */\n  mx?: number | string;\n\n  /** CSS `margin-top` and `margin-bottom` property */\n  my?: number | string;\n\n  /** CSS `padding` property */\n  p?: number | string;\n\n  /** CSS `padding-top` property */\n  pt?: number | string;\n\n  /** CSS `padding-right` property */\n  pr?: number | string;\n\n  /** CSS `padding-bottom` property */\n  pb?: number | string;\n\n  /** CSS `padding-left` property */\n  pl?: number | string;\n\n  /** CSS `padding-left` and `padding-right` property */\n  px?: number | string;\n\n  /** CSS `padding-top` and `padding-bottom` property */\n  py?: number | string;\n\n  /**\n   * CSS `width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  w?: number | string;\n\n  /**\n   * CSS `min-width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  wMin?: number | string;\n\n  /**\n   * CSS `max-width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  wMax?: number | string;\n\n  /**\n   * CSS `height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  h?: number | string;\n\n  /**\n   * CSS `min-height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  hMin?: number | string;\n\n  /**\n   * CSS `max-height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  hMax?: number | string;\n\n  /**\n   * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12).\n   * @default 4\n   */\n  scaleIndent?: number;\n\n  /**\n   * Flag for render outline inside box\n   * @default false\n   */\n  innerOutline?: boolean;\n\n  /**\n   * Flag for render inverted outline\n   * @default false\n   */\n  invertOutline?: boolean;\n\n  /**\n   * Flag for render outline in the ::after element\n   * @default false\n   */\n  inAfterOutline?: boolean;\n  /** CSS `position` property */\n  position?: Property.Position;\n  /** CSS `top` property */\n  top?: number | string;\n  /** CSS `left` property */\n  left?: number | string;\n  /** CSS `bottom` property */\n  bottom?: number | string;\n  /** CSS `right` property */\n  right?: number | string;\n  /** CSS `inset` property */\n  inset?: string;\n  /** CSS `z-index` property */\n  zIndex?: number;\n  /** CSS `text-align` property */\n  textAlign?: Property.TextAlign;\n  /** Box content */\n  children?: React.ReactNode;\n};\n\n/** @deprecated */\nexport interface IBoxProps extends BoxProps, UnknownProperties {\n  /**\n   *  HTML tag name for the displayed item\n   * @default div\n   */\n  tag?: React.ElementType | string;\n}\n\nfunction calculateIndentStyles(props: BoxProps, scaleIndent: number) {\n  return removeUndefinedKeys({\n    display: props['display'],\n    width: getSize(props['w']),\n    height: getSize(props['h']),\n    minWidth: getSize(props['wMin']),\n    maxWidth: getSize(props['wMax']),\n    minHeight: getSize(props['hMin']),\n    maxHeight: getSize(props['hMax']),\n    position: props['position'],\n    top: getSize(props['top']),\n    left: getSize(props['left']),\n    bottom: getSize(props['bottom']),\n    right: getSize(props['right']),\n    inset: props.inset,\n    flex: props.flex,\n    zIndex: props.zIndex,\n    textAlign: props.textAlign,\n\n    margin: getAutoOrScaleIndent(props['m'], scaleIndent),\n    marginTop:\n      getAutoOrScaleIndent(props['mt'], scaleIndent) ||\n      getAutoOrScaleIndent(props['my'], scaleIndent),\n    marginBottom:\n      getAutoOrScaleIndent(props['mb'], scaleIndent) ||\n      getAutoOrScaleIndent(props['my'], scaleIndent),\n    marginLeft:\n      getAutoOrScaleIndent(props['ml'], scaleIndent) ||\n      getAutoOrScaleIndent(props['mx'], scaleIndent),\n    marginRight:\n      getAutoOrScaleIndent(props['mr'], scaleIndent) ||\n      getAutoOrScaleIndent(props['mx'], scaleIndent),\n\n    padding: getAutoOrScaleIndent(props['p'], scaleIndent),\n    paddingTop:\n      getAutoOrScaleIndent(props['pt'], scaleIndent) ||\n      getAutoOrScaleIndent(props['py'], scaleIndent),\n    paddingBottom:\n      getAutoOrScaleIndent(props['pb'], scaleIndent) ||\n      getAutoOrScaleIndent(props['py'], scaleIndent),\n    paddingLeft:\n      getAutoOrScaleIndent(props['pl'], scaleIndent) ||\n      getAutoOrScaleIndent(props['px'], scaleIndent),\n    paddingRight:\n      getAutoOrScaleIndent(props['pr'], scaleIndent) ||\n      getAutoOrScaleIndent(props['px'], scaleIndent),\n  });\n}\n\nexport default function useBox<T extends BoxProps>(\n  props: T,\n  ref: React.Ref<HTMLElement>,\n): [React.ElementType | string, any] {\n  const {\n    tag: Tag = 'div',\n    className,\n    style: styleProp,\n    scaleIndent = 4,\n    display,\n    boxSizing,\n    inline,\n    innerOutline,\n    invertOutline,\n    inAfterOutline,\n    flex,\n    w,\n    h,\n    wMin,\n    wMax,\n    hMin,\n    hMax,\n    m,\n    mt,\n    mb,\n    my,\n    ml,\n    mr,\n    mx,\n    p,\n    pt,\n    pb,\n    py,\n    pl,\n    pr,\n    px,\n    css,\n    position,\n    top,\n    left,\n    bottom,\n    right,\n    inset,\n    zIndex,\n    ...other\n  } = props as any;\n\n  const indentStyles: Properties = React.useMemo(() => {\n    return calculateIndentStyles(props, scaleIndent);\n  }, [\n    scaleIndent,\n    display,\n    w,\n    h,\n    wMin,\n    wMax,\n    hMin,\n    hMax,\n    flex,\n    m,\n    mt,\n    mb,\n    my,\n    ml,\n    mr,\n    mx,\n    p,\n    pt,\n    pb,\n    py,\n    pl,\n    pr,\n    px,\n    position,\n    top,\n    left,\n    bottom,\n    right,\n    inset,\n    zIndex,\n  ]);\n\n  const styles = sstyled(style);\n\n  if (Tag === React.Fragment) return [React.Fragment, { children: props.children }];\n\n  return [\n    Tag,\n    {\n      ref,\n      'className':\n        cn(\n          styles.cn('SBox', {\n            SBoxSizing: boxSizing,\n            SBoxInline: inline,\n            SBoxInnerOutline: innerOutline,\n            inAfterOutline: inAfterOutline === true ? 'true' : 'false',\n            invertOutline,\n          }).className,\n          className,\n        ) || undefined,\n      'style': Object.assign({}, styleProp, css, indentStyles),\n      'data-ui-name': 'Box',\n      ...propsForElement(other, Tag),\n    },\n  ];\n}\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"useBox.js","names":["_core","require","_indentStyles","_propsForElement","_interopRequireDefault","_classnames","_react","style","sstyled","insert","calculateIndentStyles","props","scaleIndent","removeUndefinedKeys","display","width","getSize","height","minWidth","maxWidth","minHeight","maxHeight","position","top","left","bottom","right","inset","flex","zIndex","textAlign","margin","getAutoOrScaleIndent","marginTop","marginBottom","marginLeft","marginRight","padding","paddingTop","paddingBottom","paddingLeft","paddingRight","useBox","ref","tag","Tag","className","styleProp","boxSizing","inline","innerOutline","invertOutline","inAfterOutline","w","h","wMin","wMax","hMin","hMax","m","mt","mb","my","ml","mr","mx","p","pt","pb","py","pl","pr","px","css","other","indentStyles","React","useMemo","styles","Fragment","children","cn","SBoxSizing","SBoxInline","SBoxInnerOutline","undefined","Object","assign","propsForElement"],"sources":["../../../../../src/components/flex-box/Box/useBox.tsx"],"sourcesContent":["import { sstyled, type UnknownProperties, type IStyledProps } from '@semcore/core';\nimport { getAutoOrScaleIndent, removeUndefinedKeys, getSize } from '@semcore/core/lib/utils/indentStyles';\nimport propsForElement from '@semcore/core/lib/utils/propsForElement';\nimport cn from 'classnames';\nimport type { Properties, Property } from 'csstype';\nimport React from 'react';\n\nimport style from '../style/use-box.shadow.css';\n\nexport type BoxProps = IStyledProps & {\n  /**\n   * CSS `display` property\n   */\n  display?: Property.Display;\n\n  /** Sets the `inline-block` property */\n  inline?: boolean;\n\n  /** CSS `box-sizing: border-box` property */\n  boxSizing?: boolean | 'border-box';\n\n  /** CSS `flex` property */\n  flex?: Property.Flex<string>;\n\n  /** CSS `margin` property */\n  m?: number | string;\n\n  /** CSS `margin-top` property */\n  mt?: number | string;\n\n  /** CSS `margin-right` property */\n  mr?: number | string;\n\n  /** CSS `margin-bottom` property */\n  mb?: number | string;\n\n  /** CSS `margin-left` property */\n  ml?: number | string;\n\n  /** CSS `margin-left` and `margin-right` property */\n  mx?: number | string;\n\n  /** CSS `margin-top` and `margin-bottom` property */\n  my?: number | string;\n\n  /** CSS `padding` property */\n  p?: number | string;\n\n  /** CSS `padding-top` property */\n  pt?: number | string;\n\n  /** CSS `padding-right` property */\n  pr?: number | string;\n\n  /** CSS `padding-bottom` property */\n  pb?: number | string;\n\n  /** CSS `padding-left` property */\n  pl?: number | string;\n\n  /** CSS `padding-left` and `padding-right` property */\n  px?: number | string;\n\n  /** CSS `padding-top` and `padding-bottom` property */\n  py?: number | string;\n\n  /**\n   * CSS `width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  w?: number | string;\n\n  /**\n   * CSS `min-width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  wMin?: number | string;\n\n  /**\n   * CSS `max-width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  wMax?: number | string;\n\n  /**\n   * CSS `height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  h?: number | string;\n\n  /**\n   * CSS `min-height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  hMin?: number | string;\n\n  /**\n   * CSS `max-height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  hMax?: number | string;\n\n  /**\n   * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12).\n   * @default 4\n   */\n  scaleIndent?: number;\n\n  /**\n   * Flag for render outline inside box\n   * @default false\n   */\n  innerOutline?: boolean;\n\n  /**\n   * Flag for render inverted outline\n   * @default false\n   */\n  invertOutline?: boolean;\n\n  /**\n   * Flag for render outline in the ::after element\n   * @default false\n   */\n  inAfterOutline?: boolean;\n  /** CSS `position` property */\n  position?: Property.Position;\n  /** CSS `top` property */\n  top?: number | string;\n  /** CSS `left` property */\n  left?: number | string;\n  /** CSS `bottom` property */\n  bottom?: number | string;\n  /** CSS `right` property */\n  right?: number | string;\n  /** CSS `inset` property */\n  inset?: string;\n  /** CSS `z-index` property */\n  zIndex?: number;\n  /** CSS `text-align` property */\n  textAlign?: Property.TextAlign;\n  /** Box content */\n  children?: React.ReactNode;\n};\n\n/** @deprecated */\nexport interface IBoxProps extends BoxProps, UnknownProperties {\n  /**\n   *  HTML tag name for the displayed item\n   * @default div\n   */\n  tag?: React.ElementType | string;\n}\n\nfunction calculateIndentStyles(props: BoxProps, scaleIndent: number) {\n  return removeUndefinedKeys({\n    display: props['display'],\n    width: getSize(props['w']),\n    height: getSize(props['h']),\n    minWidth: getSize(props['wMin']),\n    maxWidth: getSize(props['wMax']),\n    minHeight: getSize(props['hMin']),\n    maxHeight: getSize(props['hMax']),\n    position: props['position'],\n    top: getSize(props['top']),\n    left: getSize(props['left']),\n    bottom: getSize(props['bottom']),\n    right: getSize(props['right']),\n    inset: props.inset,\n    flex: props.flex,\n    zIndex: props.zIndex,\n    textAlign: props.textAlign,\n\n    margin: getAutoOrScaleIndent(props['m'], scaleIndent),\n    marginTop:\n      getAutoOrScaleIndent(props['mt'], scaleIndent) ||\n      getAutoOrScaleIndent(props['my'], scaleIndent),\n    marginBottom:\n      getAutoOrScaleIndent(props['mb'], scaleIndent) ||\n      getAutoOrScaleIndent(props['my'], scaleIndent),\n    marginLeft:\n      getAutoOrScaleIndent(props['ml'], scaleIndent) ||\n      getAutoOrScaleIndent(props['mx'], scaleIndent),\n    marginRight:\n      getAutoOrScaleIndent(props['mr'], scaleIndent) ||\n      getAutoOrScaleIndent(props['mx'], scaleIndent),\n\n    padding: getAutoOrScaleIndent(props['p'], scaleIndent),\n    paddingTop:\n      getAutoOrScaleIndent(props['pt'], scaleIndent) ||\n      getAutoOrScaleIndent(props['py'], scaleIndent),\n    paddingBottom:\n      getAutoOrScaleIndent(props['pb'], scaleIndent) ||\n      getAutoOrScaleIndent(props['py'], scaleIndent),\n    paddingLeft:\n      getAutoOrScaleIndent(props['pl'], scaleIndent) ||\n      getAutoOrScaleIndent(props['px'], scaleIndent),\n    paddingRight:\n      getAutoOrScaleIndent(props['pr'], scaleIndent) ||\n      getAutoOrScaleIndent(props['px'], scaleIndent),\n  });\n}\n\nexport default function useBox<T extends BoxProps>(\n  props: T,\n  ref: React.Ref<HTMLElement>,\n): [React.ElementType | string, any] {\n  const {\n    tag: Tag = 'div',\n    className,\n    style: styleProp,\n    scaleIndent = 4,\n    display,\n    boxSizing,\n    inline,\n    innerOutline,\n    invertOutline,\n    inAfterOutline,\n    flex,\n    w,\n    h,\n    wMin,\n    wMax,\n    hMin,\n    hMax,\n    m,\n    mt,\n    mb,\n    my,\n    ml,\n    mr,\n    mx,\n    p,\n    pt,\n    pb,\n    py,\n    pl,\n    pr,\n    px,\n    css,\n    position,\n    top,\n    left,\n    bottom,\n    right,\n    inset,\n    zIndex,\n    ...other\n  } = props as any;\n\n  const indentStyles: Properties = React.useMemo(() => {\n    return calculateIndentStyles(props, scaleIndent);\n  }, [\n    scaleIndent,\n    display,\n    w,\n    h,\n    wMin,\n    wMax,\n    hMin,\n    hMax,\n    flex,\n    m,\n    mt,\n    mb,\n    my,\n    ml,\n    mr,\n    mx,\n    p,\n    pt,\n    pb,\n    py,\n    pl,\n    pr,\n    px,\n    position,\n    top,\n    left,\n    bottom,\n    right,\n    inset,\n    zIndex,\n  ]);\n\n  const styles = sstyled(style);\n\n  if (Tag === React.Fragment) return [React.Fragment, { children: props.children }];\n\n  return [\n    Tag,\n    {\n      ref,\n      'className':\n        cn(\n          styles.cn('SBox', {\n            SBoxSizing: boxSizing,\n            SBoxInline: inline,\n            SBoxInnerOutline: innerOutline,\n            inAfterOutline: inAfterOutline === true ? 'true' : 'false',\n            invertOutline,\n          }).className,\n          className,\n        ) || undefined,\n      'style': Object.assign({}, styleProp, css, indentStyles),\n      'data-ui-name': 'Box',\n      ...propsForElement(other, Tag),\n    },\n  ];\n}\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/flex-box/Flex/useFlex.js

@@ -1,16 +1,15 @@
 "use strict";
 
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = useFlex;
 var _core = require("@semcore/core");
+var _indentStyles = require("@semcore/core/lib/utils/indentStyles");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _react = _interopRequireDefault(require("react"));
-var _useBox = _interopRequireWildcard(require("../Box/useBox"));
-var _utils = require("../utils");
+var _useBox = _interopRequireDefault(require("../Box/useBox"));
 /*!__reshadow-styles__:"../style/use-flex.shadow.css"*/
 const style = (/*__reshadow_css_start__*/_core.sstyled.insert(/*__inner_css_start__*/".___SFlex_fqcaq_gg_{display:flex}.___SFlex_fqcaq_gg_.__inline_fqcaq_gg_{display:inline-flex}", /*__inner_css_end__*/"fqcaq_gg_"),
 /*__reshadow_css_end__*/
@@ -24,14 +23,14 @@ function calculateFlexStyles(props) {
     column: 'column-reverse'
   };
   const scaleIndent = props.scaleIndent ?? 4;
-  return (0, _useBox.removeUndefinedKeys)({
+  return (0, _indentStyles.removeUndefinedKeys)({
     alignItems: props.alignItems,
     alignContent: props.alignContent,
     justifyContent: props.justifyContent,
     flexWrap: props.flexWrap ? `wrap${props.reverse ? '-reverse' : ''}` : undefined,
     flexDirection: props.reverse && DirectionReverse[props.direction] || props.direction,
-    rowGap: (0, _utils.getAutoOrScaleIndent)(props.rowGap || props.gap, scaleIndent),
-    columnGap: (0, _utils.getAutoOrScaleIndent)(props.columnGap || props.gap, scaleIndent)
+    rowGap: (0, _indentStyles.getAutoOrScaleIndent)(props.rowGap || props.gap, scaleIndent),
+    columnGap: (0, _indentStyles.getAutoOrScaleIndent)(props.columnGap || props.gap, scaleIndent)
   });
 }
 function useFlex(props, ref) {

package/lib/cjs/components/flex-box/Flex/useFlex.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFlex.js","names":["_core","require","_classnames","_interopRequireDefault","_react","_useBox","_interopRequireWildcard","_utils","style","sstyled","insert","calculateFlexStyles","props","DirectionReverse","row","column","scaleIndent","removeUndefinedKeys","alignItems","alignContent","justifyContent","flexWrap","reverse","undefined","flexDirection","direction","rowGap","getAutoOrScaleIndent","gap","columnGap","useFlex","ref","Tag","className","styleProp","other","useBox","inline","flexStyles","React","useMemo","styles","Fragment","children","cn","Object","assign"],"sources":["../../../../../src/components/flex-box/Flex/useFlex.tsx"],"sourcesContent":["import { sstyled } from '@semcore/core';\nimport cn from 'classnames';\nimport type { Property, Properties } from 'csstype';\nimport React from 'react';\n\nimport useBox, { type BoxProps, removeUndefinedKeys } from '../Box/useBox';\nimport style from '../style/use-flex.shadow.css';\nimport { getAutoOrScaleIndent } from '../utils';\n\nexport type FlexProps = BoxProps & {\n  /**\n   * It manages the `inline-flex` property\n   */\n  inline?: boolean;\n  /**\n   * Adds the `reverse` property to `flex-direction`\n   */\n  reverse?: boolean;\n  /**\n   * It manages the `flex-wrap` property\n   */\n  flexWrap?: boolean;\n  /**\n   * It manages the `flex-direction` property\n   */\n  direction?: Property.FlexDirection;\n  /**\n   * It manages the `align-items` property\n   */\n  alignItems?: Property.AlignItems;\n  /**\n   * It manages the `align-content` property\n   */\n  alignContent?: Property.AlignContent;\n  /**\n   * CSS `justify-content` property\n   */\n  justifyContent?: Property.JustifyContent;\n  /**\n   * CSS `gap` property\n   */\n  gap?: Property.Gap<number>;\n  /**\n   * CSS `gap` property\n   */\n  rowGap?: Property.RowGap<number>;\n  /**\n   * CSS `gap` property\n   */\n  columnGap?: Property.ColumnGap<number>;\n\n  /**\n   * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12).\n   * @default 4\n   */\n  scaleIndent?: number;\n};\n\nfunction calculateFlexStyles(props: any) {\n  const DirectionReverse: Record<string, string> = {\n    row: 'row-reverse',\n    column: 'column-reverse',\n  };\n\n  const scaleIndent = props.scaleIndent ?? 4;\n\n  return removeUndefinedKeys({\n    alignItems: props.alignItems,\n    alignContent: props.alignContent,\n    justifyContent: props.justifyContent,\n    flexWrap: props.flexWrap ? `wrap${props.reverse ? '-reverse' : ''}` : undefined,\n    flexDirection: (props.reverse && DirectionReverse[props.direction]) || props.direction,\n    rowGap: getAutoOrScaleIndent(props.rowGap || props.gap, scaleIndent),\n    columnGap: getAutoOrScaleIndent(props.columnGap || props.gap, scaleIndent),\n  });\n}\n\nexport default function useFlex<T extends FlexProps>(\n  props: T,\n  ref: React.Ref<HTMLElement>,\n): [React.ElementType | string, any] {\n  const [Tag, { className, style: styleProp, ...other }] = useBox(\n    {\n      'data-ui-name': 'Flex',\n      ...props,\n      'inline': false,\n    },\n    ref,\n  );\n  const {\n    inline,\n    flexWrap,\n    direction,\n    reverse,\n    alignItems,\n    alignContent,\n    justifyContent,\n    gap,\n    rowGap,\n    columnGap,\n    scaleIndent,\n  } = props;\n\n  const flexStyles: Properties = React.useMemo(() => {\n    return calculateFlexStyles(props);\n  }, [\n    flexWrap,\n    direction,\n    reverse,\n    alignItems,\n    alignContent,\n    justifyContent,\n    gap,\n    rowGap,\n    columnGap,\n    scaleIndent,\n  ]);\n\n  const styles = sstyled(style);\n\n  if (Tag === React.Fragment) return [React.Fragment, { children: props.children }];\n\n  return [\n    Tag,\n    {\n      className:\n        cn(\n          styles.cn('SFlex', {\n            inline: inline,\n          }).className,\n          className,\n        ) || undefined,\n      style: Object.assign({}, styleProp, flexStyles),\n      ...other,\n    },\n  ];\n}\n"],"mappings":";;;;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,WAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,MAAA,GAAAD,sBAAA,CAAAF,OAAA;AAEA,IAAAI,OAAA,GAAAC,uBAAA,CAAAL,OAAA;AAEA,IAAAM,MAAA,GAAAN,OAAA;AAAgD;AAAA,MAAAO,KAAA,8BAAAR,KAAA,CAAAS,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;AAAA;AAmDhD,SAASC,mBAAmBA,CAACC,KAAU,EAAE;EACvC,MAAMC,gBAAwC,GAAG;IAC/CC,GAAG,EAAE,aAAa;IAClBC,MAAM,EAAE;EACV,CAAC;EAED,MAAMC,WAAW,GAAGJ,KAAK,CAACI,WAAW,IAAI,CAAC;EAE1C,OAAO,IAAAC,2BAAmB,EAAC;IACzBC,UAAU,EAAEN,KAAK,CAACM,UAAU;IAC5BC,YAAY,EAAEP,KAAK,CAACO,YAAY;IAChCC,cAAc,EAAER,KAAK,CAACQ,cAAc;IACpCC,QAAQ,EAAET,KAAK,CAACS,QAAQ,GAAG,OAAOT,KAAK,CAACU,OAAO,GAAG,UAAU,GAAG,EAAE,EAAE,GAAGC,SAAS;IAC/EC,aAAa,EAAGZ,KAAK,CAACU,OAAO,IAAIT,gBAAgB,CAACD,KAAK,CAACa,SAAS,CAAC,IAAKb,KAAK,CAACa,SAAS;IACtFC,MAAM,EAAE,IAAAC,2BAAoB,EAACf,KAAK,CAACc,MAAM,IAAId,KAAK,CAACgB,GAAG,EAAEZ,WAAW,CAAC;IACpEa,SAAS,EAAE,IAAAF,2BAAoB,EAACf,KAAK,CAACiB,SAAS,IAAIjB,KAAK,CAACgB,GAAG,EAAEZ,WAAW;EAC3E,CAAC,CAAC;AACJ;AAEe,SAASc,OAAOA,CAC7BlB,KAAQ,EACRmB,GAA2B,EACQ;EACnC,MAAM,CAACC,GAAG,EAAE;IAAEC,SAAS;IAAEzB,KAAK,EAAE0B,SAAS;IAAE,GAAGC;EAAM,CAAC,CAAC,GAAG,IAAAC,eAAM,EAC7D;IACE,cAAc,EAAE,MAAM;IACtB,GAAGxB,KAAK;IACR,QAAQ,EAAE;EACZ,CAAC,EACDmB,GACF,CAAC;EACD,MAAM;IACJM,MAAM;IACNhB,QAAQ;IACRI,SAAS;IACTH,OAAO;IACPJ,UAAU;IACVC,YAAY;IACZC,cAAc;IACdQ,GAAG;IACHF,MAAM;IACNG,SAAS;IACTb;EACF,CAAC,GAAGJ,KAAK;EAET,MAAM0B,UAAsB,GAAGC,cAAK,CAACC,OAAO,CAAC,MAAM;IACjD,OAAO7B,mBAAmB,CAACC,KAAK,CAAC;EACnC,CAAC,EAAE,CACDS,QAAQ,EACRI,SAAS,EACTH,OAAO,EACPJ,UAAU,EACVC,YAAY,EACZC,cAAc,EACdQ,GAAG,EACHF,MAAM,EACNG,SAAS,EACTb,WAAW,CACZ,CAAC;EAEF,MAAMyB,MAAM,GAAG,IAAAhC,aAAO,EAACD,KAAK,CAAC;EAE7B,IAAIwB,GAAG,KAAKO,cAAK,CAACG,QAAQ,EAAE,OAAO,CAACH,cAAK,CAACG,QAAQ,EAAE;IAAEC,QAAQ,EAAE/B,KAAK,CAAC+B;EAAS,CAAC,CAAC;EAEjF,OAAO,CACLX,GAAG,EACH;IACEC,SAAS,EACP,IAAAW,mBAAE,EACAH,MAAM,CAACG,EAAE,CAAC,OAAO,EAAE;MACjBP,MAAM,EAAEA;IACV,CAAC,CAAC,CAACJ,SAAS,EACZA,SACF,CAAC,IAAIV,SAAS;IAChBf,KAAK,EAAEqC,MAAM,CAACC,MAAM,CAAC,CAAC,CAAC,EAAEZ,SAAS,EAAEI,UAAU,CAAC;IAC/C,GAAGH;EACL,CAAC,CACF;AACH","ignoreList":[]}
+{"version":3,"file":"useFlex.js","names":["_core","require","_indentStyles","_classnames","_interopRequireDefault","_react","_useBox","style","sstyled","insert","calculateFlexStyles","props","DirectionReverse","row","column","scaleIndent","removeUndefinedKeys","alignItems","alignContent","justifyContent","flexWrap","reverse","undefined","flexDirection","direction","rowGap","getAutoOrScaleIndent","gap","columnGap","useFlex","ref","Tag","className","styleProp","other","useBox","inline","flexStyles","React","useMemo","styles","Fragment","children","cn","Object","assign"],"sources":["../../../../../src/components/flex-box/Flex/useFlex.tsx"],"sourcesContent":["import { sstyled } from '@semcore/core';\nimport { getAutoOrScaleIndent, removeUndefinedKeys } from '@semcore/core/lib/utils/indentStyles';\nimport cn from 'classnames';\nimport type { Property, Properties } from 'csstype';\nimport React from 'react';\n\nimport useBox, { type BoxProps } from '../Box/useBox';\nimport style from '../style/use-flex.shadow.css';\n\nexport type FlexProps = BoxProps & {\n  /**\n   * It manages the `inline-flex` property\n   */\n  inline?: boolean;\n  /**\n   * Adds the `reverse` property to `flex-direction`\n   */\n  reverse?: boolean;\n  /**\n   * It manages the `flex-wrap` property\n   */\n  flexWrap?: boolean;\n  /**\n   * It manages the `flex-direction` property\n   */\n  direction?: Property.FlexDirection;\n  /**\n   * It manages the `align-items` property\n   */\n  alignItems?: Property.AlignItems;\n  /**\n   * It manages the `align-content` property\n   */\n  alignContent?: Property.AlignContent;\n  /**\n   * CSS `justify-content` property\n   */\n  justifyContent?: Property.JustifyContent;\n  /**\n   * CSS `gap` property\n   */\n  gap?: Property.Gap<number>;\n  /**\n   * CSS `gap` property\n   */\n  rowGap?: Property.RowGap<number>;\n  /**\n   * CSS `gap` property\n   */\n  columnGap?: Property.ColumnGap<number>;\n\n  /**\n   * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12).\n   * @default 4\n   */\n  scaleIndent?: number;\n};\n\nfunction calculateFlexStyles(props: any) {\n  const DirectionReverse: Record<string, string> = {\n    row: 'row-reverse',\n    column: 'column-reverse',\n  };\n\n  const scaleIndent = props.scaleIndent ?? 4;\n\n  return removeUndefinedKeys({\n    alignItems: props.alignItems,\n    alignContent: props.alignContent,\n    justifyContent: props.justifyContent,\n    flexWrap: props.flexWrap ? `wrap${props.reverse ? '-reverse' : ''}` : undefined,\n    flexDirection: (props.reverse && DirectionReverse[props.direction]) || props.direction,\n    rowGap: getAutoOrScaleIndent(props.rowGap || props.gap, scaleIndent),\n    columnGap: getAutoOrScaleIndent(props.columnGap || props.gap, scaleIndent),\n  });\n}\n\nexport default function useFlex<T extends FlexProps>(\n  props: T,\n  ref: React.Ref<HTMLElement>,\n): [React.ElementType | string, any] {\n  const [Tag, { className, style: styleProp, ...other }] = useBox(\n    {\n      'data-ui-name': 'Flex',\n      ...props,\n      'inline': false,\n    },\n    ref,\n  );\n  const {\n    inline,\n    flexWrap,\n    direction,\n    reverse,\n    alignItems,\n    alignContent,\n    justifyContent,\n    gap,\n    rowGap,\n    columnGap,\n    scaleIndent,\n  } = props;\n\n  const flexStyles: Properties = React.useMemo(() => {\n    return calculateFlexStyles(props);\n  }, [\n    flexWrap,\n    direction,\n    reverse,\n    alignItems,\n    alignContent,\n    justifyContent,\n    gap,\n    rowGap,\n    columnGap,\n    scaleIndent,\n  ]);\n\n  const styles = sstyled(style);\n\n  if (Tag === React.Fragment) return [React.Fragment, { children: props.children }];\n\n  return [\n    Tag,\n    {\n      className:\n        cn(\n          styles.cn('SFlex', {\n            inline: inline,\n          }).className,\n          className,\n        ) || undefined,\n      style: Object.assign({}, styleProp, flexStyles),\n      ...other,\n    },\n  ];\n}\n"],"mappings":";;;;;;;AAAA,IAAAA,KAAA,GAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AACA,IAAAE,WAAA,GAAAC,sBAAA,CAAAH,OAAA;AAEA,IAAAI,MAAA,GAAAD,sBAAA,CAAAH,OAAA;AAEA,IAAAK,OAAA,GAAAF,sBAAA,CAAAH,OAAA;AAAsD;AAAA,MAAAM,KAAA,8BAAAP,KAAA,CAAAQ,OAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;AAAA;AAoDtD,SAASC,mBAAmBA,CAACC,KAAU,EAAE;EACvC,MAAMC,gBAAwC,GAAG;IAC/CC,GAAG,EAAE,aAAa;IAClBC,MAAM,EAAE;EACV,CAAC;EAED,MAAMC,WAAW,GAAGJ,KAAK,CAACI,WAAW,IAAI,CAAC;EAE1C,OAAO,IAAAC,iCAAmB,EAAC;IACzBC,UAAU,EAAEN,KAAK,CAACM,UAAU;IAC5BC,YAAY,EAAEP,KAAK,CAACO,YAAY;IAChCC,cAAc,EAAER,KAAK,CAACQ,cAAc;IACpCC,QAAQ,EAAET,KAAK,CAACS,QAAQ,GAAG,OAAOT,KAAK,CAACU,OAAO,GAAG,UAAU,GAAG,EAAE,EAAE,GAAGC,SAAS;IAC/EC,aAAa,EAAGZ,KAAK,CAACU,OAAO,IAAIT,gBAAgB,CAACD,KAAK,CAACa,SAAS,CAAC,IAAKb,KAAK,CAACa,SAAS;IACtFC,MAAM,EAAE,IAAAC,kCAAoB,EAACf,KAAK,CAACc,MAAM,IAAId,KAAK,CAACgB,GAAG,EAAEZ,WAAW,CAAC;IACpEa,SAAS,EAAE,IAAAF,kCAAoB,EAACf,KAAK,CAACiB,SAAS,IAAIjB,KAAK,CAACgB,GAAG,EAAEZ,WAAW;EAC3E,CAAC,CAAC;AACJ;AAEe,SAASc,OAAOA,CAC7BlB,KAAQ,EACRmB,GAA2B,EACQ;EACnC,MAAM,CAACC,GAAG,EAAE;IAAEC,SAAS;IAAEzB,KAAK,EAAE0B,SAAS;IAAE,GAAGC;EAAM,CAAC,CAAC,GAAG,IAAAC,eAAM,EAC7D;IACE,cAAc,EAAE,MAAM;IACtB,GAAGxB,KAAK;IACR,QAAQ,EAAE;EACZ,CAAC,EACDmB,GACF,CAAC;EACD,MAAM;IACJM,MAAM;IACNhB,QAAQ;IACRI,SAAS;IACTH,OAAO;IACPJ,UAAU;IACVC,YAAY;IACZC,cAAc;IACdQ,GAAG;IACHF,MAAM;IACNG,SAAS;IACTb;EACF,CAAC,GAAGJ,KAAK;EAET,MAAM0B,UAAsB,GAAGC,cAAK,CAACC,OAAO,CAAC,MAAM;IACjD,OAAO7B,mBAAmB,CAACC,KAAK,CAAC;EACnC,CAAC,EAAE,CACDS,QAAQ,EACRI,SAAS,EACTH,OAAO,EACPJ,UAAU,EACVC,YAAY,EACZC,cAAc,EACdQ,GAAG,EACHF,MAAM,EACNG,SAAS,EACTb,WAAW,CACZ,CAAC;EAEF,MAAMyB,MAAM,GAAG,IAAAhC,aAAO,EAACD,KAAK,CAAC;EAE7B,IAAIwB,GAAG,KAAKO,cAAK,CAACG,QAAQ,EAAE,OAAO,CAACH,cAAK,CAACG,QAAQ,EAAE;IAAEC,QAAQ,EAAE/B,KAAK,CAAC+B;EAAS,CAAC,CAAC;EAEjF,OAAO,CACLX,GAAG,EACH;IACEC,SAAS,EACP,IAAAW,mBAAE,EACAH,MAAM,CAACG,EAAE,CAAC,OAAO,EAAE;MACjBP,MAAM,EAAEA;IACV,CAAC,CAAC,CAACJ,SAAS,EACZA,SACF,CAAC,IAAIV,SAAS;IAChBf,KAAK,EAAEqC,MAAM,CAACC,MAAM,CAAC,CAAC,CAAC,EAAEZ,SAAS,EAAEI,UAAU,CAAC;IAC/C,GAAGH;EACL,CAAC,CACF;AACH","ignoreList":[]}

package/lib/cjs/components/hint/Hint.js

@@ -102,8 +102,12 @@ class HintPopperRoot extends _core.Component {
     };
   }
   componentDidMount() {
-    const trigger = this.asProps.triggerRef.current;
-    if (trigger) {
+    const {
+      triggerRef,
+      children
+    } = this.asProps;
+    const trigger = triggerRef.current;
+    if (trigger && children) {
       this.subscribe(trigger);
     }
   }

package/lib/cjs/components/hint/Hint.js.map

@@ -1 +1 @@
-{"version":3,"file":"Hint.js","names":["_core","require","_dom","_canUseDOM","_interopRequireDefault","_getAccessibleName","_useCssVariable","_zIndexStacking","_react","_Middleware","_flexBox","_portal","keyframes","sstyled","insert","styles","enhances","zIndexStackingEnhance","cssVariableEnhance","variable","fallback","map","v","Number","parseInt","toString","prop","propToArray","Array","isArray","keyframesMap","Map","HintPopperRoot","Component","constructor","props","_defineProperty2","default","React","createRef","handleFocus","bind","handleBlur","handleMouseEnter","handleMouseLeave","handleKeyDown","state","innerVisible","visible","calculatedPlacement","placement","uncontrolledProps","componentDidMount","trigger","asProps","triggerRef","current","subscribe","componentWillUnmount","unsubscribe","componentDidUpdate","prevProps","requestAnimationFrame","showHint","hideHint","addEventListener","removeEventListener","node","mouseEvent","timeout","showTimeout","hideTimer","clearTimeout","showTimer","window","setTimeout","handlers","popperElement","hintRef","middleware","offset","flip","shift","padding","verticalPlacement","startsWith","undefined","push","Middleware","verticalCursorAnchoring","x","clientX","computePosition","then","y","Object","assign","style","left","top","visibility","setState","hideTimeout","setProperty","e","target","HTMLElement","lastInteraction","isKeyboard","key","stopPropagation","keyframesKey","has","get","keyframe","set","setTriggerAriaLabel","children","textContent","ariaLabel","getAccessibleName","label","setAttribute","render","_ref","_ref2","SHintPopper","Box","Children","parentZIndexStacking","timingFunction","canUseDOM","duration","createElement","Portal","cn","assignProps","defaultVisible","Hint","exports","createComponent"],"sources":["../../../../src/components/hint/Hint.tsx"],"sourcesContent":["import { computePosition, flip, offset, shift, type Placement } from '@floating-ui/dom';\nimport { createComponent, Root, sstyled, Component, lastInteraction } from '@semcore/core';\nimport canUseDOM from '@semcore/core/lib/utils/canUseDOM';\nimport { getAccessibleName } from '@semcore/core/lib/utils/getAccessibleName';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport { zIndexStackingEnhance } from '@semcore/core/lib/utils/zIndexStacking';\nimport type { DataType } from 'csstype';\nimport React from 'react';\n\nimport { Middleware } from './Middleware';\nimport keyframes from '../animation/style/keyframes.shadow.css';\nimport { Box } from '../flex-box';\nimport { Portal } from '../portal';\nimport styles from './style/hint.shadow.css';\n\ntype Handlers = {\n  visible: null;\n};\n\nexport type SimpleHintPopperProps = {\n  /** Ref to the trigger element */\n  triggerRef: React.RefObject<HTMLElement | null>;\n  /**\n   * The position of the popper relative to the trigger that called it.\n   * @default top\n   */\n  placement?: Placement;\n  /**\n   * Timer to show and hide the popper\n   * @default [500, 500]\n   */\n  timeout?: DefaultProps['timeout'];\n  /**\n   * Hint content.\n   * Better to use here some short text.\n   * */\n  children: React.ReactNode;\n\n  /** Popper visibility value */\n  visible?: boolean;\n  /** Default popper visibility\n   * @default false */\n  defaultVisible?: boolean;\n  /** Function called when visibility changes */\n  onVisibleChange?: (visible: boolean, e?: Event) => boolean | void;\n};\n\ntype DefaultProps = {\n  defaultVisible?: boolean;\n  timeout: number | [number, number];\n  timingFunction: DataType.EasingFunction;\n  placement?: Placement;\n};\n\ntype State = {\n  innerVisible: boolean | null;\n  calculatedPlacement?: Placement;\n};\n\nconst enhances = [\n  zIndexStackingEnhance('z-index-tooltip'),\n  cssVariableEnhance({\n    variable: '--intergalactic-duration-popper',\n    fallback: '200',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'duration',\n  }),\n  cssVariableEnhance({\n    variable: '--intergalactic-spacing-1x',\n    fallback: '4',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'offset',\n  }),\n  cssVariableEnhance({\n    variable: '--intergalactic-spacing-1x',\n    fallback: '4',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'padding',\n  }),\n] as const;\n\nfunction propToArray(prop: number | [number, number]): [number, number] {\n  return Array.isArray(prop) ? prop : [prop, prop];\n}\n\nconst keyframesMap = new Map<Placement, string>();\n\nclass HintPopperRoot extends Component<SimpleHintPopperProps, typeof enhances, Handlers, DefaultProps, State> {\n  public readonly hintRef = React.createRef<HTMLElement>();\n\n  static style = Object.assign(keyframes, styles);\n\n  private showTimer?: number;\n  private hideTimer?: number;\n\n  static enhance = enhances;\n\n  static defaultProps: DefaultProps = {\n    defaultVisible: false,\n    timeout: [500, 500],\n    timingFunction: 'ease-out',\n    placement: 'top',\n  };\n\n  constructor(props: SimpleHintPopperProps) {\n    super(props);\n\n    this.handleFocus = this.handleFocus.bind(this);\n    this.handleBlur = this.handleBlur.bind(this);\n    this.handleMouseEnter = this.handleMouseEnter.bind(this);\n    this.handleMouseLeave = this.handleMouseLeave.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n\n    this.state = {\n      innerVisible: props.visible ?? null,\n      calculatedPlacement: props.placement,\n    };\n  }\n\n  uncontrolledProps() {\n    return {\n      visible: null,\n    };\n  }\n\n  componentDidMount() {\n    const trigger = this.asProps.triggerRef.current;\n\n    if (trigger) {\n      this.subscribe(trigger);\n    }\n  }\n\n  componentWillUnmount() {\n    const trigger = this.asProps.triggerRef.current;\n\n    if (trigger) {\n      this.unsubscribe(trigger);\n    }\n  }\n\n  componentDidUpdate(prevProps: SimpleHintPopperProps) {\n    if (prevProps.visible !== this.props.visible) {\n      requestAnimationFrame(() => {\n        const trigger = this.props.triggerRef.current;\n\n        if (this.props.visible && trigger) {\n          this.showHint(trigger);\n        } else {\n          this.hideHint();\n        }\n      });\n    }\n  }\n\n  private subscribe(trigger: HTMLElement) {\n    trigger.addEventListener('focus', this.handleFocus);\n    trigger.addEventListener('blur', this.handleBlur);\n    trigger.addEventListener('mouseenter', this.handleMouseEnter);\n    trigger.addEventListener('mouseleave', this.handleMouseLeave);\n    trigger.addEventListener('keydown', this.handleKeyDown);\n\n    if (this.asProps.visible) {\n      this.showHint(trigger);\n    }\n  }\n\n  private unsubscribe(trigger: HTMLElement) {\n    trigger.removeEventListener('focus', this.handleFocus);\n    trigger.removeEventListener('blur', this.handleBlur);\n    trigger.removeEventListener('mouseenter', this.handleMouseEnter);\n    trigger.removeEventListener('mouseleave', this.handleMouseLeave);\n    trigger.removeEventListener('keydown', this.handleKeyDown);\n\n    this.hideHint();\n  }\n\n  private showHint(node: HTMLElement, mouseEvent?: MouseEvent): void {\n    const { placement, timeout } = this.asProps;\n\n    const showTimeout = Array.isArray(timeout) ? timeout[0] : timeout;\n\n    if (this.hideTimer) {\n      clearTimeout(this.hideTimer);\n    }\n\n    this.showTimer = window.setTimeout(() => {\n      this.handlers.visible(true);\n\n      window.setTimeout(() => {\n        const popperElement = this.hintRef.current;\n        if (popperElement) {\n          const middleware = [\n            offset(Number(this.asProps.offset)),\n            flip(),\n            shift({ padding: Number(this.asProps.padding) }),\n          ];\n          const verticalPlacement = !placement || placement.startsWith('top') || placement.startsWith('bottom');\n          if (mouseEvent !== undefined && verticalPlacement) {\n            middleware.push(\n              Middleware.verticalCursorAnchoring({ x: mouseEvent.clientX }),\n              shift({ padding: Number(this.asProps.padding) }),\n            );\n          }\n\n          computePosition(node, popperElement, {\n            placement: placement,\n            middleware,\n          }).then(({ x, y, placement }) => {\n            Object.assign(popperElement.style, {\n              left: `${x}px`,\n              top: `${y}px`,\n            });\n            popperElement.style.visibility = 'visible';\n\n            this.setState({ innerVisible: true, calculatedPlacement: placement });\n          });\n        }\n      }, 10);\n    }, showTimeout);\n  }\n\n  private hideHint(): void {\n    const { timeout } = this.asProps;\n\n    const hideTimeout = Array.isArray(timeout) ? timeout[1] : timeout;\n\n    if (this.showTimer) {\n      clearTimeout(this.showTimer);\n    }\n\n    this.setState({ innerVisible: false });\n\n    this.hideTimer = window.setTimeout(() => {\n      this.hintRef.current?.style.setProperty('visibility', 'hidden');\n      this.handlers.visible(false);\n      this.setState({ innerVisible: null });\n    }, hideTimeout);\n  }\n\n  private handleFocus(e: FocusEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target && lastInteraction.isKeyboard()) {\n      this.showHint(e.target);\n    }\n  }\n\n  private handleBlur(e: FocusEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.hideHint();\n    }\n  }\n\n  private handleKeyDown(e: KeyboardEvent): void {\n    if (e.key === 'Escape' && e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target && this.state.innerVisible) {\n      e.stopPropagation();\n      this.hideHint();\n    }\n  }\n\n  private handleMouseEnter(e: MouseEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.showHint(e.target, e);\n    }\n  }\n\n  private handleMouseLeave(e: MouseEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.hideHint();\n    }\n  }\n\n  private keyframesKey(placement?: Placement) {\n    if (!placement) {\n      return 'opacity';\n    }\n\n    if (keyframesMap.has(placement)) {\n      return keyframesMap.get(placement)!;\n    }\n\n    let keyframe: string = 'opacity';\n\n    if (placement.startsWith('left')) keyframe = 'scale-left';\n    if (placement.startsWith('right')) keyframe = 'scale-right';\n    if (placement.startsWith('bottom')) keyframe = 'scale-bottom';\n    if (placement.startsWith('top')) keyframe = 'scale-top';\n\n    keyframesMap.set(placement, keyframe);\n\n    return keyframe;\n  }\n\n  private setTriggerAriaLabel() {\n    const { triggerRef, children } = this.asProps;\n\n    requestAnimationFrame(() => {\n      const trigger = triggerRef.current;\n\n      if (trigger) {\n        const textContent = trigger.textContent;\n        const ariaLabel = getAccessibleName(trigger);\n\n        if (!textContent && !ariaLabel) {\n          const label = (typeof children === 'string' || typeof children === 'number')\n            ? children.toString()\n            : (this.hintRef.current?.textContent ?? '');\n          triggerRef.current?.setAttribute('aria-label', label);\n        }\n      }\n    });\n  }\n\n  render() {\n    const SHintPopper = Root;\n    const { visible, Children, parentZIndexStacking, styles, timingFunction } = this.asProps;\n    const { innerVisible, calculatedPlacement } = this.state;\n\n    if (canUseDOM()) {\n      this.setTriggerAriaLabel();\n    }\n\n    if (!visible) {\n      return null;\n    }\n\n    const duration = propToArray(Number(this.asProps.duration));\n\n    /* `visible && innerVisible === null` - is a condition to start showing right after hover/focus  */\n    const showHint = (visible && innerVisible === null) || innerVisible === true;\n\n    return sstyled(styles)(\n      <Portal>\n        <SHintPopper\n          render={Box}\n          ref={this.hintRef}\n          aria-hidden={true}\n          role={undefined}\n          zIndex={parentZIndexStacking}\n          use:visible={showHint}\n          durationInitialize={`${duration[0]}ms`}\n          durationFinalize={`${duration[1]}ms`}\n          timingFunction={timingFunction}\n          keyframesInitialize={keyframes[`@${this.keyframesKey(calculatedPlacement)}-in`]}\n          keyframesFinalize={keyframes[`@${this.keyframesKey(calculatedPlacement)}-out`]}\n          use:data-ui-name='Hint'\n        >\n          <Children />\n        </SHintPopper>\n      </Portal>,\n    );\n  }\n}\n\nexport const Hint = createComponent<'div', SimpleHintPopperProps>(HintPopperRoot);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Hint.js","names":["_core","require","_dom","_canUseDOM","_interopRequireDefault","_getAccessibleName","_useCssVariable","_zIndexStacking","_react","_Middleware","_flexBox","_portal","keyframes","sstyled","insert","styles","enhances","zIndexStackingEnhance","cssVariableEnhance","variable","fallback","map","v","Number","parseInt","toString","prop","propToArray","Array","isArray","keyframesMap","Map","HintPopperRoot","Component","constructor","props","_defineProperty2","default","React","createRef","handleFocus","bind","handleBlur","handleMouseEnter","handleMouseLeave","handleKeyDown","state","innerVisible","visible","calculatedPlacement","placement","uncontrolledProps","componentDidMount","triggerRef","children","asProps","trigger","current","subscribe","componentWillUnmount","unsubscribe","componentDidUpdate","prevProps","requestAnimationFrame","showHint","hideHint","addEventListener","removeEventListener","node","mouseEvent","timeout","showTimeout","hideTimer","clearTimeout","showTimer","window","setTimeout","handlers","popperElement","hintRef","middleware","offset","flip","shift","padding","verticalPlacement","startsWith","undefined","push","Middleware","verticalCursorAnchoring","x","clientX","computePosition","then","y","Object","assign","style","left","top","visibility","setState","hideTimeout","setProperty","e","target","HTMLElement","lastInteraction","isKeyboard","key","stopPropagation","keyframesKey","has","get","keyframe","set","setTriggerAriaLabel","textContent","ariaLabel","getAccessibleName","label","setAttribute","render","_ref","_ref2","SHintPopper","Box","Children","parentZIndexStacking","timingFunction","canUseDOM","duration","createElement","Portal","cn","assignProps","defaultVisible","Hint","exports","createComponent"],"sources":["../../../../src/components/hint/Hint.tsx"],"sourcesContent":["import { computePosition, flip, offset, shift, type Placement } from '@floating-ui/dom';\nimport { createComponent, Root, sstyled, Component, lastInteraction } from '@semcore/core';\nimport canUseDOM from '@semcore/core/lib/utils/canUseDOM';\nimport { getAccessibleName } from '@semcore/core/lib/utils/getAccessibleName';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport { zIndexStackingEnhance } from '@semcore/core/lib/utils/zIndexStacking';\nimport type { DataType } from 'csstype';\nimport React from 'react';\n\nimport { Middleware } from './Middleware';\nimport keyframes from '../animation/style/keyframes.shadow.css';\nimport { Box } from '../flex-box';\nimport { Portal } from '../portal';\nimport styles from './style/hint.shadow.css';\n\ntype Handlers = {\n  visible: null;\n};\n\nexport type SimpleHintPopperProps = {\n  /** Ref to the trigger element */\n  triggerRef: React.RefObject<HTMLElement | null>;\n  /**\n   * The position of the popper relative to the trigger that called it.\n   * @default top\n   */\n  placement?: Placement;\n  /**\n   * Timer to show and hide the popper\n   * @default [500, 500]\n   */\n  timeout?: DefaultProps['timeout'];\n  /**\n   * Hint content.\n   * Better to use here some short text.\n   * */\n  children: React.ReactNode;\n\n  /** Popper visibility value */\n  visible?: boolean;\n  /** Default popper visibility\n   * @default false */\n  defaultVisible?: boolean;\n  /** Function called when visibility changes */\n  onVisibleChange?: (visible: boolean, e?: Event) => boolean | void;\n};\n\ntype DefaultProps = {\n  defaultVisible?: boolean;\n  timeout: number | [number, number];\n  timingFunction: DataType.EasingFunction;\n  placement?: Placement;\n};\n\ntype State = {\n  innerVisible: boolean | null;\n  calculatedPlacement?: Placement;\n};\n\nconst enhances = [\n  zIndexStackingEnhance('z-index-tooltip'),\n  cssVariableEnhance({\n    variable: '--intergalactic-duration-popper',\n    fallback: '200',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'duration',\n  }),\n  cssVariableEnhance({\n    variable: '--intergalactic-spacing-1x',\n    fallback: '4',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'offset',\n  }),\n  cssVariableEnhance({\n    variable: '--intergalactic-spacing-1x',\n    fallback: '4',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'padding',\n  }),\n] as const;\n\nfunction propToArray(prop: number | [number, number]): [number, number] {\n  return Array.isArray(prop) ? prop : [prop, prop];\n}\n\nconst keyframesMap = new Map<Placement, string>();\n\nclass HintPopperRoot extends Component<SimpleHintPopperProps, typeof enhances, Handlers, DefaultProps, State> {\n  public readonly hintRef = React.createRef<HTMLElement>();\n\n  static style = Object.assign(keyframes, styles);\n\n  private showTimer?: number;\n  private hideTimer?: number;\n\n  static enhance = enhances;\n\n  static defaultProps: DefaultProps = {\n    defaultVisible: false,\n    timeout: [500, 500],\n    timingFunction: 'ease-out',\n    placement: 'top',\n  };\n\n  constructor(props: SimpleHintPopperProps) {\n    super(props);\n\n    this.handleFocus = this.handleFocus.bind(this);\n    this.handleBlur = this.handleBlur.bind(this);\n    this.handleMouseEnter = this.handleMouseEnter.bind(this);\n    this.handleMouseLeave = this.handleMouseLeave.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n\n    this.state = {\n      innerVisible: props.visible ?? null,\n      calculatedPlacement: props.placement,\n    };\n  }\n\n  uncontrolledProps() {\n    return {\n      visible: null,\n    };\n  }\n\n  componentDidMount() {\n    const { triggerRef, children } = this.asProps;\n    const trigger = triggerRef.current;\n\n    if (trigger && children) {\n      this.subscribe(trigger);\n    }\n  }\n\n  componentWillUnmount() {\n    const trigger = this.asProps.triggerRef.current;\n\n    if (trigger) {\n      this.unsubscribe(trigger);\n    }\n  }\n\n  componentDidUpdate(prevProps: SimpleHintPopperProps) {\n    if (prevProps.visible !== this.props.visible) {\n      requestAnimationFrame(() => {\n        const trigger = this.props.triggerRef.current;\n\n        if (this.props.visible && trigger) {\n          this.showHint(trigger);\n        } else {\n          this.hideHint();\n        }\n      });\n    }\n  }\n\n  private subscribe(trigger: HTMLElement) {\n    trigger.addEventListener('focus', this.handleFocus);\n    trigger.addEventListener('blur', this.handleBlur);\n    trigger.addEventListener('mouseenter', this.handleMouseEnter);\n    trigger.addEventListener('mouseleave', this.handleMouseLeave);\n    trigger.addEventListener('keydown', this.handleKeyDown);\n\n    if (this.asProps.visible) {\n      this.showHint(trigger);\n    }\n  }\n\n  private unsubscribe(trigger: HTMLElement) {\n    trigger.removeEventListener('focus', this.handleFocus);\n    trigger.removeEventListener('blur', this.handleBlur);\n    trigger.removeEventListener('mouseenter', this.handleMouseEnter);\n    trigger.removeEventListener('mouseleave', this.handleMouseLeave);\n    trigger.removeEventListener('keydown', this.handleKeyDown);\n\n    this.hideHint();\n  }\n\n  private showHint(node: HTMLElement, mouseEvent?: MouseEvent): void {\n    const { placement, timeout } = this.asProps;\n\n    const showTimeout = Array.isArray(timeout) ? timeout[0] : timeout;\n\n    if (this.hideTimer) {\n      clearTimeout(this.hideTimer);\n    }\n\n    this.showTimer = window.setTimeout(() => {\n      this.handlers.visible(true);\n\n      window.setTimeout(() => {\n        const popperElement = this.hintRef.current;\n        if (popperElement) {\n          const middleware = [\n            offset(Number(this.asProps.offset)),\n            flip(),\n            shift({ padding: Number(this.asProps.padding) }),\n          ];\n          const verticalPlacement = !placement || placement.startsWith('top') || placement.startsWith('bottom');\n          if (mouseEvent !== undefined && verticalPlacement) {\n            middleware.push(\n              Middleware.verticalCursorAnchoring({ x: mouseEvent.clientX }),\n              shift({ padding: Number(this.asProps.padding) }),\n            );\n          }\n\n          computePosition(node, popperElement, {\n            placement: placement,\n            middleware,\n          }).then(({ x, y, placement }) => {\n            Object.assign(popperElement.style, {\n              left: `${x}px`,\n              top: `${y}px`,\n            });\n            popperElement.style.visibility = 'visible';\n\n            this.setState({ innerVisible: true, calculatedPlacement: placement });\n          });\n        }\n      }, 10);\n    }, showTimeout);\n  }\n\n  private hideHint(): void {\n    const { timeout } = this.asProps;\n\n    const hideTimeout = Array.isArray(timeout) ? timeout[1] : timeout;\n\n    if (this.showTimer) {\n      clearTimeout(this.showTimer);\n    }\n\n    this.setState({ innerVisible: false });\n\n    this.hideTimer = window.setTimeout(() => {\n      this.hintRef.current?.style.setProperty('visibility', 'hidden');\n      this.handlers.visible(false);\n      this.setState({ innerVisible: null });\n    }, hideTimeout);\n  }\n\n  private handleFocus(e: FocusEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target && lastInteraction.isKeyboard()) {\n      this.showHint(e.target);\n    }\n  }\n\n  private handleBlur(e: FocusEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.hideHint();\n    }\n  }\n\n  private handleKeyDown(e: KeyboardEvent): void {\n    if (e.key === 'Escape' && e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target && this.state.innerVisible) {\n      e.stopPropagation();\n      this.hideHint();\n    }\n  }\n\n  private handleMouseEnter(e: MouseEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.showHint(e.target, e);\n    }\n  }\n\n  private handleMouseLeave(e: MouseEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.hideHint();\n    }\n  }\n\n  private keyframesKey(placement?: Placement) {\n    if (!placement) {\n      return 'opacity';\n    }\n\n    if (keyframesMap.has(placement)) {\n      return keyframesMap.get(placement)!;\n    }\n\n    let keyframe: string = 'opacity';\n\n    if (placement.startsWith('left')) keyframe = 'scale-left';\n    if (placement.startsWith('right')) keyframe = 'scale-right';\n    if (placement.startsWith('bottom')) keyframe = 'scale-bottom';\n    if (placement.startsWith('top')) keyframe = 'scale-top';\n\n    keyframesMap.set(placement, keyframe);\n\n    return keyframe;\n  }\n\n  private setTriggerAriaLabel() {\n    const { triggerRef, children } = this.asProps;\n\n    requestAnimationFrame(() => {\n      const trigger = triggerRef.current;\n\n      if (trigger) {\n        const textContent = trigger.textContent;\n        const ariaLabel = getAccessibleName(trigger);\n\n        if (!textContent && !ariaLabel) {\n          const label = (typeof children === 'string' || typeof children === 'number')\n            ? children.toString()\n            : (this.hintRef.current?.textContent ?? '');\n          triggerRef.current?.setAttribute('aria-label', label);\n        }\n      }\n    });\n  }\n\n  render() {\n    const SHintPopper = Root;\n    const { visible, Children, parentZIndexStacking, styles, timingFunction } = this.asProps;\n    const { innerVisible, calculatedPlacement } = this.state;\n\n    if (canUseDOM()) {\n      this.setTriggerAriaLabel();\n    }\n\n    if (!visible) {\n      return null;\n    }\n\n    const duration = propToArray(Number(this.asProps.duration));\n\n    /* `visible && innerVisible === null` - is a condition to start showing right after hover/focus  */\n    const showHint = (visible && innerVisible === null) || innerVisible === true;\n\n    return sstyled(styles)(\n      <Portal>\n        <SHintPopper\n          render={Box}\n          ref={this.hintRef}\n          aria-hidden={true}\n          role={undefined}\n          zIndex={parentZIndexStacking}\n          use:visible={showHint}\n          durationInitialize={`${duration[0]}ms`}\n          durationFinalize={`${duration[1]}ms`}\n          timingFunction={timingFunction}\n          keyframesInitialize={keyframes[`@${this.keyframesKey(calculatedPlacement)}-in`]}\n          keyframesFinalize={keyframes[`@${this.keyframesKey(calculatedPlacement)}-out`]}\n          use:data-ui-name='Hint'\n        >\n          <Children />\n        </SHintPopper>\n      </Portal>,\n    );\n  }\n}\n\nexport const Hint = createComponent<'div', SimpleHintPopperProps>(HintPopperRoot);\n"],"mappings":"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","ignoreList":[]}

package/lib/es6/components/flex-box/Box/useBox.js

@@ -1,5 +1,6 @@
 import { sstyled as _sstyled } from "@semcore/core";
 import { sstyled } from '@semcore/core';
+import { getAutoOrScaleIndent, removeUndefinedKeys, getSize } from '@semcore/core/lib/utils/indentStyles';
 import propsForElement from '@semcore/core/lib/utils/propsForElement';
 import cn from 'classnames';
 import React from 'react';
@@ -15,29 +16,7 @@ const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/
   "__SBox": "___SBox_1suvb_gg_",
   "_invertOutline": "__invertOutline_1suvb_gg_"
 });
-import { getAutoOrScaleIndent } from '../utils';
-export function removeUndefinedKeys(obj) {
-  return Object.entries(obj).reduce((acc, [key, value]) => {
-    if (value !== undefined) {
-      acc[key] = value;
-    }
-    return acc;
-  }, {});
-}
-function getSize(size) {
-  if (typeof size !== 'number') {
-    return size;
-  }
-  if (size < 1) {
-    return `${100 * size}%`;
-  }
-  if (size >= 1) {
-    return `${size}px`;
-  }
-}
-
 /** @deprecated */
-
 function calculateIndentStyles(props, scaleIndent) {
   return removeUndefinedKeys({
     display: props['display'],

package/lib/es6/components/flex-box/Box/useBox.js.map

@@ -1 +1 @@
-{"version":3,"file":"useBox.js","names":["sstyled","propsForElement","cn","React","style","_sstyled","insert","getAutoOrScaleIndent","removeUndefinedKeys","obj","Object","entries","reduce","acc","key","value","undefined","getSize","size","calculateIndentStyles","props","scaleIndent","display","width","height","minWidth","maxWidth","minHeight","maxHeight","position","top","left","bottom","right","inset","flex","zIndex","textAlign","margin","marginTop","marginBottom","marginLeft","marginRight","padding","paddingTop","paddingBottom","paddingLeft","paddingRight","useBox","ref","tag","Tag","className","styleProp","boxSizing","inline","innerOutline","invertOutline","inAfterOutline","w","h","wMin","wMax","hMin","hMax","m","mt","mb","my","ml","mr","mx","p","pt","pb","py","pl","pr","px","css","other","indentStyles","useMemo","styles","Fragment","children","SBoxSizing","SBoxInline","SBoxInnerOutline","assign"],"sources":["../../../../../src/components/flex-box/Box/useBox.tsx"],"sourcesContent":["import { sstyled, type UnknownProperties, type IStyledProps } from '@semcore/core';\nimport propsForElement from '@semcore/core/lib/utils/propsForElement';\nimport cn from 'classnames';\nimport type { Properties, Property } from 'csstype';\nimport React from 'react';\n\nimport style from '../style/use-box.shadow.css';\nimport { getAutoOrScaleIndent } from '../utils';\n\nexport function removeUndefinedKeys<T extends {}>(obj: T) {\n  return Object.entries(obj).reduce((acc: any, [key, value]) => {\n    if (value !== undefined) {\n      acc[key] = value;\n    }\n    return acc;\n  }, {});\n}\n\nfunction getSize(size: any) {\n  if (typeof size !== 'number') {\n    return size;\n  }\n  if (size < 1) {\n    return `${100 * size}%`;\n  }\n  if (size >= 1) {\n    return `${size}px`;\n  }\n}\n\nexport type BoxProps = IStyledProps & {\n  /**\n   * CSS `display` property\n   */\n  display?: Property.Display;\n\n  /** Sets the `inline-block` property */\n  inline?: boolean;\n\n  /** CSS `box-sizing: border-box` property */\n  boxSizing?: boolean | 'border-box';\n\n  /** CSS `flex` property */\n  flex?: Property.Flex<string>;\n\n  /** CSS `margin` property */\n  m?: number | string;\n\n  /** CSS `margin-top` property */\n  mt?: number | string;\n\n  /** CSS `margin-right` property */\n  mr?: number | string;\n\n  /** CSS `margin-bottom` property */\n  mb?: number | string;\n\n  /** CSS `margin-left` property */\n  ml?: number | string;\n\n  /** CSS `margin-left` and `margin-right` property */\n  mx?: number | string;\n\n  /** CSS `margin-top` and `margin-bottom` property */\n  my?: number | string;\n\n  /** CSS `padding` property */\n  p?: number | string;\n\n  /** CSS `padding-top` property */\n  pt?: number | string;\n\n  /** CSS `padding-right` property */\n  pr?: number | string;\n\n  /** CSS `padding-bottom` property */\n  pb?: number | string;\n\n  /** CSS `padding-left` property */\n  pl?: number | string;\n\n  /** CSS `padding-left` and `padding-right` property */\n  px?: number | string;\n\n  /** CSS `padding-top` and `padding-bottom` property */\n  py?: number | string;\n\n  /**\n   * CSS `width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  w?: number | string;\n\n  /**\n   * CSS `min-width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  wMin?: number | string;\n\n  /**\n   * CSS `max-width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  wMax?: number | string;\n\n  /**\n   * CSS `height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  h?: number | string;\n\n  /**\n   * CSS `min-height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  hMin?: number | string;\n\n  /**\n   * CSS `max-height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  hMax?: number | string;\n\n  /**\n   * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12).\n   * @default 4\n   */\n  scaleIndent?: number;\n\n  /**\n   * Flag for render outline inside box\n   * @default false\n   */\n  innerOutline?: boolean;\n\n  /**\n   * Flag for render inverted outline\n   * @default false\n   */\n  invertOutline?: boolean;\n\n  /**\n   * Flag for render outline in the ::after element\n   * @default false\n   */\n  inAfterOutline?: boolean;\n  /** CSS `position` property */\n  position?: Property.Position;\n  /** CSS `top` property */\n  top?: number | string;\n  /** CSS `left` property */\n  left?: number | string;\n  /** CSS `bottom` property */\n  bottom?: number | string;\n  /** CSS `right` property */\n  right?: number | string;\n  /** CSS `inset` property */\n  inset?: string;\n  /** CSS `z-index` property */\n  zIndex?: number;\n  /** CSS `text-align` property */\n  textAlign?: Property.TextAlign;\n  /** Box content */\n  children?: React.ReactNode;\n};\n\n/** @deprecated */\nexport interface IBoxProps extends BoxProps, UnknownProperties {\n  /**\n   *  HTML tag name for the displayed item\n   * @default div\n   */\n  tag?: React.ElementType | string;\n}\n\nfunction calculateIndentStyles(props: BoxProps, scaleIndent: number) {\n  return removeUndefinedKeys({\n    display: props['display'],\n    width: getSize(props['w']),\n    height: getSize(props['h']),\n    minWidth: getSize(props['wMin']),\n    maxWidth: getSize(props['wMax']),\n    minHeight: getSize(props['hMin']),\n    maxHeight: getSize(props['hMax']),\n    position: props['position'],\n    top: getSize(props['top']),\n    left: getSize(props['left']),\n    bottom: getSize(props['bottom']),\n    right: getSize(props['right']),\n    inset: props.inset,\n    flex: props.flex,\n    zIndex: props.zIndex,\n    textAlign: props.textAlign,\n\n    margin: getAutoOrScaleIndent(props['m'], scaleIndent),\n    marginTop:\n      getAutoOrScaleIndent(props['mt'], scaleIndent) ||\n      getAutoOrScaleIndent(props['my'], scaleIndent),\n    marginBottom:\n      getAutoOrScaleIndent(props['mb'], scaleIndent) ||\n      getAutoOrScaleIndent(props['my'], scaleIndent),\n    marginLeft:\n      getAutoOrScaleIndent(props['ml'], scaleIndent) ||\n      getAutoOrScaleIndent(props['mx'], scaleIndent),\n    marginRight:\n      getAutoOrScaleIndent(props['mr'], scaleIndent) ||\n      getAutoOrScaleIndent(props['mx'], scaleIndent),\n\n    padding: getAutoOrScaleIndent(props['p'], scaleIndent),\n    paddingTop:\n      getAutoOrScaleIndent(props['pt'], scaleIndent) ||\n      getAutoOrScaleIndent(props['py'], scaleIndent),\n    paddingBottom:\n      getAutoOrScaleIndent(props['pb'], scaleIndent) ||\n      getAutoOrScaleIndent(props['py'], scaleIndent),\n    paddingLeft:\n      getAutoOrScaleIndent(props['pl'], scaleIndent) ||\n      getAutoOrScaleIndent(props['px'], scaleIndent),\n    paddingRight:\n      getAutoOrScaleIndent(props['pr'], scaleIndent) ||\n      getAutoOrScaleIndent(props['px'], scaleIndent),\n  });\n}\n\nexport default function useBox<T extends BoxProps>(\n  props: T,\n  ref: React.Ref<HTMLElement>,\n): [React.ElementType | string, any] {\n  const {\n    tag: Tag = 'div',\n    className,\n    style: styleProp,\n    scaleIndent = 4,\n    display,\n    boxSizing,\n    inline,\n    innerOutline,\n    invertOutline,\n    inAfterOutline,\n    flex,\n    w,\n    h,\n    wMin,\n    wMax,\n    hMin,\n    hMax,\n    m,\n    mt,\n    mb,\n    my,\n    ml,\n    mr,\n    mx,\n    p,\n    pt,\n    pb,\n    py,\n    pl,\n    pr,\n    px,\n    css,\n    position,\n    top,\n    left,\n    bottom,\n    right,\n    inset,\n    zIndex,\n    ...other\n  } = props as any;\n\n  const indentStyles: Properties = React.useMemo(() => {\n    return calculateIndentStyles(props, scaleIndent);\n  }, [\n    scaleIndent,\n    display,\n    w,\n    h,\n    wMin,\n    wMax,\n    hMin,\n    hMax,\n    flex,\n    m,\n    mt,\n    mb,\n    my,\n    ml,\n    mr,\n    mx,\n    p,\n    pt,\n    pb,\n    py,\n    pl,\n    pr,\n    px,\n    position,\n    top,\n    left,\n    bottom,\n    right,\n    inset,\n    zIndex,\n  ]);\n\n  const styles = sstyled(style);\n\n  if (Tag === React.Fragment) return [React.Fragment, { children: props.children }];\n\n  return [\n    Tag,\n    {\n      ref,\n      'className':\n        cn(\n          styles.cn('SBox', {\n            SBoxSizing: boxSizing,\n            SBoxInline: inline,\n            SBoxInnerOutline: innerOutline,\n            inAfterOutline: inAfterOutline === true ? 'true' : 'false',\n            invertOutline,\n          }).className,\n          className,\n        ) || undefined,\n      'style': Object.assign({}, styleProp, css, indentStyles),\n      'data-ui-name': 'Box',\n      ...propsForElement(other, Tag),\n    },\n  ];\n}\n"],"mappings":";AAAA,SAASA,OAAO,QAAmD,eAAe;AAClF,OAAOC,eAAe,MAAM,yCAAyC;AACrE,OAAOC,EAAE,MAAM,YAAY;AAE3B,OAAOC,KAAK,MAAM,OAAO;AAAC;AAAA,MAAAC,KAAA,8BAAAC,QAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;EAAA;AAAA;AAG1B,SAASC,oBAAoB,QAAQ,UAAU;AAE/C,OAAO,SAASC,mBAAmBA,CAAeC,GAAM,EAAE;EACxD,OAAOC,MAAM,CAACC,OAAO,CAACF,GAAG,CAAC,CAACG,MAAM,CAAC,CAACC,GAAQ,EAAE,CAACC,GAAG,EAAEC,KAAK,CAAC,KAAK;IAC5D,IAAIA,KAAK,KAAKC,SAAS,EAAE;MACvBH,GAAG,CAACC,GAAG,CAAC,GAAGC,KAAK;IAClB;IACA,OAAOF,GAAG;EACZ,CAAC,EAAE,CAAC,CAAC,CAAC;AACR;AAEA,SAASI,OAAOA,CAACC,IAAS,EAAE;EAC1B,IAAI,OAAOA,IAAI,KAAK,QAAQ,EAAE;IAC5B,OAAOA,IAAI;EACb;EACA,IAAIA,IAAI,GAAG,CAAC,EAAE;IACZ,OAAO,GAAG,GAAG,GAAGA,IAAI,GAAG;EACzB;EACA,IAAIA,IAAI,IAAI,CAAC,EAAE;IACb,OAAO,GAAGA,IAAI,IAAI;EACpB;AACF;;AAgJA;;AASA,SAASC,qBAAqBA,CAACC,KAAe,EAAEC,WAAmB,EAAE;EACnE,OAAOb,mBAAmB,CAAC;IACzBc,OAAO,EAAEF,KAAK,CAAC,SAAS,CAAC;IACzBG,KAAK,EAAEN,OAAO,CAACG,KAAK,CAAC,GAAG,CAAC,CAAC;IAC1BI,MAAM,EAAEP,OAAO,CAACG,KAAK,CAAC,GAAG,CAAC,CAAC;IAC3BK,QAAQ,EAAER,OAAO,CAACG,KAAK,CAAC,MAAM,CAAC,CAAC;IAChCM,QAAQ,EAAET,OAAO,CAACG,KAAK,CAAC,MAAM,CAAC,CAAC;IAChCO,SAAS,EAAEV,OAAO,CAACG,KAAK,CAAC,MAAM,CAAC,CAAC;IACjCQ,SAAS,EAAEX,OAAO,CAACG,KAAK,CAAC,MAAM,CAAC,CAAC;IACjCS,QAAQ,EAAET,KAAK,CAAC,UAAU,CAAC;IAC3BU,GAAG,EAAEb,OAAO,CAACG,KAAK,CAAC,KAAK,CAAC,CAAC;IAC1BW,IAAI,EAAEd,OAAO,CAACG,KAAK,CAAC,MAAM,CAAC,CAAC;IAC5BY,MAAM,EAAEf,OAAO,CAACG,KAAK,CAAC,QAAQ,CAAC,CAAC;IAChCa,KAAK,EAAEhB,OAAO,CAACG,KAAK,CAAC,OAAO,CAAC,CAAC;IAC9Bc,KAAK,EAAEd,KAAK,CAACc,KAAK;IAClBC,IAAI,EAAEf,KAAK,CAACe,IAAI;IAChBC,MAAM,EAAEhB,KAAK,CAACgB,MAAM;IACpBC,SAAS,EAAEjB,KAAK,CAACiB,SAAS;IAE1BC,MAAM,EAAE/B,oBAAoB,CAACa,KAAK,CAAC,GAAG,CAAC,EAAEC,WAAW,CAAC;IACrDkB,SAAS,EACPhC,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC,IAC9Cd,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC;IAChDmB,YAAY,EACVjC,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC,IAC9Cd,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC;IAChDoB,UAAU,EACRlC,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC,IAC9Cd,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC;IAChDqB,WAAW,EACTnC,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC,IAC9Cd,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC;IAEhDsB,OAAO,EAAEpC,oBAAoB,CAACa,KAAK,CAAC,GAAG,CAAC,EAAEC,WAAW,CAAC;IACtDuB,UAAU,EACRrC,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC,IAC9Cd,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC;IAChDwB,aAAa,EACXtC,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC,IAC9Cd,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC;IAChDyB,WAAW,EACTvC,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC,IAC9Cd,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC;IAChD0B,YAAY,EACVxC,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW,CAAC,IAC9Cd,oBAAoB,CAACa,KAAK,CAAC,IAAI,CAAC,EAAEC,WAAW;EACjD,CAAC,CAAC;AACJ;AAEA,eAAe,SAAS2B,MAAMA,CAC5B5B,KAAQ,EACR6B,GAA2B,EACQ;EACnC,MAAM;IACJC,GAAG,EAAEC,GAAG,GAAG,KAAK;IAChBC,SAAS;IACThD,KAAK,EAAEiD,SAAS;IAChBhC,WAAW,GAAG,CAAC;IACfC,OAAO;IACPgC,SAAS;IACTC,MAAM;IACNC,YAAY;IACZC,aAAa;IACbC,cAAc;IACdvB,IAAI;IACJwB,CAAC;IACDC,CAAC;IACDC,IAAI;IACJC,IAAI;IACJC,IAAI;IACJC,IAAI;IACJC,CAAC;IACDC,EAAE;IACFC,EAAE;IACFC,EAAE;IACFC,EAAE;IACFC,EAAE;IACFC,EAAE;IACFC,CAAC;IACDC,EAAE;IACFC,EAAE;IACFC,EAAE;IACFC,EAAE;IACFC,EAAE;IACFC,EAAE;IACFC,GAAG;IACHlD,QAAQ;IACRC,GAAG;IACHC,IAAI;IACJC,MAAM;IACNC,KAAK;IACLC,KAAK;IACLE,MAAM;IACN,GAAG4C;EACL,CAAC,GAAG5D,KAAY;EAEhB,MAAM6D,YAAwB,GAAG9E,KAAK,CAAC+E,OAAO,CAAC,MAAM;IACnD,OAAO/D,qBAAqB,CAACC,KAAK,EAAEC,WAAW,CAAC;EAClD,CAAC,EAAE,CACDA,WAAW,EACXC,OAAO,EACPqC,CAAC,EACDC,CAAC,EACDC,IAAI,EACJC,IAAI,EACJC,IAAI,EACJC,IAAI,EACJ7B,IAAI,EACJ8B,CAAC,EACDC,EAAE,EACFC,EAAE,EACFC,EAAE,EACFC,EAAE,EACFC,EAAE,EACFC,EAAE,EACFC,CAAC,EACDC,EAAE,EACFC,EAAE,EACFC,EAAE,EACFC,EAAE,EACFC,EAAE,EACFC,EAAE,EACFjD,QAAQ,EACRC,GAAG,EACHC,IAAI,EACJC,MAAM,EACNC,KAAK,EACLC,KAAK,EACLE,MAAM,CACP,CAAC;EAEF,MAAM+C,MAAM,GAAGnF,OAAO,CAACI,KAAK,CAAC;EAE7B,IAAI+C,GAAG,KAAKhD,KAAK,CAACiF,QAAQ,EAAE,OAAO,CAACjF,KAAK,CAACiF,QAAQ,EAAE;IAAEC,QAAQ,EAAEjE,KAAK,CAACiE;EAAS,CAAC,CAAC;EAEjF,OAAO,CACLlC,GAAG,EACH;IACEF,GAAG;IACH,WAAW,EACT/C,EAAE,CACAiF,MAAM,CAACjF,EAAE,CAAC,MAAM,EAAE;MAChBoF,UAAU,EAAEhC,SAAS;MACrBiC,UAAU,EAAEhC,MAAM;MAClBiC,gBAAgB,EAAEhC,YAAY;MAC9BE,cAAc,EAAEA,cAAc,KAAK,IAAI,GAAG,MAAM,GAAG,OAAO;MAC1DD;IACF,CAAC,CAAC,CAACL,SAAS,EACZA,SACF,CAAC,IAAIpC,SAAS;IAChB,OAAO,EAAEN,MAAM,CAAC+E,MAAM,CAAC,CAAC,CAAC,EAAEpC,SAAS,EAAE0B,GAAG,EAAEE,YAAY,CAAC;IACxD,cAAc,EAAE,KAAK;IACrB,GAAGhF,eAAe,CAAC+E,KAAK,EAAE7B,GAAG;EAC/B,CAAC,CACF;AACH","ignoreList":[]}
+{"version":3,"file":"useBox.js","names":["sstyled","getAutoOrScaleIndent","removeUndefinedKeys","getSize","propsForElement","cn","React","style","_sstyled","insert","calculateIndentStyles","props","scaleIndent","display","width","height","minWidth","maxWidth","minHeight","maxHeight","position","top","left","bottom","right","inset","flex","zIndex","textAlign","margin","marginTop","marginBottom","marginLeft","marginRight","padding","paddingTop","paddingBottom","paddingLeft","paddingRight","useBox","ref","tag","Tag","className","styleProp","boxSizing","inline","innerOutline","invertOutline","inAfterOutline","w","h","wMin","wMax","hMin","hMax","m","mt","mb","my","ml","mr","mx","p","pt","pb","py","pl","pr","px","css","other","indentStyles","useMemo","styles","Fragment","children","SBoxSizing","SBoxInline","SBoxInnerOutline","undefined","Object","assign"],"sources":["../../../../../src/components/flex-box/Box/useBox.tsx"],"sourcesContent":["import { sstyled, type UnknownProperties, type IStyledProps } from '@semcore/core';\nimport { getAutoOrScaleIndent, removeUndefinedKeys, getSize } from '@semcore/core/lib/utils/indentStyles';\nimport propsForElement from '@semcore/core/lib/utils/propsForElement';\nimport cn from 'classnames';\nimport type { Properties, Property } from 'csstype';\nimport React from 'react';\n\nimport style from '../style/use-box.shadow.css';\n\nexport type BoxProps = IStyledProps & {\n  /**\n   * CSS `display` property\n   */\n  display?: Property.Display;\n\n  /** Sets the `inline-block` property */\n  inline?: boolean;\n\n  /** CSS `box-sizing: border-box` property */\n  boxSizing?: boolean | 'border-box';\n\n  /** CSS `flex` property */\n  flex?: Property.Flex<string>;\n\n  /** CSS `margin` property */\n  m?: number | string;\n\n  /** CSS `margin-top` property */\n  mt?: number | string;\n\n  /** CSS `margin-right` property */\n  mr?: number | string;\n\n  /** CSS `margin-bottom` property */\n  mb?: number | string;\n\n  /** CSS `margin-left` property */\n  ml?: number | string;\n\n  /** CSS `margin-left` and `margin-right` property */\n  mx?: number | string;\n\n  /** CSS `margin-top` and `margin-bottom` property */\n  my?: number | string;\n\n  /** CSS `padding` property */\n  p?: number | string;\n\n  /** CSS `padding-top` property */\n  pt?: number | string;\n\n  /** CSS `padding-right` property */\n  pr?: number | string;\n\n  /** CSS `padding-bottom` property */\n  pb?: number | string;\n\n  /** CSS `padding-left` property */\n  pl?: number | string;\n\n  /** CSS `padding-left` and `padding-right` property */\n  px?: number | string;\n\n  /** CSS `padding-top` and `padding-bottom` property */\n  py?: number | string;\n\n  /**\n   * CSS `width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  w?: number | string;\n\n  /**\n   * CSS `min-width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  wMin?: number | string;\n\n  /**\n   * CSS `max-width` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  wMax?: number | string;\n\n  /**\n   * CSS `height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  h?: number | string;\n\n  /**\n   * CSS `min-height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  hMin?: number | string;\n\n  /**\n   * CSS `max-height` property.\n   * If its value is less than 1, is considered as a fraction of 100%.\n   * If its value is more than 1, is considered as value in px, if it is a string, is passed as is.\n   */\n  hMax?: number | string;\n\n  /**\n   * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12).\n   * @default 4\n   */\n  scaleIndent?: number;\n\n  /**\n   * Flag for render outline inside box\n   * @default false\n   */\n  innerOutline?: boolean;\n\n  /**\n   * Flag for render inverted outline\n   * @default false\n   */\n  invertOutline?: boolean;\n\n  /**\n   * Flag for render outline in the ::after element\n   * @default false\n   */\n  inAfterOutline?: boolean;\n  /** CSS `position` property */\n  position?: Property.Position;\n  /** CSS `top` property */\n  top?: number | string;\n  /** CSS `left` property */\n  left?: number | string;\n  /** CSS `bottom` property */\n  bottom?: number | string;\n  /** CSS `right` property */\n  right?: number | string;\n  /** CSS `inset` property */\n  inset?: string;\n  /** CSS `z-index` property */\n  zIndex?: number;\n  /** CSS `text-align` property */\n  textAlign?: Property.TextAlign;\n  /** Box content */\n  children?: React.ReactNode;\n};\n\n/** @deprecated */\nexport interface IBoxProps extends BoxProps, UnknownProperties {\n  /**\n   *  HTML tag name for the displayed item\n   * @default div\n   */\n  tag?: React.ElementType | string;\n}\n\nfunction calculateIndentStyles(props: BoxProps, scaleIndent: number) {\n  return removeUndefinedKeys({\n    display: props['display'],\n    width: getSize(props['w']),\n    height: getSize(props['h']),\n    minWidth: getSize(props['wMin']),\n    maxWidth: getSize(props['wMax']),\n    minHeight: getSize(props['hMin']),\n    maxHeight: getSize(props['hMax']),\n    position: props['position'],\n    top: getSize(props['top']),\n    left: getSize(props['left']),\n    bottom: getSize(props['bottom']),\n    right: getSize(props['right']),\n    inset: props.inset,\n    flex: props.flex,\n    zIndex: props.zIndex,\n    textAlign: props.textAlign,\n\n    margin: getAutoOrScaleIndent(props['m'], scaleIndent),\n    marginTop:\n      getAutoOrScaleIndent(props['mt'], scaleIndent) ||\n      getAutoOrScaleIndent(props['my'], scaleIndent),\n    marginBottom:\n      getAutoOrScaleIndent(props['mb'], scaleIndent) ||\n      getAutoOrScaleIndent(props['my'], scaleIndent),\n    marginLeft:\n      getAutoOrScaleIndent(props['ml'], scaleIndent) ||\n      getAutoOrScaleIndent(props['mx'], scaleIndent),\n    marginRight:\n      getAutoOrScaleIndent(props['mr'], scaleIndent) ||\n      getAutoOrScaleIndent(props['mx'], scaleIndent),\n\n    padding: getAutoOrScaleIndent(props['p'], scaleIndent),\n    paddingTop:\n      getAutoOrScaleIndent(props['pt'], scaleIndent) ||\n      getAutoOrScaleIndent(props['py'], scaleIndent),\n    paddingBottom:\n      getAutoOrScaleIndent(props['pb'], scaleIndent) ||\n      getAutoOrScaleIndent(props['py'], scaleIndent),\n    paddingLeft:\n      getAutoOrScaleIndent(props['pl'], scaleIndent) ||\n      getAutoOrScaleIndent(props['px'], scaleIndent),\n    paddingRight:\n      getAutoOrScaleIndent(props['pr'], scaleIndent) ||\n      getAutoOrScaleIndent(props['px'], scaleIndent),\n  });\n}\n\nexport default function useBox<T extends BoxProps>(\n  props: T,\n  ref: React.Ref<HTMLElement>,\n): [React.ElementType | string, any] {\n  const {\n    tag: Tag = 'div',\n    className,\n    style: styleProp,\n    scaleIndent = 4,\n    display,\n    boxSizing,\n    inline,\n    innerOutline,\n    invertOutline,\n    inAfterOutline,\n    flex,\n    w,\n    h,\n    wMin,\n    wMax,\n    hMin,\n    hMax,\n    m,\n    mt,\n    mb,\n    my,\n    ml,\n    mr,\n    mx,\n    p,\n    pt,\n    pb,\n    py,\n    pl,\n    pr,\n    px,\n    css,\n    position,\n    top,\n    left,\n    bottom,\n    right,\n    inset,\n    zIndex,\n    ...other\n  } = props as any;\n\n  const indentStyles: Properties = React.useMemo(() => {\n    return calculateIndentStyles(props, scaleIndent);\n  }, [\n    scaleIndent,\n    display,\n    w,\n    h,\n    wMin,\n    wMax,\n    hMin,\n    hMax,\n    flex,\n    m,\n    mt,\n    mb,\n    my,\n    ml,\n    mr,\n    mx,\n    p,\n    pt,\n    pb,\n    py,\n    pl,\n    pr,\n    px,\n    position,\n    top,\n    left,\n    bottom,\n    right,\n    inset,\n    zIndex,\n  ]);\n\n  const styles = sstyled(style);\n\n  if (Tag === React.Fragment) return [React.Fragment, { children: props.children }];\n\n  return [\n    Tag,\n    {\n      ref,\n      'className':\n        cn(\n          styles.cn('SBox', {\n            SBoxSizing: boxSizing,\n            SBoxInline: inline,\n            SBoxInnerOutline: innerOutline,\n            inAfterOutline: inAfterOutline === true ? 'true' : 'false',\n            invertOutline,\n          }).className,\n          className,\n        ) || undefined,\n      'style': Object.assign({}, styleProp, css, indentStyles),\n      'data-ui-name': 'Box',\n      ...propsForElement(other, Tag),\n    },\n  ];\n}\n"],"mappings":"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","ignoreList":[]}

package/lib/es6/components/flex-box/Flex/useFlex.js

@@ -1,8 +1,9 @@
 import { sstyled as _sstyled } from "@semcore/core";
 import { sstyled } from '@semcore/core';
+import { getAutoOrScaleIndent, removeUndefinedKeys } from '@semcore/core/lib/utils/indentStyles';
 import cn from 'classnames';
 import React from 'react';
-import useBox, { removeUndefinedKeys } from '../Box/useBox';
+import useBox from '../Box/useBox';
 /*!__reshadow-styles__:"../style/use-flex.shadow.css"*/
 const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/".___SFlex_fqcaq_gg_{display:flex}.___SFlex_fqcaq_gg_.__inline_fqcaq_gg_{display:inline-flex}", /*__inner_css_end__*/"fqcaq_gg_"),
 /*__reshadow_css_end__*/
@@ -10,7 +11,6 @@ const style = (/*__reshadow_css_start__*/_sstyled.insert(/*__inner_css_start__*/
   "__SFlex": "___SFlex_fqcaq_gg_",
   "_inline": "__inline_fqcaq_gg_"
 });
-import { getAutoOrScaleIndent } from '../utils';
 function calculateFlexStyles(props) {
   const DirectionReverse = {
     row: 'row-reverse',

package/lib/es6/components/flex-box/Flex/useFlex.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFlex.js","names":["sstyled","cn","React","useBox","removeUndefinedKeys","style","_sstyled","insert","getAutoOrScaleIndent","calculateFlexStyles","props","DirectionReverse","row","column","scaleIndent","alignItems","alignContent","justifyContent","flexWrap","reverse","undefined","flexDirection","direction","rowGap","gap","columnGap","useFlex","ref","Tag","className","styleProp","other","inline","flexStyles","useMemo","styles","Fragment","children","Object","assign"],"sources":["../../../../../src/components/flex-box/Flex/useFlex.tsx"],"sourcesContent":["import { sstyled } from '@semcore/core';\nimport cn from 'classnames';\nimport type { Property, Properties } from 'csstype';\nimport React from 'react';\n\nimport useBox, { type BoxProps, removeUndefinedKeys } from '../Box/useBox';\nimport style from '../style/use-flex.shadow.css';\nimport { getAutoOrScaleIndent } from '../utils';\n\nexport type FlexProps = BoxProps & {\n  /**\n   * It manages the `inline-flex` property\n   */\n  inline?: boolean;\n  /**\n   * Adds the `reverse` property to `flex-direction`\n   */\n  reverse?: boolean;\n  /**\n   * It manages the `flex-wrap` property\n   */\n  flexWrap?: boolean;\n  /**\n   * It manages the `flex-direction` property\n   */\n  direction?: Property.FlexDirection;\n  /**\n   * It manages the `align-items` property\n   */\n  alignItems?: Property.AlignItems;\n  /**\n   * It manages the `align-content` property\n   */\n  alignContent?: Property.AlignContent;\n  /**\n   * CSS `justify-content` property\n   */\n  justifyContent?: Property.JustifyContent;\n  /**\n   * CSS `gap` property\n   */\n  gap?: Property.Gap<number>;\n  /**\n   * CSS `gap` property\n   */\n  rowGap?: Property.RowGap<number>;\n  /**\n   * CSS `gap` property\n   */\n  columnGap?: Property.ColumnGap<number>;\n\n  /**\n   * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12).\n   * @default 4\n   */\n  scaleIndent?: number;\n};\n\nfunction calculateFlexStyles(props: any) {\n  const DirectionReverse: Record<string, string> = {\n    row: 'row-reverse',\n    column: 'column-reverse',\n  };\n\n  const scaleIndent = props.scaleIndent ?? 4;\n\n  return removeUndefinedKeys({\n    alignItems: props.alignItems,\n    alignContent: props.alignContent,\n    justifyContent: props.justifyContent,\n    flexWrap: props.flexWrap ? `wrap${props.reverse ? '-reverse' : ''}` : undefined,\n    flexDirection: (props.reverse && DirectionReverse[props.direction]) || props.direction,\n    rowGap: getAutoOrScaleIndent(props.rowGap || props.gap, scaleIndent),\n    columnGap: getAutoOrScaleIndent(props.columnGap || props.gap, scaleIndent),\n  });\n}\n\nexport default function useFlex<T extends FlexProps>(\n  props: T,\n  ref: React.Ref<HTMLElement>,\n): [React.ElementType | string, any] {\n  const [Tag, { className, style: styleProp, ...other }] = useBox(\n    {\n      'data-ui-name': 'Flex',\n      ...props,\n      'inline': false,\n    },\n    ref,\n  );\n  const {\n    inline,\n    flexWrap,\n    direction,\n    reverse,\n    alignItems,\n    alignContent,\n    justifyContent,\n    gap,\n    rowGap,\n    columnGap,\n    scaleIndent,\n  } = props;\n\n  const flexStyles: Properties = React.useMemo(() => {\n    return calculateFlexStyles(props);\n  }, [\n    flexWrap,\n    direction,\n    reverse,\n    alignItems,\n    alignContent,\n    justifyContent,\n    gap,\n    rowGap,\n    columnGap,\n    scaleIndent,\n  ]);\n\n  const styles = sstyled(style);\n\n  if (Tag === React.Fragment) return [React.Fragment, { children: props.children }];\n\n  return [\n    Tag,\n    {\n      className:\n        cn(\n          styles.cn('SFlex', {\n            inline: inline,\n          }).className,\n          className,\n        ) || undefined,\n      style: Object.assign({}, styleProp, flexStyles),\n      ...other,\n    },\n  ];\n}\n"],"mappings":";AAAA,SAASA,OAAO,QAAQ,eAAe;AACvC,OAAOC,EAAE,MAAM,YAAY;AAE3B,OAAOC,KAAK,MAAM,OAAO;AAEzB,OAAOC,MAAM,IAAmBC,mBAAmB,QAAQ,eAAe;AAAC;AAAA,MAAAC,KAAA,8BAAAC,QAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;AAAA;AAE3E,SAASC,oBAAoB,QAAQ,UAAU;AAmD/C,SAASC,mBAAmBA,CAACC,KAAU,EAAE;EACvC,MAAMC,gBAAwC,GAAG;IAC/CC,GAAG,EAAE,aAAa;IAClBC,MAAM,EAAE;EACV,CAAC;EAED,MAAMC,WAAW,GAAGJ,KAAK,CAACI,WAAW,IAAI,CAAC;EAE1C,OAAOV,mBAAmB,CAAC;IACzBW,UAAU,EAAEL,KAAK,CAACK,UAAU;IAC5BC,YAAY,EAAEN,KAAK,CAACM,YAAY;IAChCC,cAAc,EAAEP,KAAK,CAACO,cAAc;IACpCC,QAAQ,EAAER,KAAK,CAACQ,QAAQ,GAAG,OAAOR,KAAK,CAACS,OAAO,GAAG,UAAU,GAAG,EAAE,EAAE,GAAGC,SAAS;IAC/EC,aAAa,EAAGX,KAAK,CAACS,OAAO,IAAIR,gBAAgB,CAACD,KAAK,CAACY,SAAS,CAAC,IAAKZ,KAAK,CAACY,SAAS;IACtFC,MAAM,EAAEf,oBAAoB,CAACE,KAAK,CAACa,MAAM,IAAIb,KAAK,CAACc,GAAG,EAAEV,WAAW,CAAC;IACpEW,SAAS,EAAEjB,oBAAoB,CAACE,KAAK,CAACe,SAAS,IAAIf,KAAK,CAACc,GAAG,EAAEV,WAAW;EAC3E,CAAC,CAAC;AACJ;AAEA,eAAe,SAASY,OAAOA,CAC7BhB,KAAQ,EACRiB,GAA2B,EACQ;EACnC,MAAM,CAACC,GAAG,EAAE;IAAEC,SAAS;IAAExB,KAAK,EAAEyB,SAAS;IAAE,GAAGC;EAAM,CAAC,CAAC,GAAG5B,MAAM,CAC7D;IACE,cAAc,EAAE,MAAM;IACtB,GAAGO,KAAK;IACR,QAAQ,EAAE;EACZ,CAAC,EACDiB,GACF,CAAC;EACD,MAAM;IACJK,MAAM;IACNd,QAAQ;IACRI,SAAS;IACTH,OAAO;IACPJ,UAAU;IACVC,YAAY;IACZC,cAAc;IACdO,GAAG;IACHD,MAAM;IACNE,SAAS;IACTX;EACF,CAAC,GAAGJ,KAAK;EAET,MAAMuB,UAAsB,GAAG/B,KAAK,CAACgC,OAAO,CAAC,MAAM;IACjD,OAAOzB,mBAAmB,CAACC,KAAK,CAAC;EACnC,CAAC,EAAE,CACDQ,QAAQ,EACRI,SAAS,EACTH,OAAO,EACPJ,UAAU,EACVC,YAAY,EACZC,cAAc,EACdO,GAAG,EACHD,MAAM,EACNE,SAAS,EACTX,WAAW,CACZ,CAAC;EAEF,MAAMqB,MAAM,GAAGnC,OAAO,CAACK,KAAK,CAAC;EAE7B,IAAIuB,GAAG,KAAK1B,KAAK,CAACkC,QAAQ,EAAE,OAAO,CAAClC,KAAK,CAACkC,QAAQ,EAAE;IAAEC,QAAQ,EAAE3B,KAAK,CAAC2B;EAAS,CAAC,CAAC;EAEjF,OAAO,CACLT,GAAG,EACH;IACEC,SAAS,EACP5B,EAAE,CACAkC,MAAM,CAAClC,EAAE,CAAC,OAAO,EAAE;MACjB+B,MAAM,EAAEA;IACV,CAAC,CAAC,CAACH,SAAS,EACZA,SACF,CAAC,IAAIT,SAAS;IAChBf,KAAK,EAAEiC,MAAM,CAACC,MAAM,CAAC,CAAC,CAAC,EAAET,SAAS,EAAEG,UAAU,CAAC;IAC/C,GAAGF;EACL,CAAC,CACF;AACH","ignoreList":[]}
+{"version":3,"file":"useFlex.js","names":["sstyled","getAutoOrScaleIndent","removeUndefinedKeys","cn","React","useBox","style","_sstyled","insert","calculateFlexStyles","props","DirectionReverse","row","column","scaleIndent","alignItems","alignContent","justifyContent","flexWrap","reverse","undefined","flexDirection","direction","rowGap","gap","columnGap","useFlex","ref","Tag","className","styleProp","other","inline","flexStyles","useMemo","styles","Fragment","children","Object","assign"],"sources":["../../../../../src/components/flex-box/Flex/useFlex.tsx"],"sourcesContent":["import { sstyled } from '@semcore/core';\nimport { getAutoOrScaleIndent, removeUndefinedKeys } from '@semcore/core/lib/utils/indentStyles';\nimport cn from 'classnames';\nimport type { Property, Properties } from 'csstype';\nimport React from 'react';\n\nimport useBox, { type BoxProps } from '../Box/useBox';\nimport style from '../style/use-flex.shadow.css';\n\nexport type FlexProps = BoxProps & {\n  /**\n   * It manages the `inline-flex` property\n   */\n  inline?: boolean;\n  /**\n   * Adds the `reverse` property to `flex-direction`\n   */\n  reverse?: boolean;\n  /**\n   * It manages the `flex-wrap` property\n   */\n  flexWrap?: boolean;\n  /**\n   * It manages the `flex-direction` property\n   */\n  direction?: Property.FlexDirection;\n  /**\n   * It manages the `align-items` property\n   */\n  alignItems?: Property.AlignItems;\n  /**\n   * It manages the `align-content` property\n   */\n  alignContent?: Property.AlignContent;\n  /**\n   * CSS `justify-content` property\n   */\n  justifyContent?: Property.JustifyContent;\n  /**\n   * CSS `gap` property\n   */\n  gap?: Property.Gap<number>;\n  /**\n   * CSS `gap` property\n   */\n  rowGap?: Property.RowGap<number>;\n  /**\n   * CSS `gap` property\n   */\n  columnGap?: Property.ColumnGap<number>;\n\n  /**\n   * Multiplier of all indents. For example, if you specify a margin-top equal to 3 (mt = {3}), it will be 12px (3 * 4 = 12).\n   * @default 4\n   */\n  scaleIndent?: number;\n};\n\nfunction calculateFlexStyles(props: any) {\n  const DirectionReverse: Record<string, string> = {\n    row: 'row-reverse',\n    column: 'column-reverse',\n  };\n\n  const scaleIndent = props.scaleIndent ?? 4;\n\n  return removeUndefinedKeys({\n    alignItems: props.alignItems,\n    alignContent: props.alignContent,\n    justifyContent: props.justifyContent,\n    flexWrap: props.flexWrap ? `wrap${props.reverse ? '-reverse' : ''}` : undefined,\n    flexDirection: (props.reverse && DirectionReverse[props.direction]) || props.direction,\n    rowGap: getAutoOrScaleIndent(props.rowGap || props.gap, scaleIndent),\n    columnGap: getAutoOrScaleIndent(props.columnGap || props.gap, scaleIndent),\n  });\n}\n\nexport default function useFlex<T extends FlexProps>(\n  props: T,\n  ref: React.Ref<HTMLElement>,\n): [React.ElementType | string, any] {\n  const [Tag, { className, style: styleProp, ...other }] = useBox(\n    {\n      'data-ui-name': 'Flex',\n      ...props,\n      'inline': false,\n    },\n    ref,\n  );\n  const {\n    inline,\n    flexWrap,\n    direction,\n    reverse,\n    alignItems,\n    alignContent,\n    justifyContent,\n    gap,\n    rowGap,\n    columnGap,\n    scaleIndent,\n  } = props;\n\n  const flexStyles: Properties = React.useMemo(() => {\n    return calculateFlexStyles(props);\n  }, [\n    flexWrap,\n    direction,\n    reverse,\n    alignItems,\n    alignContent,\n    justifyContent,\n    gap,\n    rowGap,\n    columnGap,\n    scaleIndent,\n  ]);\n\n  const styles = sstyled(style);\n\n  if (Tag === React.Fragment) return [React.Fragment, { children: props.children }];\n\n  return [\n    Tag,\n    {\n      className:\n        cn(\n          styles.cn('SFlex', {\n            inline: inline,\n          }).className,\n          className,\n        ) || undefined,\n      style: Object.assign({}, styleProp, flexStyles),\n      ...other,\n    },\n  ];\n}\n"],"mappings":";AAAA,SAASA,OAAO,QAAQ,eAAe;AACvC,SAASC,oBAAoB,EAAEC,mBAAmB,QAAQ,sCAAsC;AAChG,OAAOC,EAAE,MAAM,YAAY;AAE3B,OAAOC,KAAK,MAAM,OAAO;AAEzB,OAAOC,MAAM,MAAyB,eAAe;AAAC;AAAA,MAAAC,KAAA,8BAAAC,QAAA,CAAAC,MAAA;AAAA;AAAA;EAAA;EAAA;AAAA;AAoDtD,SAASC,mBAAmBA,CAACC,KAAU,EAAE;EACvC,MAAMC,gBAAwC,GAAG;IAC/CC,GAAG,EAAE,aAAa;IAClBC,MAAM,EAAE;EACV,CAAC;EAED,MAAMC,WAAW,GAAGJ,KAAK,CAACI,WAAW,IAAI,CAAC;EAE1C,OAAOZ,mBAAmB,CAAC;IACzBa,UAAU,EAAEL,KAAK,CAACK,UAAU;IAC5BC,YAAY,EAAEN,KAAK,CAACM,YAAY;IAChCC,cAAc,EAAEP,KAAK,CAACO,cAAc;IACpCC,QAAQ,EAAER,KAAK,CAACQ,QAAQ,GAAG,OAAOR,KAAK,CAACS,OAAO,GAAG,UAAU,GAAG,EAAE,EAAE,GAAGC,SAAS;IAC/EC,aAAa,EAAGX,KAAK,CAACS,OAAO,IAAIR,gBAAgB,CAACD,KAAK,CAACY,SAAS,CAAC,IAAKZ,KAAK,CAACY,SAAS;IACtFC,MAAM,EAAEtB,oBAAoB,CAACS,KAAK,CAACa,MAAM,IAAIb,KAAK,CAACc,GAAG,EAAEV,WAAW,CAAC;IACpEW,SAAS,EAAExB,oBAAoB,CAACS,KAAK,CAACe,SAAS,IAAIf,KAAK,CAACc,GAAG,EAAEV,WAAW;EAC3E,CAAC,CAAC;AACJ;AAEA,eAAe,SAASY,OAAOA,CAC7BhB,KAAQ,EACRiB,GAA2B,EACQ;EACnC,MAAM,CAACC,GAAG,EAAE;IAAEC,SAAS;IAAEvB,KAAK,EAAEwB,SAAS;IAAE,GAAGC;EAAM,CAAC,CAAC,GAAG1B,MAAM,CAC7D;IACE,cAAc,EAAE,MAAM;IACtB,GAAGK,KAAK;IACR,QAAQ,EAAE;EACZ,CAAC,EACDiB,GACF,CAAC;EACD,MAAM;IACJK,MAAM;IACNd,QAAQ;IACRI,SAAS;IACTH,OAAO;IACPJ,UAAU;IACVC,YAAY;IACZC,cAAc;IACdO,GAAG;IACHD,MAAM;IACNE,SAAS;IACTX;EACF,CAAC,GAAGJ,KAAK;EAET,MAAMuB,UAAsB,GAAG7B,KAAK,CAAC8B,OAAO,CAAC,MAAM;IACjD,OAAOzB,mBAAmB,CAACC,KAAK,CAAC;EACnC,CAAC,EAAE,CACDQ,QAAQ,EACRI,SAAS,EACTH,OAAO,EACPJ,UAAU,EACVC,YAAY,EACZC,cAAc,EACdO,GAAG,EACHD,MAAM,EACNE,SAAS,EACTX,WAAW,CACZ,CAAC;EAEF,MAAMqB,MAAM,GAAGnC,OAAO,CAACM,KAAK,CAAC;EAE7B,IAAIsB,GAAG,KAAKxB,KAAK,CAACgC,QAAQ,EAAE,OAAO,CAAChC,KAAK,CAACgC,QAAQ,EAAE;IAAEC,QAAQ,EAAE3B,KAAK,CAAC2B;EAAS,CAAC,CAAC;EAEjF,OAAO,CACLT,GAAG,EACH;IACEC,SAAS,EACP1B,EAAE,CACAgC,MAAM,CAAChC,EAAE,CAAC,OAAO,EAAE;MACjB6B,MAAM,EAAEA;IACV,CAAC,CAAC,CAACH,SAAS,EACZA,SACF,CAAC,IAAIT,SAAS;IAChBd,KAAK,EAAEgC,MAAM,CAACC,MAAM,CAAC,CAAC,CAAC,EAAET,SAAS,EAAEG,UAAU,CAAC;IAC/C,GAAGF;EACL,CAAC,CACF;AACH","ignoreList":[]}

package/lib/es6/components/hint/Hint.js

@@ -98,8 +98,12 @@ class HintPopperRoot extends Component {
     };
   }
   componentDidMount() {
-    const trigger = this.asProps.triggerRef.current;
-    if (trigger) {
+    const {
+      triggerRef,
+      children
+    } = this.asProps;
+    const trigger = triggerRef.current;
+    if (trigger && children) {
       this.subscribe(trigger);
     }
   }

package/lib/es6/components/hint/Hint.js.map

@@ -1 +1 @@
-{"version":3,"file":"Hint.js","names":["computePosition","flip","offset","shift","createComponent","Root","sstyled","Component","lastInteraction","canUseDOM","getAccessibleName","cssVariableEnhance","zIndexStackingEnhance","React","Middleware","keyframes","_sstyled","insert","Box","Portal","styles","_sstyled2","enhances","variable","fallback","map","v","Number","parseInt","toString","prop","propToArray","Array","isArray","keyframesMap","Map","HintPopperRoot","constructor","props","_defineProperty","createRef","handleFocus","bind","handleBlur","handleMouseEnter","handleMouseLeave","handleKeyDown","state","innerVisible","visible","calculatedPlacement","placement","uncontrolledProps","componentDidMount","trigger","asProps","triggerRef","current","subscribe","componentWillUnmount","unsubscribe","componentDidUpdate","prevProps","requestAnimationFrame","showHint","hideHint","addEventListener","removeEventListener","node","mouseEvent","timeout","showTimeout","hideTimer","clearTimeout","showTimer","window","setTimeout","handlers","popperElement","hintRef","middleware","padding","verticalPlacement","startsWith","undefined","push","verticalCursorAnchoring","x","clientX","then","y","Object","assign","style","left","top","visibility","setState","hideTimeout","setProperty","e","target","HTMLElement","isKeyboard","key","stopPropagation","keyframesKey","has","get","keyframe","set","setTriggerAriaLabel","children","textContent","ariaLabel","label","setAttribute","render","_ref","_ref2","SHintPopper","Children","parentZIndexStacking","timingFunction","duration","createElement","cn","_assignProps","defaultVisible","Hint"],"sources":["../../../../src/components/hint/Hint.tsx"],"sourcesContent":["import { computePosition, flip, offset, shift, type Placement } from '@floating-ui/dom';\nimport { createComponent, Root, sstyled, Component, lastInteraction } from '@semcore/core';\nimport canUseDOM from '@semcore/core/lib/utils/canUseDOM';\nimport { getAccessibleName } from '@semcore/core/lib/utils/getAccessibleName';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport { zIndexStackingEnhance } from '@semcore/core/lib/utils/zIndexStacking';\nimport type { DataType } from 'csstype';\nimport React from 'react';\n\nimport { Middleware } from './Middleware';\nimport keyframes from '../animation/style/keyframes.shadow.css';\nimport { Box } from '../flex-box';\nimport { Portal } from '../portal';\nimport styles from './style/hint.shadow.css';\n\ntype Handlers = {\n  visible: null;\n};\n\nexport type SimpleHintPopperProps = {\n  /** Ref to the trigger element */\n  triggerRef: React.RefObject<HTMLElement | null>;\n  /**\n   * The position of the popper relative to the trigger that called it.\n   * @default top\n   */\n  placement?: Placement;\n  /**\n   * Timer to show and hide the popper\n   * @default [500, 500]\n   */\n  timeout?: DefaultProps['timeout'];\n  /**\n   * Hint content.\n   * Better to use here some short text.\n   * */\n  children: React.ReactNode;\n\n  /** Popper visibility value */\n  visible?: boolean;\n  /** Default popper visibility\n   * @default false */\n  defaultVisible?: boolean;\n  /** Function called when visibility changes */\n  onVisibleChange?: (visible: boolean, e?: Event) => boolean | void;\n};\n\ntype DefaultProps = {\n  defaultVisible?: boolean;\n  timeout: number | [number, number];\n  timingFunction: DataType.EasingFunction;\n  placement?: Placement;\n};\n\ntype State = {\n  innerVisible: boolean | null;\n  calculatedPlacement?: Placement;\n};\n\nconst enhances = [\n  zIndexStackingEnhance('z-index-tooltip'),\n  cssVariableEnhance({\n    variable: '--intergalactic-duration-popper',\n    fallback: '200',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'duration',\n  }),\n  cssVariableEnhance({\n    variable: '--intergalactic-spacing-1x',\n    fallback: '4',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'offset',\n  }),\n  cssVariableEnhance({\n    variable: '--intergalactic-spacing-1x',\n    fallback: '4',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'padding',\n  }),\n] as const;\n\nfunction propToArray(prop: number | [number, number]): [number, number] {\n  return Array.isArray(prop) ? prop : [prop, prop];\n}\n\nconst keyframesMap = new Map<Placement, string>();\n\nclass HintPopperRoot extends Component<SimpleHintPopperProps, typeof enhances, Handlers, DefaultProps, State> {\n  public readonly hintRef = React.createRef<HTMLElement>();\n\n  static style = Object.assign(keyframes, styles);\n\n  private showTimer?: number;\n  private hideTimer?: number;\n\n  static enhance = enhances;\n\n  static defaultProps: DefaultProps = {\n    defaultVisible: false,\n    timeout: [500, 500],\n    timingFunction: 'ease-out',\n    placement: 'top',\n  };\n\n  constructor(props: SimpleHintPopperProps) {\n    super(props);\n\n    this.handleFocus = this.handleFocus.bind(this);\n    this.handleBlur = this.handleBlur.bind(this);\n    this.handleMouseEnter = this.handleMouseEnter.bind(this);\n    this.handleMouseLeave = this.handleMouseLeave.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n\n    this.state = {\n      innerVisible: props.visible ?? null,\n      calculatedPlacement: props.placement,\n    };\n  }\n\n  uncontrolledProps() {\n    return {\n      visible: null,\n    };\n  }\n\n  componentDidMount() {\n    const trigger = this.asProps.triggerRef.current;\n\n    if (trigger) {\n      this.subscribe(trigger);\n    }\n  }\n\n  componentWillUnmount() {\n    const trigger = this.asProps.triggerRef.current;\n\n    if (trigger) {\n      this.unsubscribe(trigger);\n    }\n  }\n\n  componentDidUpdate(prevProps: SimpleHintPopperProps) {\n    if (prevProps.visible !== this.props.visible) {\n      requestAnimationFrame(() => {\n        const trigger = this.props.triggerRef.current;\n\n        if (this.props.visible && trigger) {\n          this.showHint(trigger);\n        } else {\n          this.hideHint();\n        }\n      });\n    }\n  }\n\n  private subscribe(trigger: HTMLElement) {\n    trigger.addEventListener('focus', this.handleFocus);\n    trigger.addEventListener('blur', this.handleBlur);\n    trigger.addEventListener('mouseenter', this.handleMouseEnter);\n    trigger.addEventListener('mouseleave', this.handleMouseLeave);\n    trigger.addEventListener('keydown', this.handleKeyDown);\n\n    if (this.asProps.visible) {\n      this.showHint(trigger);\n    }\n  }\n\n  private unsubscribe(trigger: HTMLElement) {\n    trigger.removeEventListener('focus', this.handleFocus);\n    trigger.removeEventListener('blur', this.handleBlur);\n    trigger.removeEventListener('mouseenter', this.handleMouseEnter);\n    trigger.removeEventListener('mouseleave', this.handleMouseLeave);\n    trigger.removeEventListener('keydown', this.handleKeyDown);\n\n    this.hideHint();\n  }\n\n  private showHint(node: HTMLElement, mouseEvent?: MouseEvent): void {\n    const { placement, timeout } = this.asProps;\n\n    const showTimeout = Array.isArray(timeout) ? timeout[0] : timeout;\n\n    if (this.hideTimer) {\n      clearTimeout(this.hideTimer);\n    }\n\n    this.showTimer = window.setTimeout(() => {\n      this.handlers.visible(true);\n\n      window.setTimeout(() => {\n        const popperElement = this.hintRef.current;\n        if (popperElement) {\n          const middleware = [\n            offset(Number(this.asProps.offset)),\n            flip(),\n            shift({ padding: Number(this.asProps.padding) }),\n          ];\n          const verticalPlacement = !placement || placement.startsWith('top') || placement.startsWith('bottom');\n          if (mouseEvent !== undefined && verticalPlacement) {\n            middleware.push(\n              Middleware.verticalCursorAnchoring({ x: mouseEvent.clientX }),\n              shift({ padding: Number(this.asProps.padding) }),\n            );\n          }\n\n          computePosition(node, popperElement, {\n            placement: placement,\n            middleware,\n          }).then(({ x, y, placement }) => {\n            Object.assign(popperElement.style, {\n              left: `${x}px`,\n              top: `${y}px`,\n            });\n            popperElement.style.visibility = 'visible';\n\n            this.setState({ innerVisible: true, calculatedPlacement: placement });\n          });\n        }\n      }, 10);\n    }, showTimeout);\n  }\n\n  private hideHint(): void {\n    const { timeout } = this.asProps;\n\n    const hideTimeout = Array.isArray(timeout) ? timeout[1] : timeout;\n\n    if (this.showTimer) {\n      clearTimeout(this.showTimer);\n    }\n\n    this.setState({ innerVisible: false });\n\n    this.hideTimer = window.setTimeout(() => {\n      this.hintRef.current?.style.setProperty('visibility', 'hidden');\n      this.handlers.visible(false);\n      this.setState({ innerVisible: null });\n    }, hideTimeout);\n  }\n\n  private handleFocus(e: FocusEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target && lastInteraction.isKeyboard()) {\n      this.showHint(e.target);\n    }\n  }\n\n  private handleBlur(e: FocusEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.hideHint();\n    }\n  }\n\n  private handleKeyDown(e: KeyboardEvent): void {\n    if (e.key === 'Escape' && e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target && this.state.innerVisible) {\n      e.stopPropagation();\n      this.hideHint();\n    }\n  }\n\n  private handleMouseEnter(e: MouseEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.showHint(e.target, e);\n    }\n  }\n\n  private handleMouseLeave(e: MouseEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.hideHint();\n    }\n  }\n\n  private keyframesKey(placement?: Placement) {\n    if (!placement) {\n      return 'opacity';\n    }\n\n    if (keyframesMap.has(placement)) {\n      return keyframesMap.get(placement)!;\n    }\n\n    let keyframe: string = 'opacity';\n\n    if (placement.startsWith('left')) keyframe = 'scale-left';\n    if (placement.startsWith('right')) keyframe = 'scale-right';\n    if (placement.startsWith('bottom')) keyframe = 'scale-bottom';\n    if (placement.startsWith('top')) keyframe = 'scale-top';\n\n    keyframesMap.set(placement, keyframe);\n\n    return keyframe;\n  }\n\n  private setTriggerAriaLabel() {\n    const { triggerRef, children } = this.asProps;\n\n    requestAnimationFrame(() => {\n      const trigger = triggerRef.current;\n\n      if (trigger) {\n        const textContent = trigger.textContent;\n        const ariaLabel = getAccessibleName(trigger);\n\n        if (!textContent && !ariaLabel) {\n          const label = (typeof children === 'string' || typeof children === 'number')\n            ? children.toString()\n            : (this.hintRef.current?.textContent ?? '');\n          triggerRef.current?.setAttribute('aria-label', label);\n        }\n      }\n    });\n  }\n\n  render() {\n    const SHintPopper = Root;\n    const { visible, Children, parentZIndexStacking, styles, timingFunction } = this.asProps;\n    const { innerVisible, calculatedPlacement } = this.state;\n\n    if (canUseDOM()) {\n      this.setTriggerAriaLabel();\n    }\n\n    if (!visible) {\n      return null;\n    }\n\n    const duration = propToArray(Number(this.asProps.duration));\n\n    /* `visible && innerVisible === null` - is a condition to start showing right after hover/focus  */\n    const showHint = (visible && innerVisible === null) || innerVisible === true;\n\n    return sstyled(styles)(\n      <Portal>\n        <SHintPopper\n          render={Box}\n          ref={this.hintRef}\n          aria-hidden={true}\n          role={undefined}\n          zIndex={parentZIndexStacking}\n          use:visible={showHint}\n          durationInitialize={`${duration[0]}ms`}\n          durationFinalize={`${duration[1]}ms`}\n          timingFunction={timingFunction}\n          keyframesInitialize={keyframes[`@${this.keyframesKey(calculatedPlacement)}-in`]}\n          keyframesFinalize={keyframes[`@${this.keyframesKey(calculatedPlacement)}-out`]}\n          use:data-ui-name='Hint'\n        >\n          <Children />\n        </SHintPopper>\n      </Portal>,\n    );\n  }\n}\n\nexport const Hint = createComponent<'div', SimpleHintPopperProps>(HintPopperRoot);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Hint.js","names":["computePosition","flip","offset","shift","createComponent","Root","sstyled","Component","lastInteraction","canUseDOM","getAccessibleName","cssVariableEnhance","zIndexStackingEnhance","React","Middleware","keyframes","_sstyled","insert","Box","Portal","styles","_sstyled2","enhances","variable","fallback","map","v","Number","parseInt","toString","prop","propToArray","Array","isArray","keyframesMap","Map","HintPopperRoot","constructor","props","_defineProperty","createRef","handleFocus","bind","handleBlur","handleMouseEnter","handleMouseLeave","handleKeyDown","state","innerVisible","visible","calculatedPlacement","placement","uncontrolledProps","componentDidMount","triggerRef","children","asProps","trigger","current","subscribe","componentWillUnmount","unsubscribe","componentDidUpdate","prevProps","requestAnimationFrame","showHint","hideHint","addEventListener","removeEventListener","node","mouseEvent","timeout","showTimeout","hideTimer","clearTimeout","showTimer","window","setTimeout","handlers","popperElement","hintRef","middleware","padding","verticalPlacement","startsWith","undefined","push","verticalCursorAnchoring","x","clientX","then","y","Object","assign","style","left","top","visibility","setState","hideTimeout","setProperty","e","target","HTMLElement","isKeyboard","key","stopPropagation","keyframesKey","has","get","keyframe","set","setTriggerAriaLabel","textContent","ariaLabel","label","setAttribute","render","_ref","_ref2","SHintPopper","Children","parentZIndexStacking","timingFunction","duration","createElement","cn","_assignProps","defaultVisible","Hint"],"sources":["../../../../src/components/hint/Hint.tsx"],"sourcesContent":["import { computePosition, flip, offset, shift, type Placement } from '@floating-ui/dom';\nimport { createComponent, Root, sstyled, Component, lastInteraction } from '@semcore/core';\nimport canUseDOM from '@semcore/core/lib/utils/canUseDOM';\nimport { getAccessibleName } from '@semcore/core/lib/utils/getAccessibleName';\nimport { cssVariableEnhance } from '@semcore/core/lib/utils/useCssVariable';\nimport { zIndexStackingEnhance } from '@semcore/core/lib/utils/zIndexStacking';\nimport type { DataType } from 'csstype';\nimport React from 'react';\n\nimport { Middleware } from './Middleware';\nimport keyframes from '../animation/style/keyframes.shadow.css';\nimport { Box } from '../flex-box';\nimport { Portal } from '../portal';\nimport styles from './style/hint.shadow.css';\n\ntype Handlers = {\n  visible: null;\n};\n\nexport type SimpleHintPopperProps = {\n  /** Ref to the trigger element */\n  triggerRef: React.RefObject<HTMLElement | null>;\n  /**\n   * The position of the popper relative to the trigger that called it.\n   * @default top\n   */\n  placement?: Placement;\n  /**\n   * Timer to show and hide the popper\n   * @default [500, 500]\n   */\n  timeout?: DefaultProps['timeout'];\n  /**\n   * Hint content.\n   * Better to use here some short text.\n   * */\n  children: React.ReactNode;\n\n  /** Popper visibility value */\n  visible?: boolean;\n  /** Default popper visibility\n   * @default false */\n  defaultVisible?: boolean;\n  /** Function called when visibility changes */\n  onVisibleChange?: (visible: boolean, e?: Event) => boolean | void;\n};\n\ntype DefaultProps = {\n  defaultVisible?: boolean;\n  timeout: number | [number, number];\n  timingFunction: DataType.EasingFunction;\n  placement?: Placement;\n};\n\ntype State = {\n  innerVisible: boolean | null;\n  calculatedPlacement?: Placement;\n};\n\nconst enhances = [\n  zIndexStackingEnhance('z-index-tooltip'),\n  cssVariableEnhance({\n    variable: '--intergalactic-duration-popper',\n    fallback: '200',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'duration',\n  }),\n  cssVariableEnhance({\n    variable: '--intergalactic-spacing-1x',\n    fallback: '4',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'offset',\n  }),\n  cssVariableEnhance({\n    variable: '--intergalactic-spacing-1x',\n    fallback: '4',\n    map: (v: string) => Number.parseInt(v, 10).toString(),\n    prop: 'padding',\n  }),\n] as const;\n\nfunction propToArray(prop: number | [number, number]): [number, number] {\n  return Array.isArray(prop) ? prop : [prop, prop];\n}\n\nconst keyframesMap = new Map<Placement, string>();\n\nclass HintPopperRoot extends Component<SimpleHintPopperProps, typeof enhances, Handlers, DefaultProps, State> {\n  public readonly hintRef = React.createRef<HTMLElement>();\n\n  static style = Object.assign(keyframes, styles);\n\n  private showTimer?: number;\n  private hideTimer?: number;\n\n  static enhance = enhances;\n\n  static defaultProps: DefaultProps = {\n    defaultVisible: false,\n    timeout: [500, 500],\n    timingFunction: 'ease-out',\n    placement: 'top',\n  };\n\n  constructor(props: SimpleHintPopperProps) {\n    super(props);\n\n    this.handleFocus = this.handleFocus.bind(this);\n    this.handleBlur = this.handleBlur.bind(this);\n    this.handleMouseEnter = this.handleMouseEnter.bind(this);\n    this.handleMouseLeave = this.handleMouseLeave.bind(this);\n    this.handleKeyDown = this.handleKeyDown.bind(this);\n\n    this.state = {\n      innerVisible: props.visible ?? null,\n      calculatedPlacement: props.placement,\n    };\n  }\n\n  uncontrolledProps() {\n    return {\n      visible: null,\n    };\n  }\n\n  componentDidMount() {\n    const { triggerRef, children } = this.asProps;\n    const trigger = triggerRef.current;\n\n    if (trigger && children) {\n      this.subscribe(trigger);\n    }\n  }\n\n  componentWillUnmount() {\n    const trigger = this.asProps.triggerRef.current;\n\n    if (trigger) {\n      this.unsubscribe(trigger);\n    }\n  }\n\n  componentDidUpdate(prevProps: SimpleHintPopperProps) {\n    if (prevProps.visible !== this.props.visible) {\n      requestAnimationFrame(() => {\n        const trigger = this.props.triggerRef.current;\n\n        if (this.props.visible && trigger) {\n          this.showHint(trigger);\n        } else {\n          this.hideHint();\n        }\n      });\n    }\n  }\n\n  private subscribe(trigger: HTMLElement) {\n    trigger.addEventListener('focus', this.handleFocus);\n    trigger.addEventListener('blur', this.handleBlur);\n    trigger.addEventListener('mouseenter', this.handleMouseEnter);\n    trigger.addEventListener('mouseleave', this.handleMouseLeave);\n    trigger.addEventListener('keydown', this.handleKeyDown);\n\n    if (this.asProps.visible) {\n      this.showHint(trigger);\n    }\n  }\n\n  private unsubscribe(trigger: HTMLElement) {\n    trigger.removeEventListener('focus', this.handleFocus);\n    trigger.removeEventListener('blur', this.handleBlur);\n    trigger.removeEventListener('mouseenter', this.handleMouseEnter);\n    trigger.removeEventListener('mouseleave', this.handleMouseLeave);\n    trigger.removeEventListener('keydown', this.handleKeyDown);\n\n    this.hideHint();\n  }\n\n  private showHint(node: HTMLElement, mouseEvent?: MouseEvent): void {\n    const { placement, timeout } = this.asProps;\n\n    const showTimeout = Array.isArray(timeout) ? timeout[0] : timeout;\n\n    if (this.hideTimer) {\n      clearTimeout(this.hideTimer);\n    }\n\n    this.showTimer = window.setTimeout(() => {\n      this.handlers.visible(true);\n\n      window.setTimeout(() => {\n        const popperElement = this.hintRef.current;\n        if (popperElement) {\n          const middleware = [\n            offset(Number(this.asProps.offset)),\n            flip(),\n            shift({ padding: Number(this.asProps.padding) }),\n          ];\n          const verticalPlacement = !placement || placement.startsWith('top') || placement.startsWith('bottom');\n          if (mouseEvent !== undefined && verticalPlacement) {\n            middleware.push(\n              Middleware.verticalCursorAnchoring({ x: mouseEvent.clientX }),\n              shift({ padding: Number(this.asProps.padding) }),\n            );\n          }\n\n          computePosition(node, popperElement, {\n            placement: placement,\n            middleware,\n          }).then(({ x, y, placement }) => {\n            Object.assign(popperElement.style, {\n              left: `${x}px`,\n              top: `${y}px`,\n            });\n            popperElement.style.visibility = 'visible';\n\n            this.setState({ innerVisible: true, calculatedPlacement: placement });\n          });\n        }\n      }, 10);\n    }, showTimeout);\n  }\n\n  private hideHint(): void {\n    const { timeout } = this.asProps;\n\n    const hideTimeout = Array.isArray(timeout) ? timeout[1] : timeout;\n\n    if (this.showTimer) {\n      clearTimeout(this.showTimer);\n    }\n\n    this.setState({ innerVisible: false });\n\n    this.hideTimer = window.setTimeout(() => {\n      this.hintRef.current?.style.setProperty('visibility', 'hidden');\n      this.handlers.visible(false);\n      this.setState({ innerVisible: null });\n    }, hideTimeout);\n  }\n\n  private handleFocus(e: FocusEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target && lastInteraction.isKeyboard()) {\n      this.showHint(e.target);\n    }\n  }\n\n  private handleBlur(e: FocusEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.hideHint();\n    }\n  }\n\n  private handleKeyDown(e: KeyboardEvent): void {\n    if (e.key === 'Escape' && e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target && this.state.innerVisible) {\n      e.stopPropagation();\n      this.hideHint();\n    }\n  }\n\n  private handleMouseEnter(e: MouseEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.showHint(e.target, e);\n    }\n  }\n\n  private handleMouseLeave(e: MouseEvent): void {\n    if (e.target instanceof HTMLElement && this.asProps.triggerRef.current === e.target) {\n      this.hideHint();\n    }\n  }\n\n  private keyframesKey(placement?: Placement) {\n    if (!placement) {\n      return 'opacity';\n    }\n\n    if (keyframesMap.has(placement)) {\n      return keyframesMap.get(placement)!;\n    }\n\n    let keyframe: string = 'opacity';\n\n    if (placement.startsWith('left')) keyframe = 'scale-left';\n    if (placement.startsWith('right')) keyframe = 'scale-right';\n    if (placement.startsWith('bottom')) keyframe = 'scale-bottom';\n    if (placement.startsWith('top')) keyframe = 'scale-top';\n\n    keyframesMap.set(placement, keyframe);\n\n    return keyframe;\n  }\n\n  private setTriggerAriaLabel() {\n    const { triggerRef, children } = this.asProps;\n\n    requestAnimationFrame(() => {\n      const trigger = triggerRef.current;\n\n      if (trigger) {\n        const textContent = trigger.textContent;\n        const ariaLabel = getAccessibleName(trigger);\n\n        if (!textContent && !ariaLabel) {\n          const label = (typeof children === 'string' || typeof children === 'number')\n            ? children.toString()\n            : (this.hintRef.current?.textContent ?? '');\n          triggerRef.current?.setAttribute('aria-label', label);\n        }\n      }\n    });\n  }\n\n  render() {\n    const SHintPopper = Root;\n    const { visible, Children, parentZIndexStacking, styles, timingFunction } = this.asProps;\n    const { innerVisible, calculatedPlacement } = this.state;\n\n    if (canUseDOM()) {\n      this.setTriggerAriaLabel();\n    }\n\n    if (!visible) {\n      return null;\n    }\n\n    const duration = propToArray(Number(this.asProps.duration));\n\n    /* `visible && innerVisible === null` - is a condition to start showing right after hover/focus  */\n    const showHint = (visible && innerVisible === null) || innerVisible === true;\n\n    return sstyled(styles)(\n      <Portal>\n        <SHintPopper\n          render={Box}\n          ref={this.hintRef}\n          aria-hidden={true}\n          role={undefined}\n          zIndex={parentZIndexStacking}\n          use:visible={showHint}\n          durationInitialize={`${duration[0]}ms`}\n          durationFinalize={`${duration[1]}ms`}\n          timingFunction={timingFunction}\n          keyframesInitialize={keyframes[`@${this.keyframesKey(calculatedPlacement)}-in`]}\n          keyframesFinalize={keyframes[`@${this.keyframesKey(calculatedPlacement)}-out`]}\n          use:data-ui-name='Hint'\n        >\n          <Children />\n        </SHintPopper>\n      </Portal>,\n    );\n  }\n}\n\nexport const Hint = createComponent<'div', SimpleHintPopperProps>(HintPopperRoot);\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/flex-box/Box/useBox.mjs

@@ -1,8 +1,8 @@
 import { sstyled } from "@semcore/core";
+import { removeUndefinedKeys, getAutoOrScaleIndent, getSize } from "@semcore/core/lib/utils/indentStyles";
 import propsForElement from "@semcore/core/lib/utils/propsForElement";
 import cn from "classnames";
 import React from "react";
-import { getAutoOrScaleIndent } from "../utils.mjs";
 /*!__reshadow-styles__:"../style/use-box.shadow.css"*/
 const style = (
   /*__reshadow_css_start__*/
@@ -22,25 +22,6 @@ const style = (
     "_invertOutline": "__invertOutline_1suvb_gg_"
   })
 );
-function removeUndefinedKeys(obj) {
-  return Object.entries(obj).reduce((acc, [key, value]) => {
-    if (value !== void 0) {
-      acc[key] = value;
-    }
-    return acc;
-  }, {});
-}
-function getSize(size) {
-  if (typeof size !== "number") {
-    return size;
-  }
-  if (size < 1) {
-    return `${100 * size}%`;
-  }
-  if (size >= 1) {
-    return `${size}px`;
-  }
-}
 function calculateIndentStyles(props, scaleIndent) {
   return removeUndefinedKeys({
     display: props["display"],
@@ -136,6 +117,5 @@ function useBox(props, ref) {
   }];
 }
 export {
-  useBox as default,
-  removeUndefinedKeys
+  useBox as default
 };

package/lib/esm/components/flex-box/Flex/useFlex.mjs

@@ -1,8 +1,8 @@
 import { sstyled } from "@semcore/core";
+import { removeUndefinedKeys, getAutoOrScaleIndent } from "@semcore/core/lib/utils/indentStyles";
 import cn from "classnames";
 import React from "react";
-import useBox, { removeUndefinedKeys } from "../Box/useBox.mjs";
-import { getAutoOrScaleIndent } from "../utils.mjs";
+import useBox from "../Box/useBox.mjs";
 /*!__reshadow-styles__:"../style/use-flex.shadow.css"*/
 const style = (
   /*__reshadow_css_start__*/

package/lib/esm/components/hint/Hint.mjs

@@ -109,8 +109,12 @@ class HintPopperRoot extends Component {
     };
   }
   componentDidMount() {
-    const trigger = this.asProps.triggerRef.current;
-    if (trigger) {
+    const {
+      triggerRef,
+      children
+    } = this.asProps;
+    const trigger = triggerRef.current;
+    if (trigger && children) {
       this.subscribe(trigger);
     }
   }

package/lib/esm/index.mjs

@@ -1,6 +1,6 @@
 import { defaultBreakpoints } from "./components/breakpoints/index.mjs";
 import { Col } from "./components/grid/index.mjs";
-import { removeUndefinedKeys, default as default2 } from "./components/flex-box/Box/useBox.mjs";
+import { default as default2 } from "./components/flex-box/Box/useBox.mjs";
 import { default as default3 } from "./components/flex-box/Flex/useFlex.mjs";
 import { default as default4 } from "./components/grid/Grid.mjs";
 import { default as default5, animationContext } from "./components/animation/Animation.mjs";
@@ -53,7 +53,6 @@ export {
   eventCalculate,
   hideScrollBarsFromScreenReadersContext,
   isInputTriggerTag,
-  removeUndefinedKeys,
   default2 as useBox,
   default3 as useFlex,
   useNeighborLocationDetect

package/lib/types/components/flex-box/Box/useBox.d.ts

@@ -1,7 +1,6 @@
 import { type UnknownProperties, type IStyledProps } from '@semcore/core';
 import type { Property } from 'csstype';
 import React from 'react';
-export declare function removeUndefinedKeys<T extends {}>(obj: T): any;
 export type BoxProps = IStyledProps & {
     /**
      * CSS `display` property

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/base-components",
   "description": "Semrush Base Components",
-  "version": "17.0.0-prerelease.27",
+  "version": "17.0.0-prerelease.30",
   "main": "lib/cjs/index.js",
   "module": "lib/esm/index.mjs",
   "typings": "lib/types/index.d.ts",
@@ -32,8 +32,8 @@
   },
   "devDependencies": {
     "@types/classnames": "2.2.6",
-    "@semcore/core": "17.0.0-prerelease.27",
-    "@semcore/testing-utils": "1.0.0"
+    "@semcore/testing-utils": "1.0.0",
+    "@semcore/core": "17.0.0-prerelease.30"
   },
   "scripts": {
     "build": "pnpm semcore-builder && pnpm vite build"

package/lib/cjs/components/flex-box/utils.js

@@ -1,20 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.getAutoOrScaleIndent = void 0;
-const getAutoOrScaleIndent = (indent, scaleIndent) => {
-  if (typeof indent === 'string') {
-    return indent;
-  }
-  if (typeof indent === 'number' && indent > -1 && indent < 1) {
-    return `${100 * indent}%`;
-  }
-  if (typeof indent === 'number' && (indent >= 1 || indent <= -1)) {
-    return `${indent * scaleIndent}px`;
-  }
-  return indent;
-};
-exports.getAutoOrScaleIndent = getAutoOrScaleIndent;
-//# sourceMappingURL=utils.js.map

package/lib/cjs/components/flex-box/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","names":["getAutoOrScaleIndent","indent","scaleIndent","exports"],"sources":["../../../../src/components/flex-box/utils.ts"],"sourcesContent":["export const getAutoOrScaleIndent = (indent: number | string | undefined, scaleIndent: number) => {\n  if (typeof indent === 'string') {\n    return indent;\n  }\n  if (typeof indent === 'number' && indent > -1 && indent < 1) {\n    return `${100 * indent}%`;\n  }\n  if (typeof indent === 'number' && (indent >= 1 || indent <= -1)) {\n    return `${indent * scaleIndent}px`;\n  }\n  return indent;\n};\n"],"mappings":";;;;;;AAAO,MAAMA,oBAAoB,GAAGA,CAACC,MAAmC,EAAEC,WAAmB,KAAK;EAChG,IAAI,OAAOD,MAAM,KAAK,QAAQ,EAAE;IAC9B,OAAOA,MAAM;EACf;EACA,IAAI,OAAOA,MAAM,KAAK,QAAQ,IAAIA,MAAM,GAAG,CAAC,CAAC,IAAIA,MAAM,GAAG,CAAC,EAAE;IAC3D,OAAO,GAAG,GAAG,GAAGA,MAAM,GAAG;EAC3B;EACA,IAAI,OAAOA,MAAM,KAAK,QAAQ,KAAKA,MAAM,IAAI,CAAC,IAAIA,MAAM,IAAI,CAAC,CAAC,CAAC,EAAE;IAC/D,OAAO,GAAGA,MAAM,GAAGC,WAAW,IAAI;EACpC;EACA,OAAOD,MAAM;AACf,CAAC;AAACE,OAAA,CAAAH,oBAAA,GAAAA,oBAAA","ignoreList":[]}

package/lib/es6/components/flex-box/utils.js

@@ -1,13 +0,0 @@
-export const getAutoOrScaleIndent = (indent, scaleIndent) => {
-  if (typeof indent === 'string') {
-    return indent;
-  }
-  if (typeof indent === 'number' && indent > -1 && indent < 1) {
-    return `${100 * indent}%`;
-  }
-  if (typeof indent === 'number' && (indent >= 1 || indent <= -1)) {
-    return `${indent * scaleIndent}px`;
-  }
-  return indent;
-};
-//# sourceMappingURL=utils.js.map

package/lib/es6/components/flex-box/utils.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"utils.js","names":["getAutoOrScaleIndent","indent","scaleIndent"],"sources":["../../../../src/components/flex-box/utils.ts"],"sourcesContent":["export const getAutoOrScaleIndent = (indent: number | string | undefined, scaleIndent: number) => {\n  if (typeof indent === 'string') {\n    return indent;\n  }\n  if (typeof indent === 'number' && indent > -1 && indent < 1) {\n    return `${100 * indent}%`;\n  }\n  if (typeof indent === 'number' && (indent >= 1 || indent <= -1)) {\n    return `${indent * scaleIndent}px`;\n  }\n  return indent;\n};\n"],"mappings":"AAAA,OAAO,MAAMA,oBAAoB,GAAGA,CAACC,MAAmC,EAAEC,WAAmB,KAAK;EAChG,IAAI,OAAOD,MAAM,KAAK,QAAQ,EAAE;IAC9B,OAAOA,MAAM;EACf;EACA,IAAI,OAAOA,MAAM,KAAK,QAAQ,IAAIA,MAAM,GAAG,CAAC,CAAC,IAAIA,MAAM,GAAG,CAAC,EAAE;IAC3D,OAAO,GAAG,GAAG,GAAGA,MAAM,GAAG;EAC3B;EACA,IAAI,OAAOA,MAAM,KAAK,QAAQ,KAAKA,MAAM,IAAI,CAAC,IAAIA,MAAM,IAAI,CAAC,CAAC,CAAC,EAAE;IAC/D,OAAO,GAAGA,MAAM,GAAGC,WAAW,IAAI;EACpC;EACA,OAAOD,MAAM;AACf,CAAC","ignoreList":[]}

package/lib/esm/components/flex-box/utils.mjs

@@ -1,15 +0,0 @@
-const getAutoOrScaleIndent = (indent, scaleIndent) => {
-  if (typeof indent === "string") {
-    return indent;
-  }
-  if (typeof indent === "number" && indent > -1 && indent < 1) {
-    return `${100 * indent}%`;
-  }
-  if (typeof indent === "number" && (indent >= 1 || indent <= -1)) {
-    return `${indent * scaleIndent}px`;
-  }
-  return indent;
-};
-export {
-  getAutoOrScaleIndent
-};

package/lib/types/components/flex-box/utils.d.ts

@@ -1 +0,0 @@
-export declare const getAutoOrScaleIndent: (indent: number | string | undefined, scaleIndent: number) => string | number | undefined;