npm - @vibe/core - Versions diffs - 3.58.1 → 3.58.2 - Mend

@vibe/core 3.58.1 → 3.58.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1554) hide show

package/dist/mocked_classnames/src/components/SplitButton/SplitButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SplitButton.js","sources":["../../../../../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading /\nimport { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\n// Libraries import\nimport React, { ReactElement, useCallback, useMemo, useRef, useState } from \"react\";\n// Constants import\nimport {\n DEFAULT_DIALOG_HIDE_TRIGGER,\n DEFAULT_DIALOG_SHOW_TRIGGER,\n DIALOG_MOVE_BY,\n ENTER_KEYS,\n SECONDARY_BUTTON_ARIA_LABEL,\n SECONDARY_BUTTON_WRAPPER_CLASSNAME,\n SplitButtonSecondaryContentPosition,\n SplitButtonSecondaryContentPositionType\n} from \"./SplitButtonConstants\";\nimport { withStaticPropsWithoutForwardRef } from \"../../types\";\nimport { AnimationType, DialogPosition, HideShowEvent } from \"../Dialog/DialogConstants\";\n// Utils import\nimport { NOOP } from \"../../utils/function-utils\";\nimport { isInsideClass } from \"../../utils/dom-utils\";\n// Hooks import\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport useEventListener from \"../../hooks/useEventListener\";\n// Components import\nimport Button, { ButtonProps } from \"../Button/Button\";\nimport Dialog, { DialogEvent } from \"../Dialog/Dialog\";\nimport { DropdownChevronDown } from \"@vibe/icons\";\nimport DialogContentContainer from \"../DialogContentContainer/DialogContentContainer\";\nimport styles from \"./SplitButton.module.scss\";\nimport { DialogSize, DialogTriggerEvent } from \"../Dialog\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface SplitButtonProps extends ButtonProps {\n /\n The element or renderer that is displayed inside the dialog opened by clicking the secondary button.\n /\n secondaryDialogContent?: ReactElement \| (() => string \| ReactElement);\n /\n Callback fired when the secondary dialog is shown.\n /\n onSecondaryDialogDidShow?: () => void;\n /\n Callback fired when the secondary dialog is hidden.\n /\n onSecondaryDialogDidHide?: () => void;\n /\n The z-index applied to the secondary dialog.\n /\n zIndex?: number;\n /\n Class name applied to the wrapper of the secondary dialog.\n /\n secondaryDialogClassName?: string;\n /\n The position of the secondary dialog.\n /\n secondaryDialogPosition?: SplitButtonSecondaryContentPositionType;\n /\n The padding size inside the secondary dialog.\n /\n dialogPaddingSize?: DialogSize;\n /\n The CSS selector of the container where the dialog should be rendered.\n /\n dialogContainerSelector?: string;\n /\n If true, clicking inside the dialog will close it.\n /\n shouldCloseOnClickInsideDialog?: boolean;\n}\n\nconst SplitButton = ({\n secondaryDialogContent,\n onSecondaryDialogDidShow = NOOP,\n onSecondaryDialogDidHide = NOOP,\n shouldCloseOnClickInsideDialog,\n zIndex = null,\n secondaryDialogClassName = \"\",\n secondaryDialogPosition = \"bottom-start\",\n dialogContainerSelector,\n dialogPaddingSize = \"medium\",\n disabled,\n // success mode not working right now, need to fix it in different pr\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n success,\n loading,\n kind = \"primary\",\n color = \"primary\",\n className,\n leftIcon,\n rightIcon,\n onClick,\n children,\n marginLeft,\n marginRight,\n active,\n id,\n \"data-testid\": dataTestId,\n ...buttonProps\n}: SplitButtonProps) => {\n // State //\n const [isDialogOpen, setDialogOpen] = useState(false);\n const [isHovered, setIsHover] = useState(false);\n const [isActive, setIsActive] = useState(false);\n\n // Refs //\n const ref = useRef(null);\n const secondaryButtonRef = useRef(null);\n\n // Callbacks //\n const setHovered = useCallback(() => setIsHover(true), [setIsHover]);\n const setNotHovered = useCallback(() => setIsHover(false), [setIsHover]);\n\n const shouldSetActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (disabled) return false;\n return !isInsideClass(e.target as HTMLElement, SECONDARY_BUTTON_WRAPPER_CLASSNAME);\n },\n [disabled]\n );\n\n const setActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n const setNotActive = useCallback(() => setIsActive(false), [setIsActive]);\n const setActiveOnEnter = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n\n const showDialog = useCallback(() => {\n setDialogOpen(true);\n onSecondaryDialogDidShow();\n }, [setDialogOpen, onSecondaryDialogDidShow]);\n\n const hideDialog = useCallback(\n (_: DialogEvent, eventName: DialogTriggerEvent) => {\n setDialogOpen(false);\n onSecondaryDialogDidHide();\n if (eventName === \"esckey\") {\n secondaryButtonRef.current.focus();\n }\n },\n [setDialogOpen, onSecondaryDialogDidHide]\n );\n\n // Event listeners //\n\n // Used to set both buttons as hovered no matter what button was hovered\n useEventListener({ eventName: \"mouseenter\", callback: setHovered, ref });\n useEventListener({ eventName: \"mouseleave\", callback: setNotHovered, ref });\n\n useEventListener({ eventName: \"mousedown\", callback: setActive, ref });\n useEventListener({ eventName: \"mouseup\", callback: setNotActive, ref });\n\n // Used to finish active transition if clicked on enter\n useEventListener({ eventName: \"transitionend\", callback: setNotActive, ref });\n\n // Key events\n useKeyEvent({ keys: ENTER_KEYS, ref, callback: setActiveOnEnter });\n\n const classNames = useMemo(\n () =>\n cx(\n styles.button,\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.mainActive]: active,\n [styles.active]: isActive,\n [styles.splitContentOpen]: isDialogOpen,\n [styles.hovered]: isHovered,\n [styles.disabled]: disabled\n },\n className\n ),\n [className, kind, color, active, isActive, isDialogOpen, isHovered, disabled]\n );\n\n const dialogShowTrigger = useMemo(() => (disabled ? [] : DEFAULT_DIALOG_SHOW_TRIGGER), [disabled]);\n\n const dialogHideTrigger = useMemo(() => {\n if (shouldCloseOnClickInsideDialog) return [...DEFAULT_DIALOG_HIDE_TRIGGER, HideShowEvent.CONTENT_CLICK];\n return DEFAULT_DIALOG_HIDE_TRIGGER;\n }, [shouldCloseOnClickInsideDialog]);\n\n const actionsContent = useCallback(() => {\n const content = typeof secondaryDialogContent === \"function\" ? secondaryDialogContent() : secondaryDialogContent;\n return (\n <DialogContentContainer type={DialogContentContainer.types.POPOVER} size={dialogPaddingSize}>\n {content}\n </DialogContentContainer>\n );\n }, [secondaryDialogContent, dialogPaddingSize]);\n\n const animationEdgePosition = useMemo(() => {\n if (secondaryDialogPosition === \"bottom\") {\n return \"\";\n }\n if (secondaryDialogPosition === \"bottom-start\") {\n return \"bottom\";\n }\n\n return \"top\";\n }, [secondaryDialogPosition]);\n\n return (\n <div\n className={classNames}\n ref={ref}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.SPLIT_BUTTON, id)}\n data-vibe={ComponentVibeId.SPLIT_BUTTON}\n >\n <Button\n {\n ...buttonProps / We are enriching button with other props so we must use spreading */\n }\n preventClickAnimation\n leftIcon={leftIcon}\n rightIcon={rightIcon}\n rightFlat\n color={color}\n kind={kind}\n active={active}\n onClick={onClick}\n className={styles.mainButton}\n marginLeft={marginLeft}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n loading={loading}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_PRIMARY_BUTTON, id)}\n >\n {children}\n </Button>\n <div className={styles.secondaryButtonWrapper}>\n <Dialog\n wrapperClassName={secondaryDialogClassName}\n zIndex={zIndex}\n content={actionsContent}\n position={secondaryDialogPosition as DialogPosition}\n containerSelector={dialogContainerSelector}\n startingEdge={animationEdgePosition}\n animationType={AnimationType.EXPAND}\n moveBy={DIALOG_MOVE_BY}\n onDialogDidShow={showDialog}\n onDialogDidHide={hideDialog}\n showTrigger={dialogShowTrigger}\n hideTrigger={dialogHideTrigger}\n >\n <Button\n {...buttonProps}\n ref={secondaryButtonRef}\n preventClickAnimation\n leftFlat\n noSidePadding\n color={color}\n kind={kind}\n className={styles.secondaryButton}\n active={isDialogOpen}\n marginRight={marginRight}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n ariaLabel={SECONDARY_BUTTON_ARIA_LABEL}\n ariaHasPopup\n ariaExpanded={isDialogOpen}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_SECONDARY_BUTTON, id)}\n >\n <div className={styles.secondaryButtonIconWrapper}>\n <DropdownChevronDown aria-hidden=\"true\" />\n </div>\n </Button>\n </Dialog>\n </div>\n </div>\n );\n};\n\ninterface SplitButtonStaticProps {\n secondaryPositions: typeof SplitButtonSecondaryContentPosition;\n secondaryDialogPositions: typeof SplitButtonSecondaryContentPosition;\n sizes: typeof Button.sizes;\n colors: typeof Button.colors;\n kinds: typeof Button.kinds;\n inputTags: typeof Button.inputTags;\n dialogPaddingSizes: typeof DialogContentContainer.sizes;\n}\n\nexport default withStaticPropsWithoutForwardRef<SplitButtonProps, SplitButtonStaticProps>(SplitButton, {\n secondaryPositions: SplitButtonSecondaryContentPosition,\n secondaryDialogPositions: SplitButtonSecondaryContentPosition,\n sizes: Button.sizes,\n colors: Button.colors,\n kinds: Button.kinds,\n inputTags: Button.inputTags,\n dialogPaddingSizes: DialogContentContainer.sizes\n});\n"],"names":["withStaticPropsWithoutForwardRef","_a","secondaryDialogContent","_a$onSecondaryDialogD","onSecondaryDialogDidShow","NOOP","_a$onSecondaryDialogD2","onSecondaryDialogDidHide","shouldCloseOnClickInsideDialog","_a$zIndex","zIndex","_a$secondaryDialogCla","secondaryDialogClassName","_a$secondaryDialogPos","secondaryDialogPosition","dialogContainerSelector","_a$dialogPaddingSize","dialogPaddingSize","disabled","loading","_a$kind","kind","_a$color","color","className","leftIcon","rightIcon","onClick","children","marginLeft","marginRight","active","id","dataTestId","buttonProps","__rest","_useState","useState","_useState2","_slicedToArray","isDialogOpen","setDialogOpen","_useState3","_useState4","isHovered","setIsHover","_useState5","_useState6","isActive","setIsActive","ref","useRef","secondaryButtonRef","setHovered","useCallback","setNotHovered","shouldSetActive","e","isInsideClass","target","SECONDARY_BUTTON_WRAPPER_CLASSNAME","setActive","setNotActive","setActiveOnEnter","showDialog","hideDialog","_","eventName","current","focus","useEventListener","callback","useKeyEvent","keys","ENTER_KEYS","classNames","useMemo","cx","styles","button","getStyle","camelCase","_defineProperty","mainActive","splitContentOpen","hovered","dialogShowTrigger","DEFAULT_DIALOG_SHOW_TRIGGER","dialogHideTrigger","concat","_toConsumableArray","DEFAULT_DIALOG_HIDE_TRIGGER","HideShowEvent","CONTENT_CLICK","actionsContent","content","React","createElement","DialogContentContainer","type","types","POPOVER","size","animationEdgePosition","getTestId","ComponentDefaultTestId","SPLIT_BUTTON","ComponentVibeId","Button","Object","assign","preventClickAnimation","rightFlat","mainButton","onFocus","onBlur","SPLIT_BUTTON_PRIMARY_BUTTON","secondaryButtonWrapper","Dialog","wrapperClassName","position","containerSelector","startingEdge","animationType","AnimationType","EXPAND","moveBy","DIALOG_MOVE_BY","onDialogDidShow","onDialogDidHide","showTrigger","hideTrigger","leftFlat","noSidePadding","secondaryButton","ariaLabel","SECONDARY_BUTTON_ARIA_LABEL","ariaHasPopup","ariaExpanded","SPLIT_BUTTON_SECONDARY_BUTTON","secondaryButtonIconWrapper","DropdownChevronDown","secondaryPositions","SplitButtonSecondaryContentPosition","secondaryDialogPositions","sizes","colors","kinds","inputTags","dialogPaddingSizes"],"mappings":"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"}
1	+ {"version":3,"file":"SplitButton.js","sources":["../../../../../src/components/SplitButton/SplitButton.tsx"],"sourcesContent":["/* eslint-disable react/jsx-props-no-spreading /\nimport { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport cx from \"classnames\";\n// Libraries import\nimport React, { type ReactElement, useCallback, useMemo, useRef, useState } from \"react\";\n// Constants import\nimport {\n DEFAULT_DIALOG_HIDE_TRIGGER,\n DEFAULT_DIALOG_SHOW_TRIGGER,\n DIALOG_MOVE_BY,\n ENTER_KEYS,\n SECONDARY_BUTTON_ARIA_LABEL,\n SECONDARY_BUTTON_WRAPPER_CLASSNAME,\n SplitButtonSecondaryContentPosition,\n type SplitButtonSecondaryContentPositionType\n} from \"./SplitButtonConstants\";\nimport { withStaticPropsWithoutForwardRef } from \"../../types\";\nimport { AnimationType, type DialogPosition, HideShowEvent } from \"../Dialog/DialogConstants\";\n// Utils import\nimport { NOOP } from \"../../utils/function-utils\";\nimport { isInsideClass } from \"../../utils/dom-utils\";\n// Hooks import\nimport useKeyEvent from \"../../hooks/useKeyEvent\";\nimport useEventListener from \"../../hooks/useEventListener\";\n// Components import\nimport Button, { type ButtonProps } from \"../Button/Button\";\nimport Dialog, { type DialogEvent } from \"../Dialog/Dialog\";\nimport { DropdownChevronDown } from \"@vibe/icons\";\nimport DialogContentContainer from \"../DialogContentContainer/DialogContentContainer\";\nimport styles from \"./SplitButton.module.scss\";\nimport { type DialogSize, type DialogTriggerEvent } from \"../Dialog\";\nimport { ComponentVibeId } from \"../../tests/constants\";\n\nexport interface SplitButtonProps extends ButtonProps {\n /\n The element or renderer that is displayed inside the dialog opened by clicking the secondary button.\n /\n secondaryDialogContent?: ReactElement \| (() => string \| ReactElement);\n /\n Callback fired when the secondary dialog is shown.\n /\n onSecondaryDialogDidShow?: () => void;\n /\n Callback fired when the secondary dialog is hidden.\n /\n onSecondaryDialogDidHide?: () => void;\n /\n The z-index applied to the secondary dialog.\n /\n zIndex?: number;\n /\n Class name applied to the wrapper of the secondary dialog.\n /\n secondaryDialogClassName?: string;\n /\n The position of the secondary dialog.\n /\n secondaryDialogPosition?: SplitButtonSecondaryContentPositionType;\n /\n The padding size inside the secondary dialog.\n /\n dialogPaddingSize?: DialogSize;\n /\n The CSS selector of the container where the dialog should be rendered.\n /\n dialogContainerSelector?: string;\n /\n If true, clicking inside the dialog will close it.\n /\n shouldCloseOnClickInsideDialog?: boolean;\n}\n\nconst SplitButton = ({\n secondaryDialogContent,\n onSecondaryDialogDidShow = NOOP,\n onSecondaryDialogDidHide = NOOP,\n shouldCloseOnClickInsideDialog,\n zIndex = null,\n secondaryDialogClassName = \"\",\n secondaryDialogPosition = \"bottom-start\",\n dialogContainerSelector,\n dialogPaddingSize = \"medium\",\n disabled,\n // success mode not working right now, need to fix it in different pr\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n success,\n loading,\n kind = \"primary\",\n color = \"primary\",\n className,\n leftIcon,\n rightIcon,\n onClick,\n children,\n marginLeft,\n marginRight,\n active,\n id,\n \"data-testid\": dataTestId,\n ...buttonProps\n}: SplitButtonProps) => {\n // State //\n const [isDialogOpen, setDialogOpen] = useState(false);\n const [isHovered, setIsHover] = useState(false);\n const [isActive, setIsActive] = useState(false);\n\n // Refs //\n const ref = useRef(null);\n const secondaryButtonRef = useRef(null);\n\n // Callbacks //\n const setHovered = useCallback(() => setIsHover(true), [setIsHover]);\n const setNotHovered = useCallback(() => setIsHover(false), [setIsHover]);\n\n const shouldSetActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (disabled) return false;\n return !isInsideClass(e.target as HTMLElement, SECONDARY_BUTTON_WRAPPER_CLASSNAME);\n },\n [disabled]\n );\n\n const setActive = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n const setNotActive = useCallback(() => setIsActive(false), [setIsActive]);\n const setActiveOnEnter = useCallback(\n (e: React.KeyboardEvent<HTMLElement>) => {\n if (!shouldSetActive(e)) return;\n setIsActive(true);\n },\n [setIsActive, shouldSetActive]\n );\n\n const showDialog = useCallback(() => {\n setDialogOpen(true);\n onSecondaryDialogDidShow();\n }, [setDialogOpen, onSecondaryDialogDidShow]);\n\n const hideDialog = useCallback(\n (_: DialogEvent, eventName: DialogTriggerEvent) => {\n setDialogOpen(false);\n onSecondaryDialogDidHide();\n if (eventName === \"esckey\") {\n secondaryButtonRef.current.focus();\n }\n },\n [setDialogOpen, onSecondaryDialogDidHide]\n );\n\n // Event listeners //\n\n // Used to set both buttons as hovered no matter what button was hovered\n useEventListener({ eventName: \"mouseenter\", callback: setHovered, ref });\n useEventListener({ eventName: \"mouseleave\", callback: setNotHovered, ref });\n\n useEventListener({ eventName: \"mousedown\", callback: setActive, ref });\n useEventListener({ eventName: \"mouseup\", callback: setNotActive, ref });\n\n // Used to finish active transition if clicked on enter\n useEventListener({ eventName: \"transitionend\", callback: setNotActive, ref });\n\n // Key events\n useKeyEvent({ keys: ENTER_KEYS, ref, callback: setActiveOnEnter });\n\n const classNames = useMemo(\n () =>\n cx(\n styles.button,\n getStyle(styles, camelCase(\"kind-\" + kind)),\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.mainActive]: active,\n [styles.active]: isActive,\n [styles.splitContentOpen]: isDialogOpen,\n [styles.hovered]: isHovered,\n [styles.disabled]: disabled\n },\n className\n ),\n [className, kind, color, active, isActive, isDialogOpen, isHovered, disabled]\n );\n\n const dialogShowTrigger = useMemo(() => (disabled ? [] : DEFAULT_DIALOG_SHOW_TRIGGER), [disabled]);\n\n const dialogHideTrigger = useMemo(() => {\n if (shouldCloseOnClickInsideDialog) return [...DEFAULT_DIALOG_HIDE_TRIGGER, HideShowEvent.CONTENT_CLICK];\n return DEFAULT_DIALOG_HIDE_TRIGGER;\n }, [shouldCloseOnClickInsideDialog]);\n\n const actionsContent = useCallback(() => {\n const content = typeof secondaryDialogContent === \"function\" ? secondaryDialogContent() : secondaryDialogContent;\n return (\n <DialogContentContainer type={DialogContentContainer.types.POPOVER} size={dialogPaddingSize}>\n {content}\n </DialogContentContainer>\n );\n }, [secondaryDialogContent, dialogPaddingSize]);\n\n const animationEdgePosition = useMemo(() => {\n if (secondaryDialogPosition === \"bottom\") {\n return \"\";\n }\n if (secondaryDialogPosition === \"bottom-start\") {\n return \"bottom\";\n }\n\n return \"top\";\n }, [secondaryDialogPosition]);\n\n return (\n <div\n className={classNames}\n ref={ref}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.SPLIT_BUTTON, id)}\n data-vibe={ComponentVibeId.SPLIT_BUTTON}\n >\n <Button\n {\n ...buttonProps / We are enriching button with other props so we must use spreading */\n }\n preventClickAnimation\n leftIcon={leftIcon}\n rightIcon={rightIcon}\n rightFlat\n color={color}\n kind={kind}\n active={active}\n onClick={onClick}\n className={styles.mainButton}\n marginLeft={marginLeft}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n loading={loading}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_PRIMARY_BUTTON, id)}\n >\n {children}\n </Button>\n <div className={styles.secondaryButtonWrapper}>\n <Dialog\n wrapperClassName={secondaryDialogClassName}\n zIndex={zIndex}\n content={actionsContent}\n position={secondaryDialogPosition as DialogPosition}\n containerSelector={dialogContainerSelector}\n startingEdge={animationEdgePosition}\n animationType={AnimationType.EXPAND}\n moveBy={DIALOG_MOVE_BY}\n onDialogDidShow={showDialog}\n onDialogDidHide={hideDialog}\n showTrigger={dialogShowTrigger}\n hideTrigger={dialogHideTrigger}\n >\n <Button\n {...buttonProps}\n ref={secondaryButtonRef}\n preventClickAnimation\n leftFlat\n noSidePadding\n color={color}\n kind={kind}\n className={styles.secondaryButton}\n active={isDialogOpen}\n marginRight={marginRight}\n onFocus={setHovered}\n onBlur={setNotHovered}\n disabled={disabled}\n ariaLabel={SECONDARY_BUTTON_ARIA_LABEL}\n ariaHasPopup\n ariaExpanded={isDialogOpen}\n data-testid={getTestId(ComponentDefaultTestId.SPLIT_BUTTON_SECONDARY_BUTTON, id)}\n >\n <div className={styles.secondaryButtonIconWrapper}>\n <DropdownChevronDown aria-hidden=\"true\" />\n </div>\n </Button>\n </Dialog>\n </div>\n </div>\n );\n};\n\ninterface SplitButtonStaticProps {\n secondaryPositions: typeof SplitButtonSecondaryContentPosition;\n secondaryDialogPositions: typeof SplitButtonSecondaryContentPosition;\n sizes: typeof Button.sizes;\n colors: typeof Button.colors;\n kinds: typeof Button.kinds;\n inputTags: typeof Button.inputTags;\n dialogPaddingSizes: typeof DialogContentContainer.sizes;\n}\n\nexport default withStaticPropsWithoutForwardRef<SplitButtonProps, SplitButtonStaticProps>(SplitButton, {\n secondaryPositions: SplitButtonSecondaryContentPosition,\n secondaryDialogPositions: SplitButtonSecondaryContentPosition,\n sizes: Button.sizes,\n colors: Button.colors,\n kinds: Button.kinds,\n inputTags: Button.inputTags,\n dialogPaddingSizes: DialogContentContainer.sizes\n});\n"],"names":["withStaticPropsWithoutForwardRef","_a","secondaryDialogContent","_a$onSecondaryDialogD","onSecondaryDialogDidShow","NOOP","_a$onSecondaryDialogD2","onSecondaryDialogDidHide","shouldCloseOnClickInsideDialog","_a$zIndex","zIndex","_a$secondaryDialogCla","secondaryDialogClassName","_a$secondaryDialogPos","secondaryDialogPosition","dialogContainerSelector","_a$dialogPaddingSize","dialogPaddingSize","disabled","loading","_a$kind","kind","_a$color","color","className","leftIcon","rightIcon","onClick","children","marginLeft","marginRight","active","id","dataTestId","buttonProps","__rest","_useState","useState","_useState2","_slicedToArray","isDialogOpen","setDialogOpen","_useState3","_useState4","isHovered","setIsHover","_useState5","_useState6","isActive","setIsActive","ref","useRef","secondaryButtonRef","setHovered","useCallback","setNotHovered","shouldSetActive","e","isInsideClass","target","SECONDARY_BUTTON_WRAPPER_CLASSNAME","setActive","setNotActive","setActiveOnEnter","showDialog","hideDialog","_","eventName","current","focus","useEventListener","callback","useKeyEvent","keys","ENTER_KEYS","classNames","useMemo","cx","styles","button","getStyle","camelCase","_defineProperty","mainActive","splitContentOpen","hovered","dialogShowTrigger","DEFAULT_DIALOG_SHOW_TRIGGER","dialogHideTrigger","concat","_toConsumableArray","DEFAULT_DIALOG_HIDE_TRIGGER","HideShowEvent","CONTENT_CLICK","actionsContent","content","React","createElement","DialogContentContainer","type","types","POPOVER","size","animationEdgePosition","getTestId","ComponentDefaultTestId","SPLIT_BUTTON","ComponentVibeId","Button","Object","assign","preventClickAnimation","rightFlat","mainButton","onFocus","onBlur","SPLIT_BUTTON_PRIMARY_BUTTON","secondaryButtonWrapper","Dialog","wrapperClassName","position","containerSelector","startingEdge","animationType","AnimationType","EXPAND","moveBy","DIALOG_MOVE_BY","onDialogDidShow","onDialogDidHide","showTrigger","hideTrigger","leftFlat","noSidePadding","secondaryButton","ariaLabel","SECONDARY_BUTTON_ARIA_LABEL","ariaHasPopup","ariaExpanded","SPLIT_BUTTON_SECONDARY_BUTTON","secondaryButtonIconWrapper","DropdownChevronDown","secondaryPositions","SplitButtonSecondaryContentPosition","secondaryDialogPositions","sizes","colors","kinds","inputTags","dialogPaddingSizes"],"mappings":"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"}

package/dist/mocked_classnames/src/components/SplitButton/SplitButton.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={button:"button",mainButton:"mainButton",secondaryButton:"secondaryButton",secondaryButtonWrapper:"secondaryButtonWrapper",secondaryButtonIconWrapper:"secondaryButtonIconWrapper",active:"active",disabled:"disabled",kindTertiary:"kindTertiary",colorPrimary:"colorPrimary",mainActive:"mainActive",splitContentOpen:"splitContentOpen",hovered:"hovered",colorBrand:"colorBrand",colorPositive:"colorPositive",colorNegative:"colorNegative",kindPrimary:"kindPrimary",colorOnPrimaryColor:"colorOnPrimaryColor",kindSecondary:"kindSecondary"};!function(n){const r="s_id-b26d62194c18_3_58_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+r))return;const e=document.createElement("style");e.id=r,o.firstChild?o.insertBefore(e,o.firstChild):o.appendChild(e),e.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=n)}(".button {\n  display: inline-flex;\n  border-radius: var(--border-radius-small);\n  transition: var(--motion-productive-short) transform, var(--motion-productive-medium) var(--motion-timing-transition) min-width;\n}\n\n.button .mainButton {\n  margin-right: 0;\n}\n\n.button .secondaryButton {\n  margin-left: 0;\n}\n\n.secondaryButtonWrapper .secondaryButtonIconWrapper {\n  display: inline-flex;\n  padding: 0 4px;\n}\n\n.active {\n  transform: scale(0.95);\n}\n\n.disabled {\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n.kindTertiary.colorPrimary.mainActive .mainButton {\n  background-color: var(--primary-selected-color);\n}\n\n.kindTertiary.colorPrimary.mainActive .mainButton:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n\n.kindTertiary.colorPrimary.mainActive .secondaryButton {\n  background-color: var(--primary-selected-color);\n}\n\n.kindTertiary.colorPrimary.mainActive .secondaryButton:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n\n.kindTertiary.colorPrimary.mainActive.splitContentOpen.splitContentOpen .secondaryButton,\n.kindTertiary.colorPrimary.mainActive.splitContentOpen.splitContentOpen .secondaryButton:hover,\n.kindTertiary.colorPrimary.mainActive.hovered.splitContentOpen .secondaryButton,\n.kindTertiary.colorPrimary.mainActive.hovered.splitContentOpen .secondaryButton:hover {\n  color: var(--primary-color);\n}\n\n.kindTertiary.colorBrand.mainActive .mainButton {\n  background-color: var(--brand-selected-color);\n}\n\n.kindTertiary.colorBrand.mainActive .secondaryButton {\n  background-color: var(--brand-selected-color);\n}\n\n.kindTertiary.colorBrand.mainActive.splitContentOpen.splitContentOpen .secondaryButton,\n.kindTertiary.colorBrand.mainActive.splitContentOpen.splitContentOpen .secondaryButton:hover,\n.kindTertiary.colorBrand.mainActive.hovered.splitContentOpen .secondaryButton,\n.kindTertiary.colorBrand.mainActive.hovered.splitContentOpen .secondaryButton:hover {\n  color: var(--brand-color);\n}\n\n.kindTertiary.colorPositive.splitContentOpen .secondaryButton,\n.kindTertiary.colorPositive:hover .secondaryButton,\n.kindTertiary.colorPositive:focus .secondaryButton {\n  border-color: transparent;\n  background-color: var(--positive-color-selected);\n}\n\n.kindTertiary.colorPositive.splitContentOpen .mainButton,\n.kindTertiary.colorPositive:hover .mainButton,\n.kindTertiary.colorPositive:focus .mainButton {\n  background-color: var(--positive-color-selected);\n}\n\n.kindTertiary.colorNegative.splitContentOpen .secondaryButton,\n.kindTertiary.colorNegative:hover .secondaryButton,\n.kindTertiary.colorNegative:focus .secondaryButton {\n  border-color: transparent;\n  background-color: var(--negative-color-selected);\n}\n\n.kindTertiary.colorNegative.splitContentOpen .mainButton,\n.kindTertiary.colorNegative:hover .mainButton,\n.kindTertiary.colorNegative:focus .mainButton {\n  background-color: var(--negative-color-selected);\n}\n\n.kindTertiary .secondaryButton {\n  border-left: 1px solid transparent;\n  margin-left: 1px;\n}\n\n.kindPrimary.disabled .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--ui-border-color);\n}\n\n.kindPrimary:not(.disabled).colorPrimary.mainActive .secondaryButton {\n  background-color: var(--primary-hover-color);\n  border-color: var(--text-color-on-primary);\n}\n\n.kindPrimary:not(.disabled).colorPrimary .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--primary-hover-color);\n}\n\n.kindPrimary:not(.disabled).colorBrand.mainActive .secondaryButton {\n  background-color: var(--brand-hover-color);\n  border-color: var(--text-color-on-primary);\n}\n\n.kindPrimary:not(.disabled).colorBrand .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--brand-hover-color);\n}\n\n.kindPrimary:not(.disabled).colorPositive .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--positive-color-hover);\n}\n\n.kindPrimary:not(.disabled).colorNegative .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--negative-color-hover);\n}\n\n.kindPrimary:not(.disabled).colorOnPrimaryColor .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--color-ui_grey);\n}\n\n.kindSecondary .mainButton {\n  border-right: none;\n}\n\n.kindSecondary.colorPrimary.mainActive .mainButton {\n  background-color: var(--primary-selected-color);\n}\n\n.kindSecondary.colorPrimary.mainActive .mainButton:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n\n.kindSecondary.colorPrimary.mainActive .secondaryButton {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n\n.kindSecondary.colorPrimary.splitContentOpen .secondaryButton {\n  color: var(--primary-color);\n  border-color: var(--primary-color);\n  background-color: var(--primary-selected-color);\n}\n\n.kindSecondary.colorPrimary.splitContentOpen .secondaryButton:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n\n.kindSecondary.colorBrand.mainActive .mainButton {\n  background-color: var(--brand-selected-color);\n}\n\n.kindSecondary.colorBrand.mainActive .secondaryButton {\n  background-color: var(--brand-selected-color);\n  border-color: var(--brand-color);\n}\n\n.kindSecondary.colorBrand.splitContentOpen .secondaryButton,\n.kindSecondary.colorBrand.splitContentOpen .secondaryButton:hover {\n  color: var(--brand-color);\n  border-color: var(--brand-color);\n  background-color: var(--brand-selected-color);\n}");export{n as default};
+var n={button:"button",mainButton:"mainButton",secondaryButton:"secondaryButton",secondaryButtonWrapper:"secondaryButtonWrapper",secondaryButtonIconWrapper:"secondaryButtonIconWrapper",active:"active",disabled:"disabled",kindTertiary:"kindTertiary",colorPrimary:"colorPrimary",mainActive:"mainActive",splitContentOpen:"splitContentOpen",hovered:"hovered",colorBrand:"colorBrand",colorPositive:"colorPositive",colorNegative:"colorNegative",kindPrimary:"kindPrimary",colorOnPrimaryColor:"colorOnPrimaryColor",kindSecondary:"kindSecondary"};!function(n){const r="s_id-b26d62194c18_3_58_1";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+r))return;const e=document.createElement("style");e.id=r,o.firstChild?o.insertBefore(e,o.firstChild):o.appendChild(e),e.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[r]=n)}(".button {\n  display: inline-flex;\n  border-radius: var(--border-radius-small);\n  transition: var(--motion-productive-short) transform, var(--motion-productive-medium) var(--motion-timing-transition) min-width;\n}\n\n.button .mainButton {\n  margin-right: 0;\n}\n\n.button .secondaryButton {\n  margin-left: 0;\n}\n\n.secondaryButtonWrapper .secondaryButtonIconWrapper {\n  display: inline-flex;\n  padding: 0 4px;\n}\n\n.active {\n  transform: scale(0.95);\n}\n\n.disabled {\n  cursor: not-allowed;\n  pointer-events: none;\n}\n\n.kindTertiary.colorPrimary.mainActive .mainButton {\n  background-color: var(--primary-selected-color);\n}\n\n.kindTertiary.colorPrimary.mainActive .mainButton:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n\n.kindTertiary.colorPrimary.mainActive .secondaryButton {\n  background-color: var(--primary-selected-color);\n}\n\n.kindTertiary.colorPrimary.mainActive .secondaryButton:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n\n.kindTertiary.colorPrimary.mainActive.splitContentOpen.splitContentOpen .secondaryButton,\n.kindTertiary.colorPrimary.mainActive.splitContentOpen.splitContentOpen .secondaryButton:hover,\n.kindTertiary.colorPrimary.mainActive.hovered.splitContentOpen .secondaryButton,\n.kindTertiary.colorPrimary.mainActive.hovered.splitContentOpen .secondaryButton:hover {\n  color: var(--primary-color);\n}\n\n.kindTertiary.colorBrand.mainActive .mainButton {\n  background-color: var(--brand-selected-color);\n}\n\n.kindTertiary.colorBrand.mainActive .secondaryButton {\n  background-color: var(--brand-selected-color);\n}\n\n.kindTertiary.colorBrand.mainActive.splitContentOpen.splitContentOpen .secondaryButton,\n.kindTertiary.colorBrand.mainActive.splitContentOpen.splitContentOpen .secondaryButton:hover,\n.kindTertiary.colorBrand.mainActive.hovered.splitContentOpen .secondaryButton,\n.kindTertiary.colorBrand.mainActive.hovered.splitContentOpen .secondaryButton:hover {\n  color: var(--brand-color);\n}\n\n.kindTertiary.colorPositive.splitContentOpen .secondaryButton,\n.kindTertiary.colorPositive:hover .secondaryButton,\n.kindTertiary.colorPositive:focus .secondaryButton {\n  border-color: transparent;\n  background-color: var(--positive-color-selected);\n}\n\n.kindTertiary.colorPositive.splitContentOpen .mainButton,\n.kindTertiary.colorPositive:hover .mainButton,\n.kindTertiary.colorPositive:focus .mainButton {\n  background-color: var(--positive-color-selected);\n}\n\n.kindTertiary.colorNegative.splitContentOpen .secondaryButton,\n.kindTertiary.colorNegative:hover .secondaryButton,\n.kindTertiary.colorNegative:focus .secondaryButton {\n  border-color: transparent;\n  background-color: var(--negative-color-selected);\n}\n\n.kindTertiary.colorNegative.splitContentOpen .mainButton,\n.kindTertiary.colorNegative:hover .mainButton,\n.kindTertiary.colorNegative:focus .mainButton {\n  background-color: var(--negative-color-selected);\n}\n\n.kindTertiary .secondaryButton {\n  border-left: 1px solid transparent;\n  margin-left: 1px;\n}\n\n.kindPrimary.disabled .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--ui-border-color);\n}\n\n.kindPrimary:not(.disabled).colorPrimary.mainActive .secondaryButton {\n  background-color: var(--primary-hover-color);\n  border-color: var(--text-color-on-primary);\n}\n\n.kindPrimary:not(.disabled).colorPrimary .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--primary-hover-color);\n}\n\n.kindPrimary:not(.disabled).colorBrand.mainActive .secondaryButton {\n  background-color: var(--brand-hover-color);\n  border-color: var(--text-color-on-primary);\n}\n\n.kindPrimary:not(.disabled).colorBrand .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--brand-hover-color);\n}\n\n.kindPrimary:not(.disabled).colorPositive .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--positive-color-hover);\n}\n\n.kindPrimary:not(.disabled).colorNegative .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--negative-color-hover);\n}\n\n.kindPrimary:not(.disabled).colorOnPrimaryColor .secondaryButton {\n  border-left: 1px solid;\n  border-color: var(--color-ui_grey);\n}\n\n.kindSecondary .mainButton {\n  border-right: none;\n}\n\n.kindSecondary.colorPrimary.mainActive .mainButton {\n  background-color: var(--primary-selected-color);\n}\n\n.kindSecondary.colorPrimary.mainActive .mainButton:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n\n.kindSecondary.colorPrimary.mainActive .secondaryButton {\n  background-color: var(--primary-selected-color);\n  border-color: var(--primary-color);\n}\n\n.kindSecondary.colorPrimary.splitContentOpen .secondaryButton {\n  color: var(--primary-color);\n  border-color: var(--primary-color);\n  background-color: var(--primary-selected-color);\n}\n\n.kindSecondary.colorPrimary.splitContentOpen .secondaryButton:hover {\n  background-color: var(--primary-selected-hover-color);\n}\n\n.kindSecondary.colorBrand.mainActive .mainButton {\n  background-color: var(--brand-selected-color);\n}\n\n.kindSecondary.colorBrand.mainActive .secondaryButton {\n  background-color: var(--brand-selected-color);\n  border-color: var(--brand-color);\n}\n\n.kindSecondary.colorBrand.splitContentOpen .secondaryButton,\n.kindSecondary.colorBrand.splitContentOpen .secondaryButton:hover {\n  color: var(--brand-color);\n  border-color: var(--brand-color);\n  background-color: var(--brand-selected-color);\n}");export{n as default};
 //# sourceMappingURL=SplitButton.module.scss.js.map

package/dist/mocked_classnames/src/components/SplitButton/SplitButtonMenu/SplitButtonMenu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SplitButtonMenu.js","sources":["../../../../../../src/components/SplitButton/SplitButtonMenu/SplitButtonMenu.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from \"react\";\nimport useMergeRef from \"../../../hooks/useMergeRef\";\nimport Menu, { MenuProps } from \"../../Menu/Menu/Menu\";\n\nexport type SplitButtonMenuProps = Omit<MenuProps, \"focusItemIndexOnMount\"> & { children: React.ReactNode };\n\nconst SplitButtonMenu = forwardRef(\n ({ children, ...splitButtonMenuProps }: SplitButtonMenuProps, ref: React.ForwardedRef<HTMLElement>) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <Menu focusItemIndexOnMount={0} {...splitButtonMenuProps} ref={mergedRef}>\n {children}\n </Menu>\n );\n }\n);\n\nexport default SplitButtonMenu;\n"],"names":["SplitButtonMenu","forwardRef","_a","ref","children","splitButtonMenuProps","__rest","componentRef","useRef","mergedRef","useMergeRef","React","createElement","Menu","Object","assign","focusItemIndexOnMount"],"mappings":"8LAMMA,IAAAA,EAAkBC,GACtB,SAACC,EAA6DC,GAA7D,IAAEC,EAAyDF,EAAzDE,SAAaC,EAAoBC,EAAAJ,EAAnC,cACOK,EAAeC,EAAO,MACtBC,EAAYC,EAAYP,EAAKI,GAEnC,OACEI,EAACC,cAAAC,EAAKC,OAAAC,OAAA,CAAAC,sBAAuB,GAAOX,EAAoB,CAAEF,IAAKM,IAC5DL,EAGP"}
1	+ {"version":3,"file":"SplitButtonMenu.js","sources":["../../../../../../src/components/SplitButton/SplitButtonMenu/SplitButtonMenu.tsx"],"sourcesContent":["import React, { forwardRef, useRef } from \"react\";\nimport useMergeRef from \"../../../hooks/useMergeRef\";\nimport Menu, { type MenuProps } from \"../../Menu/Menu/Menu\";\n\nexport type SplitButtonMenuProps = Omit<MenuProps, \"focusItemIndexOnMount\"> & { children: React.ReactNode };\n\nconst SplitButtonMenu = forwardRef(\n ({ children, ...splitButtonMenuProps }: SplitButtonMenuProps, ref: React.ForwardedRef<HTMLElement>) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <Menu focusItemIndexOnMount={0} {...splitButtonMenuProps} ref={mergedRef}>\n {children}\n </Menu>\n );\n }\n);\n\nexport default SplitButtonMenu;\n"],"names":["SplitButtonMenu","forwardRef","_a","ref","children","splitButtonMenuProps","__rest","componentRef","useRef","mergedRef","useMergeRef","React","createElement","Menu","Object","assign","focusItemIndexOnMount"],"mappings":"8LAMMA,IAAAA,EAAkBC,GACtB,SAACC,EAA6DC,GAA7D,IAAEC,EAAyDF,EAAzDE,SAAaC,EAAoBC,EAAAJ,EAAnC,cACOK,EAAeC,EAAO,MACtBC,EAAYC,EAAYP,EAAKI,GAEnC,OACEI,EAACC,cAAAC,EAAKC,OAAAC,OAAA,CAAAC,sBAAuB,GAAOX,EAAoB,CAAEF,IAAKM,IAC5DL,EAGP"}

package/dist/mocked_classnames/src/components/Steps/Steps.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Steps.js","sources":["../../../../../src/components/Steps/Steps.tsx"],"sourcesContent":["import React, { forwardRef, ReactElement, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { StepsHeader } from \"./StepsHeader\";\nimport { StepsColor as StepsColorEnum, StepsType as StepsTypeEnum } from \"./StepsConstants\";\nimport { StepsColor, StepsType } from \"./Steps.types\";\nimport { ButtonProps } from \"../Button\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { withStaticProps, VibeComponentProps } from \"../../types\";\nimport styles from \"./Steps.module.scss\";\n\nexport interface StepsProps extends VibeComponentProps {\n /*\n The index of the currently active step.\n /\n activeStepIndex?: number;\n /\n Callback fired when the active step changes.\n /\n onChangeActiveStep?: (e: React.MouseEvent, stepIndex: number) => void;\n /\n If true, hides the navigation buttons.\n /\n areNavigationButtonsHidden?: boolean;\n /\n The list of steps in the steps component.\n /\n steps?: ReactElement[];\n /\n The visual style of the steps component.\n /\n type?: StepsType;\n /\n The color theme of the steps component.\n /\n color?: StepsColor;\n /\n If true, the content is displayed above the step navigation.\n /\n isContentOnTop?: boolean;\n /\n If true, hides the icons in the navigation buttons.\n /\n areButtonsIconsHidden?: boolean;\n /\n Props applied to the back button.\n /\n backButtonProps?: Partial<ButtonProps>;\n /\n Props applied to the next button.\n /\n nextButtonProps?: Partial<ButtonProps>;\n /\n Props applied to the finish button.\n /\n finishButtonProps?: Partial<ButtonProps>;\n /\n Callback fired when the finish button is clicked.\n */\n onFinish?: (e: React.MouseEvent \| React.KeyboardEvent) => void;\n}\n\nconst Steps = forwardRef(\n (\n {\n className,\n id,\n \"data-testid\": dataTestId,\n steps = [],\n activeStepIndex = 0,\n type = \"gallery\",\n onChangeActiveStep = NOOP,\n onFinish,\n color,\n areNavigationButtonsHidden = false,\n isContentOnTop = false,\n backButtonProps = {},\n nextButtonProps = {},\n finishButtonProps = {},\n areButtonsIconsHidden = false\n }: StepsProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <div\n ref={mergedRef}\n className={cx(styles.steps, className)}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.STEPS, id)}\n >\n {isContentOnTop && steps[activeStepIndex]}\n <StepsHeader\n onChangeActiveStep={onChangeActiveStep}\n type={type}\n activeStepIndex={activeStepIndex}\n stepsCount={steps.length}\n areNavigationButtonsHidden={areNavigationButtonsHidden}\n color={color}\n backButtonProps={backButtonProps}\n nextButtonProps={nextButtonProps}\n finishButtonProps={finishButtonProps}\n areButtonsIconsHidden={areButtonsIconsHidden}\n onFinish={onFinish}\n className={cx({\n [styles.contentOnTop]: isContentOnTop,\n [styles.contentOnBottom]: !isContentOnTop\n })}\n />\n {!isContentOnTop && steps[activeStepIndex]}\n </div>\n );\n }\n);\n\ninterface StepsStaticProps {\n types: typeof StepsTypeEnum;\n colors: typeof StepsColorEnum;\n}\n\nexport default withStaticProps<StepsProps, StepsStaticProps>(Steps, {\n types: StepsTypeEnum,\n colors: StepsColorEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","id","dataTestId","_ref$steps","steps","_ref$activeStepIndex","activeStepIndex","_ref$type","type","_ref$onChangeActiveSt","onChangeActiveStep","NOOP","onFinish","color","_ref$areNavigationBut","areNavigationButtonsHidden","_ref$isContentOnTop","isContentOnTop","_ref$backButtonProps","backButtonProps","_ref$nextButtonProps","nextButtonProps","_ref$finishButtonProp","finishButtonProps","_ref$areButtonsIconsH","areButtonsIconsHidden","componentRef","useRef","mergedRef","useMergeRef","React","createElement","cx","styles","getTestId","ComponentDefaultTestId","STEPS","StepsHeader","stepsCount","length","_defineProperty","contentOnTop","contentOnBottom","types","StepsTypeEnum","colors","StepsColorEnum"],"mappings":"ukBA+DA,IA4DeA,EAAAA,EA5DDC,GACZ,SAAAC,EAkBEC,GACE,IAjBAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GACeC,EAAUJ,EAAzB,eAAaK,EAAAL,EACbM,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAAP,EACVQ,gBAAAA,OAAkB,IAAHD,EAAG,EAACA,EAAAE,EAAAT,EACnBU,KAAAA,OAAO,IAAHD,EAAG,UAASA,EAAAE,EAAAX,EAChBY,mBAAAA,OAAqBC,IAAHF,EAAGE,EAAIF,EACzBG,EAAQd,EAARc,SACAC,EAAKf,EAALe,MAAKC,EAAAhB,EACLiB,2BAAAA,OAA6B,IAAHD,GAAQA,EAAAE,EAAAlB,EAClCmB,eAAAA,OAAiB,IAAHD,GAAQA,EAAAE,EAAApB,EACtBqB,gBAAAA,OAAe,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAAtB,EACpBuB,gBAAAA,OAAe,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAAxB,EACpByB,kBAAAA,OAAiB,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAA1B,EACtB2B,sBAAAA,OAAwB,IAAHD,GAAQA,EAIzBE,EAAeC,EAAO,MACtBC,EAAYC,EAAY9B,EAAK2B,GAEnC,OACEI,EAAAC,cAAA,MAAA,CACEhC,IAAK6B,EACL5B,UAAWgC,EAAGC,EAAO7B,MAAOJ,GAC5BC,GAAIA,EAAE,cACOC,GAAcgC,EAAUC,EAAuBC,MAAOnC,IAElEgB,GAAkBb,EAAME,GACzBwB,EAACC,cAAAM,GACC3B,mBAAoBA,EACpBF,KAAMA,EACNF,gBAAiBA,EACjBgC,WAAYlC,EAAMmC,OAClBxB,2BAA4BA,EAC5BF,MAAOA,EACPM,gBAAiBA,EACjBE,gBAAiBA,EACjBE,kBAAmBA,EACnBE,sBAAuBA,EACvBb,SAAUA,EACVZ,UAAWgC,EAAEQ,EAAAA,KACVP,EAAOQ,aAAexB,GACtBgB,EAAOS,iBAAmBzB,OAG7BA,GAAkBb,EAAME,GAGhC,IAQkE,CAClEqC,MAAOC,EACPC,OAAQC"}
1	+ {"version":3,"file":"Steps.js","sources":["../../../../../src/components/Steps/Steps.tsx"],"sourcesContent":["import React, { forwardRef, type ReactElement, useRef } from \"react\";\nimport cx from \"classnames\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport useMergeRef from \"../../hooks/useMergeRef\";\nimport { StepsHeader } from \"./StepsHeader\";\nimport { StepsColor as StepsColorEnum, StepsType as StepsTypeEnum } from \"./StepsConstants\";\nimport { type StepsColor, type StepsType } from \"./Steps.types\";\nimport { type ButtonProps } from \"../Button\";\nimport { ComponentDefaultTestId, getTestId } from \"../../tests/test-ids-utils\";\nimport { withStaticProps, type VibeComponentProps } from \"../../types\";\nimport styles from \"./Steps.module.scss\";\n\nexport interface StepsProps extends VibeComponentProps {\n /*\n The index of the currently active step.\n /\n activeStepIndex?: number;\n /\n Callback fired when the active step changes.\n /\n onChangeActiveStep?: (e: React.MouseEvent, stepIndex: number) => void;\n /\n If true, hides the navigation buttons.\n /\n areNavigationButtonsHidden?: boolean;\n /\n The list of steps in the steps component.\n /\n steps?: ReactElement[];\n /\n The visual style of the steps component.\n /\n type?: StepsType;\n /\n The color theme of the steps component.\n /\n color?: StepsColor;\n /\n If true, the content is displayed above the step navigation.\n /\n isContentOnTop?: boolean;\n /\n If true, hides the icons in the navigation buttons.\n /\n areButtonsIconsHidden?: boolean;\n /\n Props applied to the back button.\n /\n backButtonProps?: Partial<ButtonProps>;\n /\n Props applied to the next button.\n /\n nextButtonProps?: Partial<ButtonProps>;\n /\n Props applied to the finish button.\n /\n finishButtonProps?: Partial<ButtonProps>;\n /\n Callback fired when the finish button is clicked.\n */\n onFinish?: (e: React.MouseEvent \| React.KeyboardEvent) => void;\n}\n\nconst Steps = forwardRef(\n (\n {\n className,\n id,\n \"data-testid\": dataTestId,\n steps = [],\n activeStepIndex = 0,\n type = \"gallery\",\n onChangeActiveStep = NOOP,\n onFinish,\n color,\n areNavigationButtonsHidden = false,\n isContentOnTop = false,\n backButtonProps = {},\n nextButtonProps = {},\n finishButtonProps = {},\n areButtonsIconsHidden = false\n }: StepsProps,\n ref: React.ForwardedRef<HTMLElement>\n ) => {\n const componentRef = useRef(null);\n const mergedRef = useMergeRef(ref, componentRef);\n\n return (\n <div\n ref={mergedRef}\n className={cx(styles.steps, className)}\n id={id}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.STEPS, id)}\n >\n {isContentOnTop && steps[activeStepIndex]}\n <StepsHeader\n onChangeActiveStep={onChangeActiveStep}\n type={type}\n activeStepIndex={activeStepIndex}\n stepsCount={steps.length}\n areNavigationButtonsHidden={areNavigationButtonsHidden}\n color={color}\n backButtonProps={backButtonProps}\n nextButtonProps={nextButtonProps}\n finishButtonProps={finishButtonProps}\n areButtonsIconsHidden={areButtonsIconsHidden}\n onFinish={onFinish}\n className={cx({\n [styles.contentOnTop]: isContentOnTop,\n [styles.contentOnBottom]: !isContentOnTop\n })}\n />\n {!isContentOnTop && steps[activeStepIndex]}\n </div>\n );\n }\n);\n\ninterface StepsStaticProps {\n types: typeof StepsTypeEnum;\n colors: typeof StepsColorEnum;\n}\n\nexport default withStaticProps<StepsProps, StepsStaticProps>(Steps, {\n types: StepsTypeEnum,\n colors: StepsColorEnum\n});\n"],"names":["withStaticProps","forwardRef","_ref","ref","className","id","dataTestId","_ref$steps","steps","_ref$activeStepIndex","activeStepIndex","_ref$type","type","_ref$onChangeActiveSt","onChangeActiveStep","NOOP","onFinish","color","_ref$areNavigationBut","areNavigationButtonsHidden","_ref$isContentOnTop","isContentOnTop","_ref$backButtonProps","backButtonProps","_ref$nextButtonProps","nextButtonProps","_ref$finishButtonProp","finishButtonProps","_ref$areButtonsIconsH","areButtonsIconsHidden","componentRef","useRef","mergedRef","useMergeRef","React","createElement","cx","styles","getTestId","ComponentDefaultTestId","STEPS","StepsHeader","stepsCount","length","_defineProperty","contentOnTop","contentOnBottom","types","StepsTypeEnum","colors","StepsColorEnum"],"mappings":"ukBA+DA,IA4DeA,EAAAA,EA5DDC,GACZ,SAAAC,EAkBEC,GACE,IAjBAC,EAASF,EAATE,UACAC,EAAEH,EAAFG,GACeC,EAAUJ,EAAzB,eAAaK,EAAAL,EACbM,MAAAA,OAAQ,IAAHD,EAAG,GAAEA,EAAAE,EAAAP,EACVQ,gBAAAA,OAAkB,IAAHD,EAAG,EAACA,EAAAE,EAAAT,EACnBU,KAAAA,OAAO,IAAHD,EAAG,UAASA,EAAAE,EAAAX,EAChBY,mBAAAA,OAAqBC,IAAHF,EAAGE,EAAIF,EACzBG,EAAQd,EAARc,SACAC,EAAKf,EAALe,MAAKC,EAAAhB,EACLiB,2BAAAA,OAA6B,IAAHD,GAAQA,EAAAE,EAAAlB,EAClCmB,eAAAA,OAAiB,IAAHD,GAAQA,EAAAE,EAAApB,EACtBqB,gBAAAA,OAAe,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAAtB,EACpBuB,gBAAAA,OAAe,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAAxB,EACpByB,kBAAAA,OAAiB,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAA1B,EACtB2B,sBAAAA,OAAwB,IAAHD,GAAQA,EAIzBE,EAAeC,EAAO,MACtBC,EAAYC,EAAY9B,EAAK2B,GAEnC,OACEI,EAAAC,cAAA,MAAA,CACEhC,IAAK6B,EACL5B,UAAWgC,EAAGC,EAAO7B,MAAOJ,GAC5BC,GAAIA,EAAE,cACOC,GAAcgC,EAAUC,EAAuBC,MAAOnC,IAElEgB,GAAkBb,EAAME,GACzBwB,EAACC,cAAAM,GACC3B,mBAAoBA,EACpBF,KAAMA,EACNF,gBAAiBA,EACjBgC,WAAYlC,EAAMmC,OAClBxB,2BAA4BA,EAC5BF,MAAOA,EACPM,gBAAiBA,EACjBE,gBAAiBA,EACjBE,kBAAmBA,EACnBE,sBAAuBA,EACvBb,SAAUA,EACVZ,UAAWgC,EAAEQ,EAAAA,KACVP,EAAOQ,aAAexB,GACtBgB,EAAOS,iBAAmBzB,OAG7BA,GAAkBb,EAAME,GAGhC,IAQkE,CAClEqC,MAAOC,EACPC,OAAQC"}

package/dist/mocked_classnames/src/components/Steps/Steps.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={steps:"steps",contentOnTop:"contentOnTop",contentOnBottom:"contentOnBottom"};!function(e){const t="s_id-9e4623f942e8_3_58_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".steps .contentOnTop {\n  margin-top: var(--spacing-medium);\n}\n.steps .contentOnBottom {\n  margin-bottom: var(--spacing-small);\n}");export{e as default};
+var e={steps:"steps",contentOnTop:"contentOnTop",contentOnBottom:"contentOnBottom"};!function(e){const t="s_id-9e4623f942e8_3_58_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".steps .contentOnTop {\n  margin-top: var(--spacing-medium);\n}\n.steps .contentOnBottom {\n  margin-bottom: var(--spacing-small);\n}");export{e as default};
 //# sourceMappingURL=Steps.module.scss.js.map

package/dist/mocked_classnames/src/components/Steps/StepsCommand.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepsCommand.js","sources":["../../../../../src/components/Steps/StepsCommand.tsx"],"sourcesContent":["import React, { FC, useCallback, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { NavigationChevronRight, NavigationChevronLeft } from \"@vibe/icons\";\nimport Icon from \"../../components/Icon/Icon\";\nimport Button, { ButtonProps } from \"../../components/Button/Button\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { BACK_TEXT, NEXT_TEXT } from \"./StepsConstants\";\nimport { StepsColor } from \"./Steps.types\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport styles from \"./StepsCommand.module.scss\";\nimport { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../..//helpers/typesciptCssModulesHelper\";\n\nexport interface StepsCommandProps extends VibeComponentProps {\n /*\n If true, this button is for moving to the next step.\n /\n isNext?: boolean;\n /\n Callback fired when the active step changes.\n /\n onChangeActiveStep?: (e: React.MouseEvent, newStepIndex: number) => void;\n /\n The index of the currently active step.\n /\n activeStepIndex: number;\n /\n The total number of steps.\n /\n stepsCount: number;\n /\n If true, hides the navigation icon.\n /\n isIconHidden?: boolean;\n /\n Props applied to the button.\n /\n buttonProps?: Partial<ButtonProps>;\n /\n The color theme of the button.\n */\n color?: StepsColor;\n}\n\nexport const StepsCommand: FC<StepsCommandProps> = ({\n isNext = false,\n onChangeActiveStep = NOOP,\n activeStepIndex,\n stepsCount,\n isIconHidden = false,\n buttonProps = {},\n color = \"primary\"\n}: StepsCommandProps) => {\n const { children: buttonChildren, ...otherButtonProps } = buttonProps;\n const description = useMemo(() => {\n if (buttonChildren) return buttonChildren;\n return isNext ? NEXT_TEXT : BACK_TEXT;\n }, [isNext, buttonChildren]);\n const newStepIndex = isNext ? activeStepIndex + 1 : activeStepIndex - 1;\n const onClick = useCallback(\n (e: React.MouseEvent) => onChangeActiveStep(e, newStepIndex),\n [newStepIndex, onChangeActiveStep]\n );\n const isDisabled = (isNext && activeStepIndex === stepsCount - 1) \|\| (!isNext && activeStepIndex === 0);\n\n const icon = isNext ? NavigationChevronRight : NavigationChevronLeft;\n return (\n <Button\n className={cx(styles.command, { [styles.backward]: !isNext })}\n data-testid={\n isNext ? ComponentDefaultTestId.STEPS_FORWARD_COMMAND : ComponentDefaultTestId.STEPS_BACKWARD_COMMAND\n }\n kind=\"tertiary\"\n onClick={onClick}\n disabled={isDisabled}\n // @ts-ignore\n color={color}\n {...otherButtonProps}\n >\n {description}\n {isIconHidden ? null : (\n <Icon\n icon={icon}\n className={cx(styles.icon, getStyle(styles, camelCase(\"color-\" + color)), {\n [styles.disabled]: isDisabled\n })}\n />\n )}\n </Button>\n );\n};\n"],"names":["StepsCommand","_ref","_ref$isNext","isNext","_ref$onChangeActiveSt","onChangeActiveStep","NOOP","activeStepIndex","stepsCount","_ref$isIconHidden","isIconHidden","_ref$buttonProps","buttonProps","_ref$color","color","buttonChildren","children","otherButtonProps","__rest","description","useMemo","NEXT_TEXT","BACK_TEXT","newStepIndex","onClick","useCallback","e","isDisabled","icon","NavigationChevronRight","NavigationChevronLeft","React","Button","Object","assign","className","cx","styles","command","_defineProperty","backward","ComponentDefaultTestId","STEPS_FORWARD_COMMAND","STEPS_BACKWARD_COMMAND","kind","disabled","createElement","Icon","getStyle","camelCase"],"mappings":"6uBA6CaA,EAAsC,SAA1BC,GAQD,IAAAC,EAAAD,EAPtBE,OAAAA,OAAS,IAAHD,GAAQA,EAAAE,EAAAH,EACdI,mBAAAA,OAAqBC,IAAHF,EAAGE,EAAIF,EACzBG,EAAeN,EAAfM,gBACAC,EAAUP,EAAVO,WAAUC,EAAAR,EACVS,aAAAA,OAAe,IAAHD,GAAQA,EAAAE,EAAAV,EACpBW,YAAAA,OAAW,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAAZ,EAChBa,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAECE,EAAwCH,EAAlDI,SAA6BC,EAAqBC,EAAAN,EAApD,CAAA,aACAO,EAAcC,GAAQ,WAC1B,OAAIL,IACGZ,EAASkB,EAAYC,EAC9B,GAAG,CAACnB,EAAQY,IACNQ,EAAepB,EAASI,EAAkB,EAAIA,EAAkB,EAChEiB,EAAUC,GACd,SAACC,GAAmB,OAAKrB,EAAmBqB,EAAGH,EAAa,GAC5D,CAACA,EAAclB,IAEXsB,EAAcxB,GAAUI,IAAoBC,EAAa,IAAQL,GAA8B,IAApBI,EAE3EqB,EAAOzB,EAAS0B,EAAyBC,EAC/C,OACEC,gBAACC,EAAMC,OAAAC,OAAA,CACLC,UAAWC,EAAGC,EAAOC,QAAOC,EAAKF,CAAAA,EAAAA,EAAOG,UAAYrC,IAAS,cAE3DA,EAASsC,EAAuBC,sBAAwBD,EAAuBE,uBAEjFC,KAAK,WACLpB,QAASA,EACTqB,SAAUlB,EAEVb,MAAOA,GACHG,GAEHE,EACAT,EAAe,KACdqB,EAAAe,cAACC,EACC,CAAAnB,KAAMA,EACNO,UAAWC,EAAGC,EAAOT,KAAMoB,EAASX,EAAQY,EAAU,SAAWnC,IAAOyB,EACrEF,CAAAA,EAAAA,EAAOQ,SAAWlB,MAM/B"}
1	+ {"version":3,"file":"StepsCommand.js","sources":["../../../../../src/components/Steps/StepsCommand.tsx"],"sourcesContent":["import React, { type FC, useCallback, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { NavigationChevronRight, NavigationChevronLeft } from \"@vibe/icons\";\nimport Icon from \"../../components/Icon/Icon\";\nimport Button, { type ButtonProps } from \"../../components/Button/Button\";\nimport { NOOP } from \"../../utils/function-utils\";\nimport { BACK_TEXT, NEXT_TEXT } from \"./StepsConstants\";\nimport { type StepsColor } from \"./Steps.types\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport { ComponentDefaultTestId } from \"../../tests/constants\";\nimport styles from \"./StepsCommand.module.scss\";\nimport { camelCase } from \"lodash-es\";\nimport { getStyle } from \"../..//helpers/typesciptCssModulesHelper\";\n\nexport interface StepsCommandProps extends VibeComponentProps {\n /*\n If true, this button is for moving to the next step.\n /\n isNext?: boolean;\n /\n Callback fired when the active step changes.\n /\n onChangeActiveStep?: (e: React.MouseEvent, newStepIndex: number) => void;\n /\n The index of the currently active step.\n /\n activeStepIndex: number;\n /\n The total number of steps.\n /\n stepsCount: number;\n /\n If true, hides the navigation icon.\n /\n isIconHidden?: boolean;\n /\n Props applied to the button.\n /\n buttonProps?: Partial<ButtonProps>;\n /\n The color theme of the button.\n */\n color?: StepsColor;\n}\n\nexport const StepsCommand: FC<StepsCommandProps> = ({\n isNext = false,\n onChangeActiveStep = NOOP,\n activeStepIndex,\n stepsCount,\n isIconHidden = false,\n buttonProps = {},\n color = \"primary\"\n}: StepsCommandProps) => {\n const { children: buttonChildren, ...otherButtonProps } = buttonProps;\n const description = useMemo(() => {\n if (buttonChildren) return buttonChildren;\n return isNext ? NEXT_TEXT : BACK_TEXT;\n }, [isNext, buttonChildren]);\n const newStepIndex = isNext ? activeStepIndex + 1 : activeStepIndex - 1;\n const onClick = useCallback(\n (e: React.MouseEvent) => onChangeActiveStep(e, newStepIndex),\n [newStepIndex, onChangeActiveStep]\n );\n const isDisabled = (isNext && activeStepIndex === stepsCount - 1) \|\| (!isNext && activeStepIndex === 0);\n\n const icon = isNext ? NavigationChevronRight : NavigationChevronLeft;\n return (\n <Button\n className={cx(styles.command, { [styles.backward]: !isNext })}\n data-testid={\n isNext ? ComponentDefaultTestId.STEPS_FORWARD_COMMAND : ComponentDefaultTestId.STEPS_BACKWARD_COMMAND\n }\n kind=\"tertiary\"\n onClick={onClick}\n disabled={isDisabled}\n // @ts-ignore\n color={color}\n {...otherButtonProps}\n >\n {description}\n {isIconHidden ? null : (\n <Icon\n icon={icon}\n className={cx(styles.icon, getStyle(styles, camelCase(\"color-\" + color)), {\n [styles.disabled]: isDisabled\n })}\n />\n )}\n </Button>\n );\n};\n"],"names":["StepsCommand","_ref","_ref$isNext","isNext","_ref$onChangeActiveSt","onChangeActiveStep","NOOP","activeStepIndex","stepsCount","_ref$isIconHidden","isIconHidden","_ref$buttonProps","buttonProps","_ref$color","color","buttonChildren","children","otherButtonProps","__rest","description","useMemo","NEXT_TEXT","BACK_TEXT","newStepIndex","onClick","useCallback","e","isDisabled","icon","NavigationChevronRight","NavigationChevronLeft","React","Button","Object","assign","className","cx","styles","command","_defineProperty","backward","ComponentDefaultTestId","STEPS_FORWARD_COMMAND","STEPS_BACKWARD_COMMAND","kind","disabled","createElement","Icon","getStyle","camelCase"],"mappings":"6uBA6CaA,EAAsC,SAA1BC,GAQD,IAAAC,EAAAD,EAPtBE,OAAAA,OAAS,IAAHD,GAAQA,EAAAE,EAAAH,EACdI,mBAAAA,OAAqBC,IAAHF,EAAGE,EAAIF,EACzBG,EAAeN,EAAfM,gBACAC,EAAUP,EAAVO,WAAUC,EAAAR,EACVS,aAAAA,OAAe,IAAHD,GAAQA,EAAAE,EAAAV,EACpBW,YAAAA,OAAW,IAAAD,EAAG,CAAE,EAAAA,EAAAE,EAAAZ,EAChBa,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EAECE,EAAwCH,EAAlDI,SAA6BC,EAAqBC,EAAAN,EAApD,CAAA,aACAO,EAAcC,GAAQ,WAC1B,OAAIL,IACGZ,EAASkB,EAAYC,EAC9B,GAAG,CAACnB,EAAQY,IACNQ,EAAepB,EAASI,EAAkB,EAAIA,EAAkB,EAChEiB,EAAUC,GACd,SAACC,GAAmB,OAAKrB,EAAmBqB,EAAGH,EAAa,GAC5D,CAACA,EAAclB,IAEXsB,EAAcxB,GAAUI,IAAoBC,EAAa,IAAQL,GAA8B,IAApBI,EAE3EqB,EAAOzB,EAAS0B,EAAyBC,EAC/C,OACEC,gBAACC,EAAMC,OAAAC,OAAA,CACLC,UAAWC,EAAGC,EAAOC,QAAOC,EAAKF,CAAAA,EAAAA,EAAOG,UAAYrC,IAAS,cAE3DA,EAASsC,EAAuBC,sBAAwBD,EAAuBE,uBAEjFC,KAAK,WACLpB,QAASA,EACTqB,SAAUlB,EAEVb,MAAOA,GACHG,GAEHE,EACAT,EAAe,KACdqB,EAAAe,cAACC,EACC,CAAAnB,KAAMA,EACNO,UAAWC,EAAGC,EAAOT,KAAMoB,EAASX,EAAQY,EAAU,SAAWnC,IAAOyB,EACrEF,CAAAA,EAAAA,EAAOQ,SAAWlB,MAM/B"}

package/dist/mocked_classnames/src/components/Steps/StepsCommand.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var n={command:"command",backward:"backward",icon:"icon",disabled:"disabled",colorOnPrimaryColor:"colorOnPrimaryColor",colorOnInvertedBackground:"colorOnInvertedBackground"};!function(n){const o="s_id-b004c6aa2b0d_3_58_0";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+o))return;const r=document.createElement("style");r.id=o,e.firstChild?e.insertBefore(r,e.firstChild):e.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}(".command {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n.command.backward {\n  flex-direction: row-reverse;\n}\n.icon {\n  color: var(--icon-color);\n  width: 15.5px;\n  height: 15.5px;\n}\n.icon.disabled {\n  color: var(--disabled-text-color);\n}\n.icon.colorOnPrimaryColor {\n  color: var(--text-color-on-primary);\n}\n.icon.colorOnInvertedBackground {\n  color: var(--text-color-on-inverted);\n}");export{n as default};
+var n={command:"command",backward:"backward",icon:"icon",disabled:"disabled",colorOnPrimaryColor:"colorOnPrimaryColor",colorOnInvertedBackground:"colorOnInvertedBackground"};!function(n){const o="s_id-b004c6aa2b0d_3_58_1";if("undefined"!=typeof document){const e=document.head||document.getElementsByTagName("head")[0];if(e.querySelector("#"+o))return;const r=document.createElement("style");r.id=o,e.firstChild?e.insertBefore(r,e.firstChild):e.appendChild(r),r.appendChild(document.createTextNode(n))}else globalThis.injectedStyles&&(globalThis.injectedStyles[o]=n)}(".command {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n}\n.command.backward {\n  flex-direction: row-reverse;\n}\n.icon {\n  color: var(--icon-color);\n  width: 15.5px;\n  height: 15.5px;\n}\n.icon.disabled {\n  color: var(--disabled-text-color);\n}\n.icon.colorOnPrimaryColor {\n  color: var(--text-color-on-primary);\n}\n.icon.colorOnInvertedBackground {\n  color: var(--text-color-on-inverted);\n}");export{n as default};
 //# sourceMappingURL=StepsCommand.module.scss.js.map

package/dist/mocked_classnames/src/components/Steps/StepsDot.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepsDot.js","sources":["../../../../../src/components/Steps/StepsDot.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport { noop as NOOP, camelCase } from \"lodash-es\";\nimport { StepsColor, StepsDotAriaCurrent } from \"./Steps.types\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport React, { FC } from \"react\";\nimport styles from \"./StepsDot.module.scss\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\n\nexport interface StepsDotProps extends VibeComponentProps {\n /*\n Callback fired when the dot is clicked.\n /\n onClick?: (e: React.MouseEvent) => void;\n /\n ARIA attribute to indicate the current step.\n /\n ariaCurrent?: StepsDotAriaCurrent \| boolean;\n /\n If true, marks the dot as active.\n /\n isActive?: boolean;\n /\n The ARIA label for the dot.\n /\n ariaLabel?: string;\n /\n The color theme of the dot.\n */\n color?: StepsColor;\n}\n\nexport const StepsDot: FC<StepsDotProps> = ({\n isActive,\n onClick = NOOP,\n ariaCurrent = \"step\",\n ariaLabel,\n color,\n className\n}: StepsDotProps) => {\n return (\n <button\n type=\"button\"\n aria-label={ariaLabel}\n aria-current={isActive ? ariaCurrent : false}\n className={cx(\n styles.dot,\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.isActive]: isActive\n },\n className\n )}\n onClick={onClick}\n />\n );\n};\n"],"names":["StepsDot","_ref","isActive","_ref$onClick","onClick","NOOP","_ref$ariaCurrent","ariaCurrent","className","React","createElement","type","ariaLabel","cx","styles","dot","getStyle","camelCase","color","_defineProperty"],"mappings":"kSA+BaA,EAA8B,SAAtBC,GAOD,IANlBC,EAAQD,EAARC,SAAQC,EAAAF,EACRG,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAL,EACdM,YAGAC,EAASP,EAATO,UAEA,OACEC,EACEC,cAAA,SAAA,CAAAC,KAAK,sBANAV,EAATW,UAOyB,iBACPV,SATJ,IAAHI,EAAG,OAAMA,GAUhBE,UAAWK,EACTC,EAAOC,IACPC,EAASF,EAAQG,EAAU,SAV5BhB,EAALiB,QAUmDC,EAE1CL,GAAAA,EAAOZ,SAAWA,GAErBM,GAEFJ,QAASA,GAGf"}
1	+ {"version":3,"file":"StepsDot.js","sources":["../../../../../src/components/Steps/StepsDot.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport { noop as NOOP, camelCase } from \"lodash-es\";\nimport { type StepsColor, type StepsDotAriaCurrent } from \"./Steps.types\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport React, { type FC } from \"react\";\nimport styles from \"./StepsDot.module.scss\";\nimport { getStyle } from \"../../helpers/typesciptCssModulesHelper\";\n\nexport interface StepsDotProps extends VibeComponentProps {\n /*\n Callback fired when the dot is clicked.\n /\n onClick?: (e: React.MouseEvent) => void;\n /\n ARIA attribute to indicate the current step.\n /\n ariaCurrent?: StepsDotAriaCurrent \| boolean;\n /\n If true, marks the dot as active.\n /\n isActive?: boolean;\n /\n The ARIA label for the dot.\n /\n ariaLabel?: string;\n /\n The color theme of the dot.\n */\n color?: StepsColor;\n}\n\nexport const StepsDot: FC<StepsDotProps> = ({\n isActive,\n onClick = NOOP,\n ariaCurrent = \"step\",\n ariaLabel,\n color,\n className\n}: StepsDotProps) => {\n return (\n <button\n type=\"button\"\n aria-label={ariaLabel}\n aria-current={isActive ? ariaCurrent : false}\n className={cx(\n styles.dot,\n getStyle(styles, camelCase(\"color-\" + color)),\n {\n [styles.isActive]: isActive\n },\n className\n )}\n onClick={onClick}\n />\n );\n};\n"],"names":["StepsDot","_ref","isActive","_ref$onClick","onClick","NOOP","_ref$ariaCurrent","ariaCurrent","className","React","createElement","type","ariaLabel","cx","styles","dot","getStyle","camelCase","color","_defineProperty"],"mappings":"kSA+BaA,EAA8B,SAAtBC,GAOD,IANlBC,EAAQD,EAARC,SAAQC,EAAAF,EACRG,QAAAA,OAAUC,IAAHF,EAAGE,EAAIF,EAAAG,EAAAL,EACdM,YAGAC,EAASP,EAATO,UAEA,OACEC,EACEC,cAAA,SAAA,CAAAC,KAAK,sBANAV,EAATW,UAOyB,iBACPV,SATJ,IAAHI,EAAG,OAAMA,GAUhBE,UAAWK,EACTC,EAAOC,IACPC,EAASF,EAAQG,EAAU,SAV5BhB,EAALiB,QAUmDC,EAE1CL,GAAAA,EAAOZ,SAAWA,GAErBM,GAEFJ,QAASA,GAGf"}

package/dist/mocked_classnames/src/components/Steps/StepsDot.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var o={dot:"dot","focus-visible":"focus-visible",isActive:"isActive",colorOnPrimaryColor:"colorOnPrimaryColor",colorOnInvertedBackground:"colorOnInvertedBackground"};!function(o){const n="s_id-cedbbb07e913_3_58_0";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const e=document.createElement("style");e.id=n,r.firstChild?r.insertBefore(e,r.firstChild):r.appendChild(e),e.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=o)}("/* stylelint-disable selector-class-pattern */\n.dot {\n  border: none;\n  margin: 0;\n  padding: 0;\n  width: auto;\n  overflow: visible;\n  background: transparent;\n  /* inherit font & color from ancestor */\n  color: inherit;\n  font: inherit;\n  /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */\n  line-height: normal;\n  /* Corrects font smoothing for webkit */\n  -webkit-font-smoothing: inherit;\n  -moz-osx-font-smoothing: inherit;\n  /* Corrects inability to style clickable `input` types in iOS */\n  appearance: none;\n  width: 6px;\n  height: 6px;\n  cursor: pointer;\n  border-radius: 50%;\n  background: var(--ui-border-color);\n  transform-origin: center;\n  transform: scale(1);\n  transition: transform var(--motion-productive-long) var(--motion-timing-transition), background var(--motion-productive-long) var(--motion-timing-transition);\n}\n.dot:focus-visible, .dot.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.dot:focus:not(.focus-visible) {\n  outline: none;\n}\n.dot:focus-visible, .dot.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.dot:focus:not(.focus-visible) {\n  outline: none;\n}\n.dot:hover {\n  transform: scale(1.3);\n}\n.isActive {\n  background: var(--primary-color);\n  transform: scale(1.3);\n}\n.colorOnPrimaryColor.dot {\n  background: var(--primary-hover-color);\n}\n.colorOnPrimaryColor.dot:focus-visible, .colorOnPrimaryColor.dot.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.colorOnPrimaryColor.dot:focus:not(.focus-visible) {\n  outline: none;\n}\n.colorOnPrimaryColor.dot.isActive {\n  background: var(--text-color-on-primary);\n}\n.colorOnInvertedBackground.dot {\n  background: var(--placeholder-color);\n}\n.colorOnInvertedBackground.dot.isActive {\n  background: var(--text-color-on-inverted);\n}");export{o as default};
+var o={dot:"dot","focus-visible":"focus-visible",isActive:"isActive",colorOnPrimaryColor:"colorOnPrimaryColor",colorOnInvertedBackground:"colorOnInvertedBackground"};!function(o){const n="s_id-cedbbb07e913_3_58_1";if("undefined"!=typeof document){const r=document.head||document.getElementsByTagName("head")[0];if(r.querySelector("#"+n))return;const e=document.createElement("style");e.id=n,r.firstChild?r.insertBefore(e,r.firstChild):r.appendChild(e),e.appendChild(document.createTextNode(o))}else globalThis.injectedStyles&&(globalThis.injectedStyles[n]=o)}("/* stylelint-disable selector-class-pattern */\n.dot {\n  border: none;\n  margin: 0;\n  padding: 0;\n  width: auto;\n  overflow: visible;\n  background: transparent;\n  /* inherit font & color from ancestor */\n  color: inherit;\n  font: inherit;\n  /* Normalize `line-height`. Cannot be changed from `normal` in Firefox 4+. */\n  line-height: normal;\n  /* Corrects font smoothing for webkit */\n  -webkit-font-smoothing: inherit;\n  -moz-osx-font-smoothing: inherit;\n  /* Corrects inability to style clickable `input` types in iOS */\n  appearance: none;\n  width: 6px;\n  height: 6px;\n  cursor: pointer;\n  border-radius: 50%;\n  background: var(--ui-border-color);\n  transform-origin: center;\n  transform: scale(1);\n  transition: transform var(--motion-productive-long) var(--motion-timing-transition), background var(--motion-productive-long) var(--motion-timing-transition);\n}\n.dot:focus-visible, .dot.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.dot:focus:not(.focus-visible) {\n  outline: none;\n}\n.dot:focus-visible, .dot.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px hsla(209, 100%, 50%, 0.5), 0 0 0 1px var(--primary-hover-color) inset;\n}\n.dot:focus:not(.focus-visible) {\n  outline: none;\n}\n.dot:hover {\n  transform: scale(1.3);\n}\n.isActive {\n  background: var(--primary-color);\n  transform: scale(1.3);\n}\n.colorOnPrimaryColor.dot {\n  background: var(--primary-hover-color);\n}\n.colorOnPrimaryColor.dot:focus-visible, .colorOnPrimaryColor.dot.focus-visible {\n  outline: none;\n  z-index: 11;\n  border-radius: 4px;\n  box-shadow: 0 0 0 3px var(--text-color-on-primary-with-opacity), 0 0 0 1px var(--text-color-on-primary) inset;\n}\n.colorOnPrimaryColor.dot:focus:not(.focus-visible) {\n  outline: none;\n}\n.colorOnPrimaryColor.dot.isActive {\n  background: var(--text-color-on-primary);\n}\n.colorOnInvertedBackground.dot {\n  background: var(--placeholder-color);\n}\n.colorOnInvertedBackground.dot.isActive {\n  background: var(--text-color-on-inverted);\n}");export{o as default};
 //# sourceMappingURL=StepsDot.module.scss.js.map

package/dist/mocked_classnames/src/components/Steps/StepsGalleryHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepsGalleryHeader.js","sources":["../../../../../src/components/Steps/StepsGalleryHeader.tsx"],"sourcesContent":["import React, { FC, useCallback, useMemo } from \"react\";\nimport { range } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { StepsDot } from \"./StepsDot\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport styles from \"./StepsGalleryHeader.module.scss\";\nimport { StepsColor } from \"./Steps.types\";\n\nexport interface StepsGalleryHeaderProps extends VibeComponentProps {\n /*\n The index of the currently active step.\n /\n activeStepIndex: number;\n /\n The total number of steps.\n /\n stepsCount: number;\n /\n Callback fired when the active step changes.\n /\n onChangeActiveStep: (e: React.MouseEvent, stepIndex: number) => void;\n /\n A function to generate step descriptions for accessibility.\n /\n stepDescriptionFunc?: (stepIndex: number) => string;\n /\n The color theme of the gallery header.\n */\n color?: StepsColor;\n}\n\nexport const StepsGalleryHeader: FC<StepsGalleryHeaderProps> = ({\n activeStepIndex,\n stepsCount,\n onChangeActiveStep,\n stepDescriptionFunc,\n color,\n className\n}) => {\n const stepsPlaceholders = useMemo(() => range(stepsCount), [stepsCount]);\n const defaultStepDescriptionFunc = useCallback((stepIndex: number) => `Step number ${stepIndex}`, []);\n const overrideStepDescriptionFunc = stepDescriptionFunc \|\| defaultStepDescriptionFunc;\n const onClickFunctions = useMemo(\n () => stepsPlaceholders.map(stepIndex => (e: React.MouseEvent) => onChangeActiveStep(e, stepIndex)),\n [onChangeActiveStep, stepsPlaceholders]\n );\n\n const galleryDots = useMemo(\n () =>\n stepsPlaceholders.map(\n stepIndex => (\n <StepsDot\n isActive={activeStepIndex === stepIndex}\n key={`monday-style-step-dot-${stepIndex + 1}`}\n ariaLabel={overrideStepDescriptionFunc(stepIndex)}\n onClick={onClickFunctions[stepIndex]}\n color={color}\n className={styles.galleryHeaderDot}\n />\n ),\n []\n ),\n [activeStepIndex, color, onClickFunctions, overrideStepDescriptionFunc, stepsPlaceholders]\n );\n\n return (\n <div role=\"group\" className={cx(styles.galleryHeader, className)}>\n {galleryDots \|\| null}\n </div>\n );\n};\n"],"names":["StepsGalleryHeader","_ref","activeStepIndex","stepsCount","onChangeActiveStep","stepDescriptionFunc","color","className","stepsPlaceholders","useMemo","range","defaultStepDescriptionFunc","useCallback","stepIndex","concat","overrideStepDescriptionFunc","onClickFunctions","map","e","galleryDots","React","createElement","StepsDot","isActive","key","ariaLabel","onClick","styles","galleryHeaderDot","role","cx","galleryHeader"],"mappings":"gNA+BaA,EAAkD,SAAhCC,GAO1B,IANHC,EAAeD,EAAfC,gBACAC,EAAUF,EAAVE,WACAC,EAAkBH,EAAlBG,mBACAC,EAAmBJ,EAAnBI,oBACAC,EAAKL,EAALK,MACAC,EAASN,EAATM,UAEMC,EAAoBC,GAAQ,WAAA,OAAMC,EAAMP,KAAa,CAACA,IACtDQ,EAA6BC,GAAY,SAACC,GAAiB,MAAAC,eAAAA,OAAoBD,EAAW,GAAE,IAC5FE,EAA8BV,GAAuBM,EACrDK,EAAmBP,GACvB,WAAA,OAAMD,EAAkBS,KAAI,SAAAJ,GAAS,OAAI,SAACK,GAAmB,OAAKd,EAAmBc,EAAGL,EAAU,IAAC,GACnG,CAACT,EAAoBI,IAGjBW,EAAcV,GAClB,WAAA,OACED,EAAkBS,KAChB,SAAAJ,GAAS,OACPO,EAAAC,cAACC,EAAQ,CACPC,SAAUrB,IAAoBW,EAC9BW,6BAAGV,OAA2BD,EAAY,GAC1CY,UAAWV,EAA4BF,GACvCa,QAASV,EAAiBH,GAC1BP,MAAOA,EACPC,UAAWoB,EAAOC,kBAErB,GACD,MAEJ,CAAC1B,EAAiBI,EAAOU,EAAkBD,EAA6BP,IAG1E,OACEY,uBAAKS,KAAK,QAAQtB,UAAWuB,EAAGH,EAAOI,cAAexB,IACnDY,GAAe,KAGtB"}
1	+ {"version":3,"file":"StepsGalleryHeader.js","sources":["../../../../../src/components/Steps/StepsGalleryHeader.tsx"],"sourcesContent":["import React, { type FC, useCallback, useMemo } from \"react\";\nimport { range } from \"lodash-es\";\nimport cx from \"classnames\";\nimport { StepsDot } from \"./StepsDot\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport styles from \"./StepsGalleryHeader.module.scss\";\nimport { type StepsColor } from \"./Steps.types\";\n\nexport interface StepsGalleryHeaderProps extends VibeComponentProps {\n /*\n The index of the currently active step.\n /\n activeStepIndex: number;\n /\n The total number of steps.\n /\n stepsCount: number;\n /\n Callback fired when the active step changes.\n /\n onChangeActiveStep: (e: React.MouseEvent, stepIndex: number) => void;\n /\n A function to generate step descriptions for accessibility.\n /\n stepDescriptionFunc?: (stepIndex: number) => string;\n /\n The color theme of the gallery header.\n */\n color?: StepsColor;\n}\n\nexport const StepsGalleryHeader: FC<StepsGalleryHeaderProps> = ({\n activeStepIndex,\n stepsCount,\n onChangeActiveStep,\n stepDescriptionFunc,\n color,\n className\n}) => {\n const stepsPlaceholders = useMemo(() => range(stepsCount), [stepsCount]);\n const defaultStepDescriptionFunc = useCallback((stepIndex: number) => `Step number ${stepIndex}`, []);\n const overrideStepDescriptionFunc = stepDescriptionFunc \|\| defaultStepDescriptionFunc;\n const onClickFunctions = useMemo(\n () => stepsPlaceholders.map(stepIndex => (e: React.MouseEvent) => onChangeActiveStep(e, stepIndex)),\n [onChangeActiveStep, stepsPlaceholders]\n );\n\n const galleryDots = useMemo(\n () =>\n stepsPlaceholders.map(\n stepIndex => (\n <StepsDot\n isActive={activeStepIndex === stepIndex}\n key={`monday-style-step-dot-${stepIndex + 1}`}\n ariaLabel={overrideStepDescriptionFunc(stepIndex)}\n onClick={onClickFunctions[stepIndex]}\n color={color}\n className={styles.galleryHeaderDot}\n />\n ),\n []\n ),\n [activeStepIndex, color, onClickFunctions, overrideStepDescriptionFunc, stepsPlaceholders]\n );\n\n return (\n <div role=\"group\" className={cx(styles.galleryHeader, className)}>\n {galleryDots \|\| null}\n </div>\n );\n};\n"],"names":["StepsGalleryHeader","_ref","activeStepIndex","stepsCount","onChangeActiveStep","stepDescriptionFunc","color","className","stepsPlaceholders","useMemo","range","defaultStepDescriptionFunc","useCallback","stepIndex","concat","overrideStepDescriptionFunc","onClickFunctions","map","e","galleryDots","React","createElement","StepsDot","isActive","key","ariaLabel","onClick","styles","galleryHeaderDot","role","cx","galleryHeader"],"mappings":"gNA+BaA,EAAkD,SAAhCC,GAO1B,IANHC,EAAeD,EAAfC,gBACAC,EAAUF,EAAVE,WACAC,EAAkBH,EAAlBG,mBACAC,EAAmBJ,EAAnBI,oBACAC,EAAKL,EAALK,MACAC,EAASN,EAATM,UAEMC,EAAoBC,GAAQ,WAAA,OAAMC,EAAMP,KAAa,CAACA,IACtDQ,EAA6BC,GAAY,SAACC,GAAiB,MAAAC,eAAAA,OAAoBD,EAAW,GAAE,IAC5FE,EAA8BV,GAAuBM,EACrDK,EAAmBP,GACvB,WAAA,OAAMD,EAAkBS,KAAI,SAAAJ,GAAS,OAAI,SAACK,GAAmB,OAAKd,EAAmBc,EAAGL,EAAU,IAAC,GACnG,CAACT,EAAoBI,IAGjBW,EAAcV,GAClB,WAAA,OACED,EAAkBS,KAChB,SAAAJ,GAAS,OACPO,EAAAC,cAACC,EAAQ,CACPC,SAAUrB,IAAoBW,EAC9BW,6BAAGV,OAA2BD,EAAY,GAC1CY,UAAWV,EAA4BF,GACvCa,QAASV,EAAiBH,GAC1BP,MAAOA,EACPC,UAAWoB,EAAOC,kBAErB,GACD,MAEJ,CAAC1B,EAAiBI,EAAOU,EAAkBD,EAA6BP,IAG1E,OACEY,uBAAKS,KAAK,QAAQtB,UAAWuB,EAAGH,EAAOI,cAAexB,IACnDY,GAAe,KAGtB"}

package/dist/mocked_classnames/src/components/Steps/StepsGalleryHeader.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={galleryHeader:"galleryHeader",galleryHeaderDot:"galleryHeaderDot"};!function(e){const a="s_id-62748f4c4e74_3_58_0";if("undefined"!=typeof document){const l=document.head||document.getElementsByTagName("head")[0];if(l.querySelector("#"+a))return;const r=document.createElement("style");r.id=a,l.firstChild?l.insertBefore(r,l.firstChild):l.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[a]=e)}(".galleryHeader {\n  margin: 0 var(--spacing-small);\n  display: flex;\n  align-items: center;\n}\n.galleryHeader .galleryHeaderDot {\n  margin-right: var(--spacing-small);\n}\n.galleryHeader .galleryHeaderDot:last-child {\n  margin-right: 0;\n}");export{e as default};
+var e={galleryHeader:"galleryHeader",galleryHeaderDot:"galleryHeaderDot"};!function(e){const a="s_id-62748f4c4e74_3_58_1";if("undefined"!=typeof document){const l=document.head||document.getElementsByTagName("head")[0];if(l.querySelector("#"+a))return;const r=document.createElement("style");r.id=a,l.firstChild?l.insertBefore(r,l.firstChild):l.appendChild(r),r.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[a]=e)}(".galleryHeader {\n  margin: 0 var(--spacing-small);\n  display: flex;\n  align-items: center;\n}\n.galleryHeader .galleryHeaderDot {\n  margin-right: var(--spacing-small);\n}\n.galleryHeader .galleryHeaderDot:last-child {\n  margin-right: 0;\n}");export{e as default};
 //# sourceMappingURL=StepsGalleryHeader.module.scss.js.map

package/dist/mocked_classnames/src/components/Steps/StepsHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepsHeader.js","sources":["../../../../../src/components/Steps/StepsHeader.tsx"],"sourcesContent":["import React, { FC, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { StepsCommand } from \"./StepsCommand\";\nimport { StepsGalleryHeader, StepsGalleryHeaderProps } from \"./StepsGalleryHeader\";\nimport { StepsNumbersHeader, StepsNumbersHeaderProps } from \"./StepsNumbersHeader\";\nimport { FINISH_TEXT } from \"./StepsConstants\";\nimport { StepsType, StepsColor } from \"./Steps.types\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport Button, { ButtonProps } from \"../Button/Button\";\nimport styles from \"./StepsHeader.module.scss\";\n\nexport interface StepsHeaderProps extends VibeComponentProps {\n /*\n The type of steps header.\n /\n type: StepsType;\n /\n The index of the currently active step.\n /\n activeStepIndex: number;\n /\n Callback fired when the active step changes.\n /\n onChangeActiveStep: (e: React.MouseEvent, stepIndex: number) => void;\n /\n The total number of steps.\n /\n stepsCount: number;\n /\n If true, hides the navigation buttons.\n /\n areNavigationButtonsHidden: boolean;\n /\n Props applied to the back button.\n /\n backButtonProps: Partial<ButtonProps>;\n /\n Props applied to the next button.\n /\n nextButtonProps: Partial<ButtonProps>;\n /\n Props applied to the finish button.\n /\n finishButtonProps: Partial<ButtonProps>;\n /\n If true, hides the icons in the navigation buttons.\n /\n areButtonsIconsHidden: boolean;\n /\n The color theme of the steps header.\n /\n color?: StepsColor;\n /\n Callback fired when the finish button is clicked.\n */\n onFinish?: (e: React.MouseEvent) => void;\n}\n\nexport const StepsHeader: FC<StepsHeaderProps> = ({\n type,\n activeStepIndex,\n onChangeActiveStep,\n stepsCount,\n areNavigationButtonsHidden,\n backButtonProps,\n nextButtonProps,\n finishButtonProps,\n areButtonsIconsHidden,\n color = \"primary\",\n onFinish,\n className\n}: StepsHeaderProps) => {\n const SubHeaderComponent: FC<StepsGalleryHeaderProps \| StepsNumbersHeaderProps> =\n type === \"gallery\" ? StepsGalleryHeader : StepsNumbersHeader;\n\n // TODO: [breaking] make finish button as default in next major\n const showFinishButton = useMemo(() => {\n if (!onFinish) {\n return;\n }\n return activeStepIndex === stepsCount - 1;\n }, [activeStepIndex, onFinish, stepsCount]);\n\n return (\n <div className={cx(styles.header, className)}>\n {areNavigationButtonsHidden ? null : (\n <StepsCommand\n isNext={false}\n isIconHidden={areButtonsIconsHidden}\n onChangeActiveStep={onChangeActiveStep}\n activeStepIndex={activeStepIndex}\n stepsCount={stepsCount}\n buttonProps={backButtonProps}\n color={color}\n />\n )}\n <SubHeaderComponent\n activeStepIndex={activeStepIndex}\n stepsCount={stepsCount}\n onChangeActiveStep={onChangeActiveStep}\n color={color}\n />\n {areNavigationButtonsHidden ? null : (\n <>\n {showFinishButton ? (\n <Button onClick={onFinish} color={color} {...finishButtonProps}>\n {finishButtonProps?.children \|\| FINISH_TEXT}\n </Button>\n ) : (\n <StepsCommand\n isNext\n isIconHidden={areButtonsIconsHidden}\n activeStepIndex={activeStepIndex}\n onChangeActiveStep={onChangeActiveStep}\n stepsCount={stepsCount}\n buttonProps={nextButtonProps}\n color={color}\n />\n )}\n </>\n )}\n </div>\n );\n};\n"],"names":["StepsHeader","_ref","activeStepIndex","onChangeActiveStep","stepsCount","areNavigationButtonsHidden","backButtonProps","nextButtonProps","finishButtonProps","areButtonsIconsHidden","_ref$color","color","onFinish","className","SubHeaderComponent","type","StepsGalleryHeader","StepsNumbersHeader","showFinishButton","useMemo","React","createElement","cx","styles","header","StepsCommand","isNext","isIconHidden","buttonProps","Fragment","Button","Object","assign","onClick","children","FINISH_TEXT"],"mappings":"6WA0DaA,EAAoC,SAAzBC,GAaD,IAXrBC,EAAeD,EAAfC,gBACAC,EAAkBF,EAAlBE,mBACAC,EAAUH,EAAVG,WACAC,EAA0BJ,EAA1BI,2BACAC,EAAeL,EAAfK,gBACAC,EAAeN,EAAfM,gBACAC,EAAiBP,EAAjBO,kBACAC,EAAqBR,EAArBQ,sBAAqBC,EAAAT,EACrBU,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EACjBE,EAAQX,EAARW,SACAC,EAASZ,EAATY,UAEMC,EACK,YAdPb,EAAJc,KAcuBC,EAAqBC,EAGtCC,EAAmBC,GAAQ,WAC/B,GAAKP,EAGL,OAAOV,IAAoBE,EAAa,CACzC,GAAE,CAACF,EAAiBU,EAAUR,IAE/B,OACEgB,EAAKC,cAAA,MAAA,CAAAR,UAAWS,EAAGC,EAAOC,OAAQX,IAC/BR,EAA6B,KAC5Be,EAACC,cAAAI,GACCC,QAAQ,EACRC,aAAclB,EACdN,mBAAoBA,EACpBD,gBAAiBA,EACjBE,WAAYA,EACZwB,YAAatB,EACbK,MAAOA,IAGXS,EAAAC,cAACP,EACC,CAAAZ,gBAAiBA,EACjBE,WAAYA,EACZD,mBAAoBA,EACpBQ,MAAOA,IAERN,EAA6B,KAC5Be,EACGC,cAAAD,EAAAS,SAAA,KAAAX,EACCE,EAAAC,cAACS,EAAOC,OAAAC,OAAA,CAAAC,QAASrB,EAAUD,MAAOA,GAAWH,IAC1CA,aAAA,EAAAA,EAAmB0B,WAAYC,GAGlCf,EAACC,cAAAI,GACCC,QAAM,EACNC,aAAclB,EACdP,gBAAiBA,EACjBC,mBAAoBA,EACpBC,WAAYA,EACZwB,YAAarB,EACbI,MAAOA,KAOrB"}
1	+ {"version":3,"file":"StepsHeader.js","sources":["../../../../../src/components/Steps/StepsHeader.tsx"],"sourcesContent":["import React, { type FC, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport { StepsCommand } from \"./StepsCommand\";\nimport { StepsGalleryHeader, type StepsGalleryHeaderProps } from \"./StepsGalleryHeader\";\nimport { StepsNumbersHeader, type StepsNumbersHeaderProps } from \"./StepsNumbersHeader\";\nimport { FINISH_TEXT } from \"./StepsConstants\";\nimport { type StepsType, type StepsColor } from \"./Steps.types\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport Button, { type ButtonProps } from \"../Button/Button\";\nimport styles from \"./StepsHeader.module.scss\";\n\nexport interface StepsHeaderProps extends VibeComponentProps {\n /*\n The type of steps header.\n /\n type: StepsType;\n /\n The index of the currently active step.\n /\n activeStepIndex: number;\n /\n Callback fired when the active step changes.\n /\n onChangeActiveStep: (e: React.MouseEvent, stepIndex: number) => void;\n /\n The total number of steps.\n /\n stepsCount: number;\n /\n If true, hides the navigation buttons.\n /\n areNavigationButtonsHidden: boolean;\n /\n Props applied to the back button.\n /\n backButtonProps: Partial<ButtonProps>;\n /\n Props applied to the next button.\n /\n nextButtonProps: Partial<ButtonProps>;\n /\n Props applied to the finish button.\n /\n finishButtonProps: Partial<ButtonProps>;\n /\n If true, hides the icons in the navigation buttons.\n /\n areButtonsIconsHidden: boolean;\n /\n The color theme of the steps header.\n /\n color?: StepsColor;\n /\n Callback fired when the finish button is clicked.\n */\n onFinish?: (e: React.MouseEvent) => void;\n}\n\nexport const StepsHeader: FC<StepsHeaderProps> = ({\n type,\n activeStepIndex,\n onChangeActiveStep,\n stepsCount,\n areNavigationButtonsHidden,\n backButtonProps,\n nextButtonProps,\n finishButtonProps,\n areButtonsIconsHidden,\n color = \"primary\",\n onFinish,\n className\n}: StepsHeaderProps) => {\n const SubHeaderComponent: FC<StepsGalleryHeaderProps \| StepsNumbersHeaderProps> =\n type === \"gallery\" ? StepsGalleryHeader : StepsNumbersHeader;\n\n // TODO: [breaking] make finish button as default in next major\n const showFinishButton = useMemo(() => {\n if (!onFinish) {\n return;\n }\n return activeStepIndex === stepsCount - 1;\n }, [activeStepIndex, onFinish, stepsCount]);\n\n return (\n <div className={cx(styles.header, className)}>\n {areNavigationButtonsHidden ? null : (\n <StepsCommand\n isNext={false}\n isIconHidden={areButtonsIconsHidden}\n onChangeActiveStep={onChangeActiveStep}\n activeStepIndex={activeStepIndex}\n stepsCount={stepsCount}\n buttonProps={backButtonProps}\n color={color}\n />\n )}\n <SubHeaderComponent\n activeStepIndex={activeStepIndex}\n stepsCount={stepsCount}\n onChangeActiveStep={onChangeActiveStep}\n color={color}\n />\n {areNavigationButtonsHidden ? null : (\n <>\n {showFinishButton ? (\n <Button onClick={onFinish} color={color} {...finishButtonProps}>\n {finishButtonProps?.children \|\| FINISH_TEXT}\n </Button>\n ) : (\n <StepsCommand\n isNext\n isIconHidden={areButtonsIconsHidden}\n activeStepIndex={activeStepIndex}\n onChangeActiveStep={onChangeActiveStep}\n stepsCount={stepsCount}\n buttonProps={nextButtonProps}\n color={color}\n />\n )}\n </>\n )}\n </div>\n );\n};\n"],"names":["StepsHeader","_ref","activeStepIndex","onChangeActiveStep","stepsCount","areNavigationButtonsHidden","backButtonProps","nextButtonProps","finishButtonProps","areButtonsIconsHidden","_ref$color","color","onFinish","className","SubHeaderComponent","type","StepsGalleryHeader","StepsNumbersHeader","showFinishButton","useMemo","React","createElement","cx","styles","header","StepsCommand","isNext","isIconHidden","buttonProps","Fragment","Button","Object","assign","onClick","children","FINISH_TEXT"],"mappings":"6WA0DaA,EAAoC,SAAzBC,GAaD,IAXrBC,EAAeD,EAAfC,gBACAC,EAAkBF,EAAlBE,mBACAC,EAAUH,EAAVG,WACAC,EAA0BJ,EAA1BI,2BACAC,EAAeL,EAAfK,gBACAC,EAAeN,EAAfM,gBACAC,EAAiBP,EAAjBO,kBACAC,EAAqBR,EAArBQ,sBAAqBC,EAAAT,EACrBU,MAAAA,OAAQ,IAAHD,EAAG,UAASA,EACjBE,EAAQX,EAARW,SACAC,EAASZ,EAATY,UAEMC,EACK,YAdPb,EAAJc,KAcuBC,EAAqBC,EAGtCC,EAAmBC,GAAQ,WAC/B,GAAKP,EAGL,OAAOV,IAAoBE,EAAa,CACzC,GAAE,CAACF,EAAiBU,EAAUR,IAE/B,OACEgB,EAAKC,cAAA,MAAA,CAAAR,UAAWS,EAAGC,EAAOC,OAAQX,IAC/BR,EAA6B,KAC5Be,EAACC,cAAAI,GACCC,QAAQ,EACRC,aAAclB,EACdN,mBAAoBA,EACpBD,gBAAiBA,EACjBE,WAAYA,EACZwB,YAAatB,EACbK,MAAOA,IAGXS,EAAAC,cAACP,EACC,CAAAZ,gBAAiBA,EACjBE,WAAYA,EACZD,mBAAoBA,EACpBQ,MAAOA,IAERN,EAA6B,KAC5Be,EACGC,cAAAD,EAAAS,SAAA,KAAAX,EACCE,EAAAC,cAACS,EAAOC,OAAAC,OAAA,CAAAC,QAASrB,EAAUD,MAAOA,GAAWH,IAC1CA,aAAA,EAAAA,EAAmB0B,WAAYC,GAGlCf,EAACC,cAAAI,GACCC,QAAM,EACNC,aAAclB,EACdP,gBAAiBA,EACjBC,mBAAoBA,EACpBC,WAAYA,EACZwB,YAAarB,EACbI,MAAOA,KAOrB"}

package/dist/mocked_classnames/src/components/Steps/StepsHeader.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={header:"header"};!function(e){const t="s_id-918f12c2f9aa_3_58_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--spacing-small);\n}");export{e as default};
+var e={header:"header"};!function(e){const t="s_id-918f12c2f9aa_3_58_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const a=document.createElement("style");a.id=t,n.firstChild?n.insertBefore(a,n.firstChild):n.appendChild(a),a.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".header {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: var(--spacing-small);\n}");export{e as default};
 //# sourceMappingURL=StepsHeader.module.scss.js.map

package/dist/mocked_classnames/src/components/Steps/StepsNumbersHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepsNumbersHeader.js","sources":["../../../../../src/components/Steps/StepsNumbersHeader.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { FC, useMemo } from \"react\";\nimport VibeComponentProps from \"../../types/VibeComponentProps\";\nimport Text from \"../Text/Text\";\nimport styles from \"./StepsNumbersHeader.module.scss\";\nimport { StepsColor } from \"./Steps.types\";\n\nexport interface StepsNumbersHeaderProps extends VibeComponentProps {\n /*\n The index of the currently active step.\n /\n activeStepIndex: number;\n /\n The total number of steps.\n /\n stepsCount: number;\n /\n The color theme of the steps numbers header.\n */\n color?: StepsColor;\n}\n\nexport const StepsNumbersHeader: FC<StepsNumbersHeaderProps> = ({ activeStepIndex, stepsCount, color }) => {\n const textColor = useMemo(() => {\n if (color === \"primary\") {\n return color;\n } else {\n return color === \"on-inverted-background\" ? \"onInverted\" : \"onPrimary\";\n }\n }, [color]);\n\n return (\n <Text type=\"text2\" color={textColor} className={cx(styles.numbers)}>{`${\n activeStepIndex + 1\n } \\\\ ${stepsCount}`}</Text>\n );\n};\n"],"names":["StepsNumbersHeader","_ref","activeStepIndex","stepsCount","color","textColor","useMemo","React","createElement","Text","type","className","cx","styles","numbers","concat"],"mappings":"mJAsBaA,EAAkD,SAAhCC,GAA2E,IAAxCC,EAAeD,EAAfC,gBAAiBC,EAAUF,EAAVE,WAAYC,EAAKH,EAALG,MACvFC,EAAYC,GAAQ,WACxB,MAAc,YAAVF,EACKA,EAEU,2BAAVA,EAAqC,aAAe,WAE/D,GAAG,CAACA,IAEJ,OACEG,EAAAC,cAACC,EAAI,CAACC,KAAK,QAAQN,MAAOC,EAAWM,UAAWC,EAAGC,EAAOC,UAAQ,GAAAC,OAChEb,EAAkB,EACpB,QAAAa,OAAOZ,GAEX"}
1	+ {"version":3,"file":"StepsNumbersHeader.js","sources":["../../../../../src/components/Steps/StepsNumbersHeader.tsx"],"sourcesContent":["import cx from \"classnames\";\nimport React, { type FC, useMemo } from \"react\";\nimport type VibeComponentProps from \"../../types/VibeComponentProps\";\nimport Text from \"../Text/Text\";\nimport styles from \"./StepsNumbersHeader.module.scss\";\nimport { type StepsColor } from \"./Steps.types\";\n\nexport interface StepsNumbersHeaderProps extends VibeComponentProps {\n /*\n The index of the currently active step.\n /\n activeStepIndex: number;\n /\n The total number of steps.\n /\n stepsCount: number;\n /\n The color theme of the steps numbers header.\n */\n color?: StepsColor;\n}\n\nexport const StepsNumbersHeader: FC<StepsNumbersHeaderProps> = ({ activeStepIndex, stepsCount, color }) => {\n const textColor = useMemo(() => {\n if (color === \"primary\") {\n return color;\n } else {\n return color === \"on-inverted-background\" ? \"onInverted\" : \"onPrimary\";\n }\n }, [color]);\n\n return (\n <Text type=\"text2\" color={textColor} className={cx(styles.numbers)}>{`${\n activeStepIndex + 1\n } \\\\ ${stepsCount}`}</Text>\n );\n};\n"],"names":["StepsNumbersHeader","_ref","activeStepIndex","stepsCount","color","textColor","useMemo","React","createElement","Text","type","className","cx","styles","numbers","concat"],"mappings":"mJAsBaA,EAAkD,SAAhCC,GAA2E,IAAxCC,EAAeD,EAAfC,gBAAiBC,EAAUF,EAAVE,WAAYC,EAAKH,EAALG,MACvFC,EAAYC,GAAQ,WACxB,MAAc,YAAVF,EACKA,EAEU,2BAAVA,EAAqC,aAAe,WAE/D,GAAG,CAACA,IAEJ,OACEG,EAAAC,cAACC,EAAI,CAACC,KAAK,QAAQN,MAAOC,EAAWM,UAAWC,EAAGC,EAAOC,UAAQ,GAAAC,OAChEb,EAAkB,EACpB,QAAAa,OAAOZ,GAEX"}

package/dist/mocked_classnames/src/components/Steps/StepsNumbersHeader.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={numbers:"numbers"};!function(e){const t="s_id-126f9ab60838_3_58_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".numbers {\n  margin: 0 var(--spacing-small);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}");export{e as default};
+var e={numbers:"numbers"};!function(e){const t="s_id-126f9ab60838_3_58_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const o=document.createElement("style");o.id=t,n.firstChild?n.insertBefore(o,n.firstChild):n.appendChild(o),o.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".numbers {\n  margin: 0 var(--spacing-small);\n  -webkit-font-smoothing: var(--font-smoothing-webkit);\n  -moz-osx-font-smoothing: var(--font-smoothing-moz);\n}");export{e as default};
 //# sourceMappingURL=StepsNumbersHeader.module.scss.js.map

package/dist/mocked_classnames/src/components/Switch/Switch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Switch.js","sources":["../../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import React, { ChangeEvent, forwardRef, ReactElement, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport useSwitch from \"../../hooks/useSwitch\";\nimport { VibeComponentProps } from \"../../types\";\nimport { MockToggleProps } from \"../Toggle/MockToggle\";\nimport styles from \"./Switch.module.scss\";\n\nexport interface SwitchProps extends VibeComponentProps {\n /*\n The name of the switch input.\n /\n name?: string;\n /\n The value associated with the switch.\n /\n value?: string;\n /\n The ARIA role of the switch.\n /\n role?: string;\n /\n If true, the switch is disabled.\n /\n disabled?: boolean;\n /\n The ARIA label for accessibility.\n /\n ariaLabel?: string;\n /\n The ID of the element labeling the switch.\n /\n ariaLabelledBy?: string;\n /\n If true, the switch is checked.\n /\n checked?: boolean;\n /\n Class name applied to the input element.\n /\n inputClassName?: string;\n /\n Callback fired when the switch state changes.\n /\n onChange?: (value: boolean, event: ChangeEvent<HTMLInputElement>) => void;\n /\n The ID of the element controlled by the switch.\n /\n ariaControls?: string;\n /\n If true, the switch is checked by default.\n /\n defaultChecked?: boolean;\n /\n The child component rendered inside the switch.\n /\n children?: ReactElement<MockToggleProps>;\n /\n Class name applied to the wrapper element.\n */\n wrapperClassName?: string;\n}\n\n// TODO no story\nconst Switch = forwardRef(\n (\n {\n id,\n name,\n value,\n role,\n disabled,\n ariaLabel,\n ariaLabelledBy,\n checked,\n inputClassName,\n onChange,\n ariaControls,\n defaultChecked,\n children: originalChildren,\n wrapperClassName,\n \"data-testid\": dataTestId\n }: SwitchProps,\n ref: React.ForwardedRef<HTMLInputElement>\n ) => {\n const { onChange: overrideOnChange, isChecked: overrideChecked } = useSwitch({\n isDisabled: disabled,\n isChecked: checked,\n defaultChecked,\n onChange\n });\n\n const children = useMemo(\n () =>\n React.cloneElement(originalChildren, {\n ...originalChildren?.props,\n checked: overrideChecked\n }),\n [originalChildren, overrideChecked]\n );\n\n return (\n <label htmlFor={id} className={wrapperClassName}>\n <input\n ref={ref}\n id={id}\n aria-controls={ariaControls}\n value={value}\n name={name}\n type=\"checkbox\"\n className={cx(styles[\"hidden-switch\"], inputClassName)}\n checked={overrideChecked}\n role={role ? role : \"switch\"}\n onChange={overrideOnChange}\n disabled={disabled}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-checked={overrideChecked}\n data-testid={dataTestId}\n />\n {children}\n </label>\n );\n }\n);\n\nexport default Switch;\n"],"names":["Switch","forwardRef","_ref","ref","id","name","value","role","disabled","ariaLabel","ariaLabelledBy","inputClassName","ariaControls","originalChildren","children","wrapperClassName","dataTestId","_useSwitch","useSwitch","isDisabled","isChecked","checked","defaultChecked","onChange","overrideOnChange","overrideChecked","useMemo","React","cloneElement","Object","assign","props","htmlFor","className","createElement","type","cx","styles"],"mappings":"kKA+DMA,IAAAA,EAASC,GACb,SAAAC,EAkBEC,GACE,IAjBAC,EAAEF,EAAFE,GACAC,EAAIH,EAAJG,KACAC,EAAKJ,EAALI,MACAC,EAAIL,EAAJK,KACAC,EAAQN,EAARM,SACAC,EAASP,EAATO,UACAC,EAAcR,EAAdQ,eAEAC,EAAcT,EAAdS,eAEAC,EAAYV,EAAZU,aAEUC,EAAgBX,EAA1BY,SACAC,EAAgBb,EAAhBa,iBACeC,EAAUd,EAAzB,eAIFe,EAAmEC,EAAU,CAC3EC,WAAYX,EACZY,UAbOlB,EAAPmB,QAcAC,eAVcpB,EAAdoB,eAWAC,SAbQrB,EAARqB,WASgBC,EAAgBP,EAA1BM,SAAuCE,EAAeR,EAA1BG,UAO9BN,EAAWY,GACf,WAAA,OACEC,EAAMC,aAAaf,EAAgBgB,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAC9BjB,aAAA,EAAAA,EAAkBkB,OACrB,CAAAV,QAASI,IACT,GACJ,CAACZ,EAAkBY,IAGrB,OACEE,yBAAOK,QAAS5B,EAAI6B,UAAWlB,GAC7BY,EAAAO,cAAA,QAAA,CACE/B,IAAKA,EACLC,GAAIA,EAAE,gBACSQ,EACfN,MAAOA,EACPD,KAAMA,EACN8B,KAAK,WACLF,UAAWG,EAAGC,EAAO,iBAAkB1B,GACvCU,QAASI,EACTlB,KAAMA,GAAc,SACpBgB,SAAUC,EACVhB,SAAUA,EAAQ,aACNC,EAAS,kBACJC,EAAc,eACjBe,EAAe,cAChBT,IAEdF,EAGP"}
1	+ {"version":3,"file":"Switch.js","sources":["../../../../../src/components/Switch/Switch.tsx"],"sourcesContent":["import React, { type ChangeEvent, forwardRef, type ReactElement, useMemo } from \"react\";\nimport cx from \"classnames\";\nimport useSwitch from \"../../hooks/useSwitch\";\nimport { type VibeComponentProps } from \"../../types\";\nimport { type MockToggleProps } from \"../Toggle/MockToggle\";\nimport styles from \"./Switch.module.scss\";\n\nexport interface SwitchProps extends VibeComponentProps {\n /*\n The name of the switch input.\n /\n name?: string;\n /\n The value associated with the switch.\n /\n value?: string;\n /\n The ARIA role of the switch.\n /\n role?: string;\n /\n If true, the switch is disabled.\n /\n disabled?: boolean;\n /\n The ARIA label for accessibility.\n /\n ariaLabel?: string;\n /\n The ID of the element labeling the switch.\n /\n ariaLabelledBy?: string;\n /\n If true, the switch is checked.\n /\n checked?: boolean;\n /\n Class name applied to the input element.\n /\n inputClassName?: string;\n /\n Callback fired when the switch state changes.\n /\n onChange?: (value: boolean, event: ChangeEvent<HTMLInputElement>) => void;\n /\n The ID of the element controlled by the switch.\n /\n ariaControls?: string;\n /\n If true, the switch is checked by default.\n /\n defaultChecked?: boolean;\n /\n The child component rendered inside the switch.\n /\n children?: ReactElement<MockToggleProps>;\n /\n Class name applied to the wrapper element.\n */\n wrapperClassName?: string;\n}\n\n// TODO no story\nconst Switch = forwardRef(\n (\n {\n id,\n name,\n value,\n role,\n disabled,\n ariaLabel,\n ariaLabelledBy,\n checked,\n inputClassName,\n onChange,\n ariaControls,\n defaultChecked,\n children: originalChildren,\n wrapperClassName,\n \"data-testid\": dataTestId\n }: SwitchProps,\n ref: React.ForwardedRef<HTMLInputElement>\n ) => {\n const { onChange: overrideOnChange, isChecked: overrideChecked } = useSwitch({\n isDisabled: disabled,\n isChecked: checked,\n defaultChecked,\n onChange\n });\n\n const children = useMemo(\n () =>\n React.cloneElement(originalChildren, {\n ...originalChildren?.props,\n checked: overrideChecked\n }),\n [originalChildren, overrideChecked]\n );\n\n return (\n <label htmlFor={id} className={wrapperClassName}>\n <input\n ref={ref}\n id={id}\n aria-controls={ariaControls}\n value={value}\n name={name}\n type=\"checkbox\"\n className={cx(styles[\"hidden-switch\"], inputClassName)}\n checked={overrideChecked}\n role={role ? role : \"switch\"}\n onChange={overrideOnChange}\n disabled={disabled}\n aria-label={ariaLabel}\n aria-labelledby={ariaLabelledBy}\n aria-checked={overrideChecked}\n data-testid={dataTestId}\n />\n {children}\n </label>\n );\n }\n);\n\nexport default Switch;\n"],"names":["Switch","forwardRef","_ref","ref","id","name","value","role","disabled","ariaLabel","ariaLabelledBy","inputClassName","ariaControls","originalChildren","children","wrapperClassName","dataTestId","_useSwitch","useSwitch","isDisabled","isChecked","checked","defaultChecked","onChange","overrideOnChange","overrideChecked","useMemo","React","cloneElement","Object","assign","props","htmlFor","className","createElement","type","cx","styles"],"mappings":"kKA+DMA,IAAAA,EAASC,GACb,SAAAC,EAkBEC,GACE,IAjBAC,EAAEF,EAAFE,GACAC,EAAIH,EAAJG,KACAC,EAAKJ,EAALI,MACAC,EAAIL,EAAJK,KACAC,EAAQN,EAARM,SACAC,EAASP,EAATO,UACAC,EAAcR,EAAdQ,eAEAC,EAAcT,EAAdS,eAEAC,EAAYV,EAAZU,aAEUC,EAAgBX,EAA1BY,SACAC,EAAgBb,EAAhBa,iBACeC,EAAUd,EAAzB,eAIFe,EAAmEC,EAAU,CAC3EC,WAAYX,EACZY,UAbOlB,EAAPmB,QAcAC,eAVcpB,EAAdoB,eAWAC,SAbQrB,EAARqB,WASgBC,EAAgBP,EAA1BM,SAAuCE,EAAeR,EAA1BG,UAO9BN,EAAWY,GACf,WAAA,OACEC,EAAMC,aAAaf,EAAgBgB,OAAAC,OAAAD,OAAAC,OAAA,CAAA,EAC9BjB,aAAA,EAAAA,EAAkBkB,OACrB,CAAAV,QAASI,IACT,GACJ,CAACZ,EAAkBY,IAGrB,OACEE,yBAAOK,QAAS5B,EAAI6B,UAAWlB,GAC7BY,EAAAO,cAAA,QAAA,CACE/B,IAAKA,EACLC,GAAIA,EAAE,gBACSQ,EACfN,MAAOA,EACPD,KAAMA,EACN8B,KAAK,WACLF,UAAWG,EAAGC,EAAO,iBAAkB1B,GACvCU,QAASI,EACTlB,KAAMA,GAAc,SACpBgB,SAAUC,EACVhB,SAAUA,EAAQ,aACNC,EAAS,kBACJC,EAAc,eACjBe,EAAe,cAChBT,IAEdF,EAGP"}

package/dist/mocked_classnames/src/components/Switch/Switch.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={"hidden-switch":"hidden-switch"};!function(e){const t="s_id-4506b47fa00c_3_58_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".hidden-switch { /* stylelint-disable-line selector-class-pattern */\n  opacity: 0;\n  width: 0;\n  height: 0;\n  position: absolute;\n}");export{e as default};
+var e={"hidden-switch":"hidden-switch"};!function(e){const t="s_id-4506b47fa00c_3_58_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const i=document.createElement("style");i.id=t,n.firstChild?n.insertBefore(i,n.firstChild):n.appendChild(i),i.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".hidden-switch { /* stylelint-disable-line selector-class-pattern */\n  opacity: 0;\n  width: 0;\n  height: 0;\n  position: absolute;\n}");export{e as default};
 //# sourceMappingURL=Switch.module.scss.js.map

package/dist/mocked_classnames/src/components/Table/Table/Table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.js","sources":["../../../../../../src/components/Table/Table/Table.tsx"],"sourcesContent":["import React, { forwardRef, ReactElement, UIEventHandler, useCallback, useMemo, useRef, useState } from \"react\";\nimport cx from \"classnames\";\nimport { SubIcon, VibeComponentProps, withStaticProps } from \"../../../types\";\nimport { TableHeaderProps } from \"../TableHeader/TableHeader\";\nimport { TableBodyProps } from \"../TableBody/TableBody\";\nimport { getTableRowLayoutStyles } from \"./tableHelpers\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport { RowHeights, RowSizes as RowSizesEnum } from \"./TableConsts\";\nimport { RowSizes } from \"./Table.types\";\nimport styles from \"./Table.module.scss\";\nimport { TableProvider } from \"../context/TableContext/TableContext\";\nimport { TableRowMenuProvider } from \"../context/TableRowMenuContext/TableRowMenuContext\";\nimport useMergeRef from \"../../../hooks/useMergeRef\";\nimport { TableProviderValue } from \"../context/TableContext/TableContext.types\";\nimport { TableRowMenuProviderValue } from \"../context/TableRowMenuContext/TableRowMenuContext.types\";\n\nexport type TableLoadingStateType = \"long-text\" \| \"medium-text\" \| \"circle\" \| \"rectangle\";\n\ntype Width = number \| `${number}%` \| `${number}px` \| `${number}fr`;\n\nexport interface TableColumn {\n /*\n Unique identifier for the column.\n /\n id: string;\n /\n Column title displayed in the header.\n /\n title: string;\n /\n Additional information displayed as a tooltip.\n /\n infoContent?: string;\n /\n Column width configuration.\n /\n width?: Width \| { min: Width; max: Width };\n /\n Icon displayed next to the column title.\n /\n icon?: SubIcon;\n /\n Loading state type for the column when data is being fetched.\n /\n loadingStateType?: TableLoadingStateType;\n}\n\nexport interface TableProps extends VibeComponentProps {\n /\n Defines the columns of the table.\n /\n columns: TableColumn[];\n /\n State of the data being displayed (loading or error).\n /\n dataState?: {\n isLoading?: boolean;\n isError?: boolean;\n };\n /\n React element displayed when there is an error state.\n /\n errorState: ReactElement;\n /\n React element displayed when there is no data.\n /\n emptyState: ReactElement;\n /\n Custom styles for the table.\n /\n style?: React.CSSProperties;\n /\n The child components inside the table, such as `<TableHeader />` and `<TableBody />`.\n /\n children?:\n \| ReactElement<TableHeaderProps>\n \| ReactElement<TableBodyProps>\n \| Array<ReactElement<TableHeaderProps> \| ReactElement<TableBodyProps>>;\n /\n The row size of the table.\n /\n size?: RowSizes;\n /\n If true, removes the table's outer border.\n /\n withoutBorder?: boolean;\n}\n\nconst Table = forwardRef(\n (\n {\n id,\n className,\n \"data-testid\": dataTestId,\n columns,\n errorState,\n emptyState,\n dataState,\n style,\n children,\n size = \"medium\",\n withoutBorder\n }: TableProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const tableRootRef = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRef(ref, tableRootRef);\n\n const [isMenuOpen, setIsMenuOpen] = useState<boolean>(false);\n const [hoveredRowRef, setHoveredRowRef] = useState<React.RefObject<HTMLDivElement>>(null);\n\n const resetHoveredRow = useCallback(() => {\n setIsMenuOpen(false);\n setHoveredRowRef(null);\n }, []);\n\n const [isVirtualized, setIsVirtualized] = useState<boolean>(false);\n const markTableAsVirtualized = useCallback(() => {\n setIsVirtualized(true);\n }, []);\n\n const [isScrolled, setIsScrolled] = useState<boolean>(false);\n\n const onScroll = useCallback<UIEventHandler<HTMLDivElement>>(\n e => {\n resetHoveredRow();\n if (!isVirtualized) {\n const newLeft = (e.target as HTMLDivElement).scrollLeft;\n const hasScroll = newLeft > 0;\n setIsScrolled(prevScroll => (prevScroll !== hasScroll ? hasScroll : prevScroll));\n }\n },\n [resetHoveredRow, isVirtualized]\n );\n\n const { gridTemplateColumns } = getTableRowLayoutStyles(columns);\n\n /\n The `--table-grid-template-columns` and `--table-row-size` variables will be available under each <Table /> scope\n * and will be consumed in the stylesheets of its children (<TableHeader />, <TableRow />, <TableHeaderCell />)\n */\n const calculatedStyle = {\n \"--table-grid-template-columns\": gridTemplateColumns,\n \"--table-row-size\": `${RowHeights[size]}px`,\n ...style\n } as React.CSSProperties;\n\n const tableProviderValue = useMemo<TableProviderValue>(\n () => ({\n columns,\n dataState,\n emptyState,\n errorState,\n size,\n tableRootRef,\n isVirtualized,\n markTableAsVirtualized,\n isScrolled,\n setIsScrolled: (scrollLeft: boolean) => setIsScrolled(scrollLeft)\n }),\n [columns, dataState, emptyState, errorState, isVirtualized, markTableAsVirtualized, isScrolled, size]\n );\n\n const tableRowMenuProviderValue = useMemo<TableRowMenuProviderValue>(\n () => ({\n tableRootRef,\n hoveredRowRef,\n isMenuOpen,\n resetHoveredRow,\n setHoveredRowRef: (rowRef: React.RefObject<HTMLDivElement>) => setHoveredRowRef(rowRef),\n setIsMenuOpen: (isOpen: boolean) => setIsMenuOpen(isOpen)\n }),\n [hoveredRowRef, isMenuOpen, resetHoveredRow, setHoveredRowRef]\n );\n\n return (\n <TableProvider value={tableProviderValue}>\n <TableRowMenuProvider value={tableRowMenuProviderValue}>\n <div\n ref={mergedRef}\n id={id}\n className={cx(\n styles.table,\n {\n [styles.border]: !withoutBorder,\n [styles.virtualized]: isVirtualized,\n [styles.hasScroll]: isScrolled\n },\n className\n )}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TABLE, id)}\n role=\"table\"\n style={calculatedStyle}\n onScroll={onScroll}\n >\n {children}\n </div>\n </TableRowMenuProvider>\n </TableProvider>\n );\n }\n);\n\ninterface TableStaticProps {\n sizes: typeof RowSizesEnum;\n}\n\nexport default withStaticProps<TableProps, TableStaticProps>(Table, { sizes: RowSizesEnum });\n"],"names":["withStaticProps","forwardRef","_ref","ref","id","className","dataTestId","columns","errorState","emptyState","dataState","style","children","_ref$size","size","withoutBorder","tableRootRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","isMenuOpen","setIsMenuOpen","_useState3","_useState4","hoveredRowRef","setHoveredRowRef","resetHoveredRow","useCallback","_useState5","_useState6","isVirtualized","setIsVirtualized","markTableAsVirtualized","_useState7","_useState8","isScrolled","setIsScrolled","onScroll","e","hasScroll","target","scrollLeft","prevScroll","_getTableRowLayoutSty","getTableRowLayoutStyles","calculatedStyle","Object","assign","gridTemplateColumns","concat","RowHeights","tableProviderValue","useMemo","tableRowMenuProviderValue","rowRef","isOpen","React","createElement","TableProvider","value","TableRowMenuProvider","cx","styles","table","_defineProperty","border","virtualized","getTestId","ComponentDefaultTestId","TABLE","role","sizes","RowSizesEnum"],"mappings":"~~uzBAyFA~~,IAuHeA,EAAAA,EAvHDC,GACZ,SAAAC,EAcEC,GACE,IAbAC,EAAEF,EAAFE,GACAC,EAASH,EAATG,UACeC,EAAUJ,EAAzB,eACAK,EAAOL,EAAPK,QACAC,EAAUN,EAAVM,WACAC,EAAUP,EAAVO,WACAC,EAASR,EAATQ,UACAC,EAAKT,EAALS,MACAC,EAAQV,EAARU,SAAQC,EAAAX,EACRY,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACfE,EAAab,EAAba,cAIIC,EAAeC,EAAuB,MACtCC,EAAYC,EAAYhB,EAAKa,GAEnCI,EAAoCC,GAAkB,GAAMC,EAAAC,EAAAH,EAAA,GAArDI,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAChCI,EAA0CL,EAA0C,MAAKM,EAAAJ,EAAAG,EAAA,GAAlFE,EAAaD,EAAA,GAAEE,EAAgBF,EAAA,GAEhCG,EAAkBC,GAAY,WAClCN,GAAc,GACdI,EAAiB,KAClB,GAAE,IAEHG,EAA0CX,GAAkB,GAAMY,EAAAV,EAAAS,EAAA,GAA3DE,EAAaD,EAAA,GAAEE,EAAgBF,EAAA,GAChCG,EAAyBL,GAAY,WACzCI,GAAiB,EAClB,GAAE,IAEHE,EAAoChB,GAAkB,GAAMiB,EAAAf,EAAAc,EAAA,GAArDE,EAAUD,EAAA,GAAEE,EAAaF,EAAA,GAE1BG,EAAWV,GACf,SAAAW,GAEE,GADAZ,KACKI,EAAe,CAClB,IACMS,EADWD,EAAEE,OAA0BC,WACjB,EAC5BL,GAAc,SAAAM,GAAU,OAAKA,IAAeH,EAAYA,EAAYG,CAAU,GAC/E,CACH,GACA,CAAChB,EAAiBI,IAGpBa,EAAgCC,EAAwBzC,GAMlD0C,EAAkBC,OAAAC,OAAA,CACtB,gCAPyBJ,EAAnBK,oBAQN,sBAAkBC,OAAKC,EAAWxC,GAAK,OACpCH,GAGC4C,EAAqBC,GACzB,WAAA,MAAO,CACLjD,QAAAA,EACAG,UAAAA,EACAD,WAAAA,EACAD,WAAAA,EACAM,KAAAA,EACAE,aAAAA,EACAkB,cAAAA,EACAE,uBAAAA,EACAG,WAAAA,EACAC,cAAe,SAACK,GAAmB,OAAKL,EAAcK,EAAW,EAClE,GACD,CAACtC,EAASG,EAAWD,EAAYD,EAAY0B,EAAeE,EAAwBG,EAAYzB,IAG5F2C,GAA4BD,GAChC,WAAA,MAAO,CACLxC,aAAAA,EACAY,cAAAA,EACAJ,WAAAA,EACAM,gBAAAA,EACAD,iBAAkB,SAAC6B,GAAuC,OAAK7B,EAAiB6B,EAAO,EACvFjC,cAAe,SAACkC,GAAe,OAAKlC,EAAckC,EAAO,EACzD,GACF,CAAC/B,EAAeJ,EAAYM,EAAiBD,IAG/C,OACE+B,EAACC,cAAAC,EAAc,CAAAC,MAAOR,GACpBK,EAAAC,cAACG,EAAoB,CAACD,MAAON,IAC3BG,EAAAC,cAAA,MAAA,CACE1D,IAAKe,EACLd,GAAIA,EACJC,UAAW4D,EACTC,EAAOC,MAAKC,EAAAA,EAAAA,EAAA,CAAA,EAETF,EAAOG,QAAUtD,GACjBmD,EAAOI,YAAcpC,GACrBgC,EAAOvB,UAAYJ,GAEtBlC,GAEW,cAAAC,GAAciE,EAAUC,EAAuBC,MAAOrE,GACnEsE,KAAK,QACL/D,MAAOsC,EACPR,SAAUA,GAET7B,IAKX,IAOkE,CAAE+D,MAAOC"}
1	+ {"version":3,"file":"Table.js","sources":["../../../../../../src/components/Table/Table/Table.tsx"],"sourcesContent":["import React, {\n forwardRef,\n type ReactElement,\n type UIEventHandler,\n useCallback,\n useMemo,\n useRef,\n useState\n} from \"react\";\nimport cx from \"classnames\";\nimport { type SubIcon, type VibeComponentProps, withStaticProps } from \"../../../types\";\nimport { type TableHeaderProps } from \"../TableHeader/TableHeader\";\nimport { type TableBodyProps } from \"../TableBody/TableBody\";\nimport { getTableRowLayoutStyles } from \"./tableHelpers\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\nimport { RowHeights, RowSizes as RowSizesEnum } from \"./TableConsts\";\nimport { type RowSizes } from \"./Table.types\";\nimport styles from \"./Table.module.scss\";\nimport { TableProvider } from \"../context/TableContext/TableContext\";\nimport { TableRowMenuProvider } from \"../context/TableRowMenuContext/TableRowMenuContext\";\nimport useMergeRef from \"../../../hooks/useMergeRef\";\nimport { type TableProviderValue } from \"../context/TableContext/TableContext.types\";\nimport { type TableRowMenuProviderValue } from \"../context/TableRowMenuContext/TableRowMenuContext.types\";\n\nexport type TableLoadingStateType = \"long-text\" \| \"medium-text\" \| \"circle\" \| \"rectangle\";\n\ntype Width = number \| `${number}%` \| `${number}px` \| `${number}fr`;\n\nexport interface TableColumn {\n /*\n Unique identifier for the column.\n /\n id: string;\n /\n Column title displayed in the header.\n /\n title: string;\n /\n Additional information displayed as a tooltip.\n /\n infoContent?: string;\n /\n Column width configuration.\n /\n width?: Width \| { min: Width; max: Width };\n /\n Icon displayed next to the column title.\n /\n icon?: SubIcon;\n /\n Loading state type for the column when data is being fetched.\n /\n loadingStateType?: TableLoadingStateType;\n}\n\nexport interface TableProps extends VibeComponentProps {\n /\n Defines the columns of the table.\n /\n columns: TableColumn[];\n /\n State of the data being displayed (loading or error).\n /\n dataState?: {\n isLoading?: boolean;\n isError?: boolean;\n };\n /\n React element displayed when there is an error state.\n /\n errorState: ReactElement;\n /\n React element displayed when there is no data.\n /\n emptyState: ReactElement;\n /\n Custom styles for the table.\n /\n style?: React.CSSProperties;\n /\n The child components inside the table, such as `<TableHeader />` and `<TableBody />`.\n /\n children?:\n \| ReactElement<TableHeaderProps>\n \| ReactElement<TableBodyProps>\n \| Array<ReactElement<TableHeaderProps> \| ReactElement<TableBodyProps>>;\n /\n The row size of the table.\n /\n size?: RowSizes;\n /\n If true, removes the table's outer border.\n /\n withoutBorder?: boolean;\n}\n\nconst Table = forwardRef(\n (\n {\n id,\n className,\n \"data-testid\": dataTestId,\n columns,\n errorState,\n emptyState,\n dataState,\n style,\n children,\n size = \"medium\",\n withoutBorder\n }: TableProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const tableRootRef = useRef<HTMLDivElement>(null);\n const mergedRef = useMergeRef(ref, tableRootRef);\n\n const [isMenuOpen, setIsMenuOpen] = useState<boolean>(false);\n const [hoveredRowRef, setHoveredRowRef] = useState<React.RefObject<HTMLDivElement>>(null);\n\n const resetHoveredRow = useCallback(() => {\n setIsMenuOpen(false);\n setHoveredRowRef(null);\n }, []);\n\n const [isVirtualized, setIsVirtualized] = useState<boolean>(false);\n const markTableAsVirtualized = useCallback(() => {\n setIsVirtualized(true);\n }, []);\n\n const [isScrolled, setIsScrolled] = useState<boolean>(false);\n\n const onScroll = useCallback<UIEventHandler<HTMLDivElement>>(\n e => {\n resetHoveredRow();\n if (!isVirtualized) {\n const newLeft = (e.target as HTMLDivElement).scrollLeft;\n const hasScroll = newLeft > 0;\n setIsScrolled(prevScroll => (prevScroll !== hasScroll ? hasScroll : prevScroll));\n }\n },\n [resetHoveredRow, isVirtualized]\n );\n\n const { gridTemplateColumns } = getTableRowLayoutStyles(columns);\n\n /\n The `--table-grid-template-columns` and `--table-row-size` variables will be available under each <Table /> scope\n * and will be consumed in the stylesheets of its children (<TableHeader />, <TableRow />, <TableHeaderCell />)\n */\n const calculatedStyle = {\n \"--table-grid-template-columns\": gridTemplateColumns,\n \"--table-row-size\": `${RowHeights[size]}px`,\n ...style\n } as React.CSSProperties;\n\n const tableProviderValue = useMemo<TableProviderValue>(\n () => ({\n columns,\n dataState,\n emptyState,\n errorState,\n size,\n tableRootRef,\n isVirtualized,\n markTableAsVirtualized,\n isScrolled,\n setIsScrolled: (scrollLeft: boolean) => setIsScrolled(scrollLeft)\n }),\n [columns, dataState, emptyState, errorState, isVirtualized, markTableAsVirtualized, isScrolled, size]\n );\n\n const tableRowMenuProviderValue = useMemo<TableRowMenuProviderValue>(\n () => ({\n tableRootRef,\n hoveredRowRef,\n isMenuOpen,\n resetHoveredRow,\n setHoveredRowRef: (rowRef: React.RefObject<HTMLDivElement>) => setHoveredRowRef(rowRef),\n setIsMenuOpen: (isOpen: boolean) => setIsMenuOpen(isOpen)\n }),\n [hoveredRowRef, isMenuOpen, resetHoveredRow, setHoveredRowRef]\n );\n\n return (\n <TableProvider value={tableProviderValue}>\n <TableRowMenuProvider value={tableRowMenuProviderValue}>\n <div\n ref={mergedRef}\n id={id}\n className={cx(\n styles.table,\n {\n [styles.border]: !withoutBorder,\n [styles.virtualized]: isVirtualized,\n [styles.hasScroll]: isScrolled\n },\n className\n )}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TABLE, id)}\n role=\"table\"\n style={calculatedStyle}\n onScroll={onScroll}\n >\n {children}\n </div>\n </TableRowMenuProvider>\n </TableProvider>\n );\n }\n);\n\ninterface TableStaticProps {\n sizes: typeof RowSizesEnum;\n}\n\nexport default withStaticProps<TableProps, TableStaticProps>(Table, { sizes: RowSizesEnum });\n"],"names":["withStaticProps","forwardRef","_ref","ref","id","className","dataTestId","columns","errorState","emptyState","dataState","style","children","_ref$size","size","withoutBorder","tableRootRef","useRef","mergedRef","useMergeRef","_useState","useState","_useState2","_slicedToArray","isMenuOpen","setIsMenuOpen","_useState3","_useState4","hoveredRowRef","setHoveredRowRef","resetHoveredRow","useCallback","_useState5","_useState6","isVirtualized","setIsVirtualized","markTableAsVirtualized","_useState7","_useState8","isScrolled","setIsScrolled","onScroll","e","hasScroll","target","scrollLeft","prevScroll","_getTableRowLayoutSty","getTableRowLayoutStyles","calculatedStyle","Object","assign","gridTemplateColumns","concat","RowHeights","tableProviderValue","useMemo","tableRowMenuProviderValue","rowRef","isOpen","React","createElement","TableProvider","value","TableRowMenuProvider","cx","styles","table","_defineProperty","border","virtualized","getTestId","ComponentDefaultTestId","TABLE","role","sizes","RowSizesEnum"],"mappings":"uzBAiGA,IAuHeA,EAAAA,EAvHDC,GACZ,SAAAC,EAcEC,GACE,IAbAC,EAAEF,EAAFE,GACAC,EAASH,EAATG,UACeC,EAAUJ,EAAzB,eACAK,EAAOL,EAAPK,QACAC,EAAUN,EAAVM,WACAC,EAAUP,EAAVO,WACAC,EAASR,EAATQ,UACAC,EAAKT,EAALS,MACAC,EAAQV,EAARU,SAAQC,EAAAX,EACRY,KAAAA,OAAO,IAAHD,EAAG,SAAQA,EACfE,EAAab,EAAba,cAIIC,EAAeC,EAAuB,MACtCC,EAAYC,EAAYhB,EAAKa,GAEnCI,EAAoCC,GAAkB,GAAMC,EAAAC,EAAAH,EAAA,GAArDI,EAAUF,EAAA,GAAEG,EAAaH,EAAA,GAChCI,EAA0CL,EAA0C,MAAKM,EAAAJ,EAAAG,EAAA,GAAlFE,EAAaD,EAAA,GAAEE,EAAgBF,EAAA,GAEhCG,EAAkBC,GAAY,WAClCN,GAAc,GACdI,EAAiB,KAClB,GAAE,IAEHG,EAA0CX,GAAkB,GAAMY,EAAAV,EAAAS,EAAA,GAA3DE,EAAaD,EAAA,GAAEE,EAAgBF,EAAA,GAChCG,EAAyBL,GAAY,WACzCI,GAAiB,EAClB,GAAE,IAEHE,EAAoChB,GAAkB,GAAMiB,EAAAf,EAAAc,EAAA,GAArDE,EAAUD,EAAA,GAAEE,EAAaF,EAAA,GAE1BG,EAAWV,GACf,SAAAW,GAEE,GADAZ,KACKI,EAAe,CAClB,IACMS,EADWD,EAAEE,OAA0BC,WACjB,EAC5BL,GAAc,SAAAM,GAAU,OAAKA,IAAeH,EAAYA,EAAYG,CAAU,GAC/E,CACH,GACA,CAAChB,EAAiBI,IAGpBa,EAAgCC,EAAwBzC,GAMlD0C,EAAkBC,OAAAC,OAAA,CACtB,gCAPyBJ,EAAnBK,oBAQN,sBAAkBC,OAAKC,EAAWxC,GAAK,OACpCH,GAGC4C,EAAqBC,GACzB,WAAA,MAAO,CACLjD,QAAAA,EACAG,UAAAA,EACAD,WAAAA,EACAD,WAAAA,EACAM,KAAAA,EACAE,aAAAA,EACAkB,cAAAA,EACAE,uBAAAA,EACAG,WAAAA,EACAC,cAAe,SAACK,GAAmB,OAAKL,EAAcK,EAAW,EAClE,GACD,CAACtC,EAASG,EAAWD,EAAYD,EAAY0B,EAAeE,EAAwBG,EAAYzB,IAG5F2C,GAA4BD,GAChC,WAAA,MAAO,CACLxC,aAAAA,EACAY,cAAAA,EACAJ,WAAAA,EACAM,gBAAAA,EACAD,iBAAkB,SAAC6B,GAAuC,OAAK7B,EAAiB6B,EAAO,EACvFjC,cAAe,SAACkC,GAAe,OAAKlC,EAAckC,EAAO,EACzD,GACF,CAAC/B,EAAeJ,EAAYM,EAAiBD,IAG/C,OACE+B,EAACC,cAAAC,EAAc,CAAAC,MAAOR,GACpBK,EAAAC,cAACG,EAAoB,CAACD,MAAON,IAC3BG,EAAAC,cAAA,MAAA,CACE1D,IAAKe,EACLd,GAAIA,EACJC,UAAW4D,EACTC,EAAOC,MAAKC,EAAAA,EAAAA,EAAA,CAAA,EAETF,EAAOG,QAAUtD,GACjBmD,EAAOI,YAAcpC,GACrBgC,EAAOvB,UAAYJ,GAEtBlC,GAEW,cAAAC,GAAciE,EAAUC,EAAuBC,MAAOrE,GACnEsE,KAAK,QACL/D,MAAOsC,EACPR,SAAUA,GAET7B,IAKX,IAOkE,CAAE+D,MAAOC"}

package/dist/mocked_classnames/src/components/Table/Table/Table.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var r={table:"table",border:"border",virtualized:"virtualized",hasScroll:"hasScroll"};!function(r){const e="s_id-2b8bccf4a9c1_3_58_0";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+e))return;const l=document.createElement("style");l.id=e,o.firstChild?o.insertBefore(l,o.firstChild):o.appendChild(l),l.appendChild(document.createTextNode(r))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=r)}(".table {\n  --sticky-cell-hover-background: linear-gradient(\n      to right,\n      var(--primary-background-hover-color),\n      var(--primary-background-hover-color)\n    ),\n    linear-gradient(to right, var(--primary-background-color), var(--primary-background-color));\n  background-color: var(--primary-background-color);\n  overflow: auto;\n  width: 100%;\n  height: 100%;\n}\n.table.border {\n  border: 1px solid var(--layout-border-color);\n  border-radius: var(--border-radius-small);\n}\n.table [role=rowgroup] [role=row] > [role=cell] {\n  border-bottom: 1px solid var(--layout-border-color);\n}\n.table [role=rowgroup] > [role=row]:last-of-type > [role=cell] {\n  border-bottom: none;\n}\n.table.virtualized {\n  overflow: hidden;\n}\n.table.hasScroll {\n  --sticky-cell-box-shadow: 3px 0 4px rgba(0, 0, 0, 0.1);\n}");export{r as default};
+var r={table:"table",border:"border",virtualized:"virtualized",hasScroll:"hasScroll"};!function(r){const e="s_id-2b8bccf4a9c1_3_58_1";if("undefined"!=typeof document){const o=document.head||document.getElementsByTagName("head")[0];if(o.querySelector("#"+e))return;const l=document.createElement("style");l.id=e,o.firstChild?o.insertBefore(l,o.firstChild):o.appendChild(l),l.appendChild(document.createTextNode(r))}else globalThis.injectedStyles&&(globalThis.injectedStyles[e]=r)}(".table {\n  --sticky-cell-hover-background: linear-gradient(\n      to right,\n      var(--primary-background-hover-color),\n      var(--primary-background-hover-color)\n    ),\n    linear-gradient(to right, var(--primary-background-color), var(--primary-background-color));\n  background-color: var(--primary-background-color);\n  overflow: auto;\n  width: 100%;\n  height: 100%;\n}\n.table.border {\n  border: 1px solid var(--layout-border-color);\n  border-radius: var(--border-radius-small);\n}\n.table [role=rowgroup] [role=row] > [role=cell] {\n  border-bottom: 1px solid var(--layout-border-color);\n}\n.table [role=rowgroup] > [role=row]:last-of-type > [role=cell] {\n  border-bottom: none;\n}\n.table.virtualized {\n  overflow: hidden;\n}\n.table.hasScroll {\n  --sticky-cell-box-shadow: 3px 0 4px rgba(0, 0, 0, 0.1);\n}");export{r as default};
 //# sourceMappingURL=Table.module.scss.js.map

package/dist/mocked_classnames/src/components/Table/Table/tableHelpers.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tableHelpers.js","sources":["../../../../../../src/components/Table/Table/tableHelpers.ts"],"sourcesContent":["import ~~React,~~ { AriaAttributes } from \"react\";\nimport { TableColumn, TableLoadingStateType } from \"./Table\";\nimport { Sort } from \"@vibe/icons\";\nimport { TableHeaderCellProps } from \"../TableHeaderCell/TableHeaderCell\";\nimport { SortAscending, SortDescending } from \"@vibe/icons\";\nimport { SkeletonType } from \"../../Skeleton/SkeletonConstants\";\n\nexport function generateWidth(width: TableColumn[\"width\"]): string {\n if (typeof width === \"number\") {\n return `${width}px`;\n } else if (typeof width === \"string\") {\n return /%\|px\|fr$/.test(width) ? width : `${width}px`;\n } else if (width?.min && width?.max) {\n return `minmax(${generateWidth(width.min)}, ${generateWidth(width.max)})`;\n } else {\n return \"minmax(112px, 1fr)\";\n }\n}\n\nexport function getTableRowLayoutStyles(columns: TableColumn[], style: React.CSSProperties = {}): React.CSSProperties {\n return {\n ...style,\n display: \"grid\",\n gridTemplateColumns: columns.map(cell => generateWidth(cell.width)).join(\" \")\n };\n}\n\nexport function getSortIcon(sortState: TableHeaderCellProps[\"sortState\"]) {\n if (sortState === \"asc\") {\n return SortAscending;\n } else if (sortState === \"desc\") {\n return SortDescending;\n } else {\n return Sort;\n }\n}\n\nexport function getNextSortState(sortState: TableHeaderCellProps[\"sortState\"]): TableHeaderCellProps[\"sortState\"] {\n if (sortState === \"asc\") {\n return \"desc\";\n } else if (sortState === \"desc\") {\n return \"none\";\n } else {\n return \"asc\";\n }\n}\n\nexport function getAriaSort(sortState: TableHeaderCellProps[\"sortState\"]): AriaAttributes[\"aria-sort\"] {\n if (sortState === \"asc\") {\n return \"ascending\";\n }\n if (sortState === \"desc\") {\n return \"descending\";\n }\n return \"none\";\n}\n\nexport function getSkeletonType(loadingStateType: TableLoadingStateType): SkeletonType {\n if (loadingStateType === \"circle\") {\n return SkeletonType.CIRCLE;\n }\n if (loadingStateType === \"rectangle\") {\n return SkeletonType.RECTANGLE;\n }\n return SkeletonType.TEXT;\n}\n\nexport function getLoadingTypeForCell(\n loadingStateType: TableLoadingStateType,\n rowIndex: number\n): TableLoadingStateType {\n return loadingStateType === \"long-text\"\n ? ([\"long-text\", \"medium-text\"] as TableLoadingStateType[])[rowIndex % 2]\n : loadingStateType;\n}\n"],"names":["generateWidth","width","concat","test","min","max","getTableRowLayoutStyles","columns","Object","assign","display","gridTemplateColumns","map","cell","join","getSortIcon","sortState","SortAscending","SortDescending","Sort","getNextSortState","getAriaSort","getSkeletonType","loadingStateType","SkeletonType","CIRCLE","RECTANGLE","TEXT","getLoadingTypeForCell","rowIndex"],"mappings":"~~kPAOM~~,SAAUA,EAAcC,GAC5B,MAAqB,iBAAVA,EACTC,GAAAA,OAAUD,EAAK,MACW,iBAAVA,EACT,WAAWE,KAAKF,GAASA,EAAKC,GAAAA,OAAMD,EAAS,OAC3CA,aAAK,EAALA,EAAOG,OAAOH,aAAK,EAALA,EAAOI,KAC9B,UAAAH,OAAiBF,EAAcC,EAAMG,KAAIF,MAAAA,OAAKF,EAAcC,EAAMI,KAAI,KAE/D,oBAEX,UAEgBC,EAAwBC,GACtC,OAAAC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,yDAD2F,CAAA,GAEjF,CACRC,QAAS,OACTC,oBAAqBJ,EAAQK,KAAI,SAAAC,GAAI,OAAIb,EAAca,EAAKZ,UAAQa,KAAK,MAE7E,CAEM,SAAUC,EAAYC,GAC1B,MAAkB,QAAdA,EACKC,EACgB,SAAdD,EACFE,EAEAC,CAEX,CAEM,SAAUC,EAAiBJ,GAC/B,MAAkB,QAAdA,EACK,OACgB,SAAdA,EACF,OAEA,KAEX,CAEM,SAAUK,EAAYL,GAC1B,MAAkB,QAAdA,EACK,YAES,SAAdA,EACK,aAEF,MACT,CAEM,SAAUM,EAAgBC,GAC9B,MAAyB,WAArBA,EACKC,EAAaC,OAEG,cAArBF,EACKC,EAAaE,UAEfF,EAAaG,IACtB,CAEgB,SAAAC,EACdL,EACAM,GAEA,MAA4B,cAArBN,EACF,CAAC,YAAa,eAA2CM,EAAW,GACrEN,CACN"}
1	+ {"version":3,"file":"tableHelpers.js","sources":["../../../../../../src/components/Table/Table/tableHelpers.ts"],"sourcesContent":["import { type AriaAttributes } from \"react\";\nimport type React from \"react\";\nimport { type TableColumn, type TableLoadingStateType } from \"./Table\";\nimport { Sort } from \"@vibe/icons\";\nimport { type TableHeaderCellProps } from \"../TableHeaderCell/TableHeaderCell\";\nimport { SortAscending, SortDescending } from \"@vibe/icons\";\nimport { SkeletonType } from \"../../Skeleton/SkeletonConstants\";\n\nexport function generateWidth(width: TableColumn[\"width\"]): string {\n if (typeof width === \"number\") {\n return `${width}px`;\n } else if (typeof width === \"string\") {\n return /%\|px\|fr$/.test(width) ? width : `${width}px`;\n } else if (width?.min && width?.max) {\n return `minmax(${generateWidth(width.min)}, ${generateWidth(width.max)})`;\n } else {\n return \"minmax(112px, 1fr)\";\n }\n}\n\nexport function getTableRowLayoutStyles(columns: TableColumn[], style: React.CSSProperties = {}): React.CSSProperties {\n return {\n ...style,\n display: \"grid\",\n gridTemplateColumns: columns.map(cell => generateWidth(cell.width)).join(\" \")\n };\n}\n\nexport function getSortIcon(sortState: TableHeaderCellProps[\"sortState\"]) {\n if (sortState === \"asc\") {\n return SortAscending;\n } else if (sortState === \"desc\") {\n return SortDescending;\n } else {\n return Sort;\n }\n}\n\nexport function getNextSortState(sortState: TableHeaderCellProps[\"sortState\"]): TableHeaderCellProps[\"sortState\"] {\n if (sortState === \"asc\") {\n return \"desc\";\n } else if (sortState === \"desc\") {\n return \"none\";\n } else {\n return \"asc\";\n }\n}\n\nexport function getAriaSort(sortState: TableHeaderCellProps[\"sortState\"]): AriaAttributes[\"aria-sort\"] {\n if (sortState === \"asc\") {\n return \"ascending\";\n }\n if (sortState === \"desc\") {\n return \"descending\";\n }\n return \"none\";\n}\n\nexport function getSkeletonType(loadingStateType: TableLoadingStateType): SkeletonType {\n if (loadingStateType === \"circle\") {\n return SkeletonType.CIRCLE;\n }\n if (loadingStateType === \"rectangle\") {\n return SkeletonType.RECTANGLE;\n }\n return SkeletonType.TEXT;\n}\n\nexport function getLoadingTypeForCell(\n loadingStateType: TableLoadingStateType,\n rowIndex: number\n): TableLoadingStateType {\n return loadingStateType === \"long-text\"\n ? ([\"long-text\", \"medium-text\"] as TableLoadingStateType[])[rowIndex % 2]\n : loadingStateType;\n}\n"],"names":["generateWidth","width","concat","test","min","max","getTableRowLayoutStyles","columns","Object","assign","display","gridTemplateColumns","map","cell","join","getSortIcon","sortState","SortAscending","SortDescending","Sort","getNextSortState","getAriaSort","getSkeletonType","loadingStateType","SkeletonType","CIRCLE","RECTANGLE","TEXT","getLoadingTypeForCell","rowIndex"],"mappings":"kPAQM,SAAUA,EAAcC,GAC5B,MAAqB,iBAAVA,EACTC,GAAAA,OAAUD,EAAK,MACW,iBAAVA,EACT,WAAWE,KAAKF,GAASA,EAAKC,GAAAA,OAAMD,EAAS,OAC3CA,aAAK,EAALA,EAAOG,OAAOH,aAAK,EAALA,EAAOI,KAC9B,UAAAH,OAAiBF,EAAcC,EAAMG,KAAIF,MAAAA,OAAKF,EAAcC,EAAMI,KAAI,KAE/D,oBAEX,UAEgBC,EAAwBC,GACtC,OAAAC,OAAAC,OAAAD,OAAAC,OAAA,CAAA,yDAD2F,CAAA,GAEjF,CACRC,QAAS,OACTC,oBAAqBJ,EAAQK,KAAI,SAAAC,GAAI,OAAIb,EAAca,EAAKZ,UAAQa,KAAK,MAE7E,CAEM,SAAUC,EAAYC,GAC1B,MAAkB,QAAdA,EACKC,EACgB,SAAdD,EACFE,EAEAC,CAEX,CAEM,SAAUC,EAAiBJ,GAC/B,MAAkB,QAAdA,EACK,OACgB,SAAdA,EACF,OAEA,KAEX,CAEM,SAAUK,EAAYL,GAC1B,MAAkB,QAAdA,EACK,YAES,SAAdA,EACK,aAEF,MACT,CAEM,SAAUM,EAAgBC,GAC9B,MAAyB,WAArBA,EACKC,EAAaC,OAEG,cAArBF,EACKC,EAAaE,UAEfF,EAAaG,IACtB,CAEgB,SAAAC,EACdL,EACAM,GAEA,MAA4B,cAArBN,EACF,CAAC,YAAa,eAA2CM,EAAW,GACrEN,CACN"}

package/dist/mocked_classnames/src/components/Table/TableBody/TableBody.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableBody.js","sources":["../../../../../../src/components/Table/TableBody/TableBody.tsx"],"sourcesContent":["import React, { ReactElement, ComponentProps, forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport { VibeComponentProps } from \"../../../types\";\nimport TableRow, { TableRowProps } from \"../TableRow/TableRow\";\nimport VirtualizedList from \"../../VirtualizedList/VirtualizedList\";\nimport styles from \"./TableBody.module.scss\";\nimport { useTable } from \"../context/TableContext/TableContext\";\nimport TableCellSkeleton from \"../TableCellSkeleton/TableCellSkeleton\";\nimport { SKELETON_ROWS_AMOUNT } from \"../Table/TableConsts\";\nimport { getLoadingTypeForCell } from \"../Table/tableHelpers\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\n\nexport interface TableBodyProps extends VibeComponentProps {\n /*\n The child components inside the table body, such as `<TableRow />` elements.\n */\n children?:\n \| ReactElement<TableRowProps>\n \| ReactElement<TableRowProps>[]\n \| ReactElement<ComponentProps<typeof VirtualizedList>>;\n}\n\nconst TableBody = forwardRef(\n ({ id, className, \"data-testid\": dataTestId, children }: TableBodyProps, ref: React.ForwardedRef<HTMLDivElement>) => {\n const { dataState, emptyState, errorState, columns } = useTable();\n const { isLoading, isError } = dataState \|\| {};\n\n const skeletonRender = [...new Array(SKELETON_ROWS_AMOUNT)].map((_, rowIndex) => (\n <TableRow key={rowIndex}>\n {columns.map(({ loadingStateType }, columnIndex) => (\n <TableCellSkeleton\n key={`${rowIndex}-${columnIndex}`}\n type={getLoadingTypeForCell(loadingStateType, rowIndex)}\n />\n ))}\n </TableRow>\n ));\n\n return (\n <div\n ref={ref}\n id={id}\n className={cx(styles.tableBody, className)}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TABLE_BODY, id)}\n role=\"rowgroup\"\n >\n {isLoading\n ? skeletonRender\n : isError\n ? errorState\n : !children \|\| (Array.isArray(children) && children.length === 0)\n ? emptyState\n : children}\n </div>\n );\n }\n);\n\nexport default TableBody;\n"],"names":["TableBody","forwardRef","_ref","ref","id","className","dataTestId","children","_useTable","useTable","emptyState","errorState","columns","_ref2","dataState","isLoading","isError","skeletonRender","_toConsumableArray","Array","SKELETON_ROWS_AMOUNT","map","_","rowIndex","React","TableRow","key","_ref3","columnIndex","loadingStateType","createElement","TableCellSkeleton","concat","type","getLoadingTypeForCell","cx","styles","tableBody","getTestId","ComponentDefaultTestId","TABLE_BODY","role","isArray","length"],"mappings":"8lBAuBMA,IAAAA,EAAYC,GAChB,SAAAC,EAAyEC,GAA2C,IAAjHC,EAAEF,EAAFE,GAAIC,EAASH,EAATG,UAA0BC,EAAUJ,EAAzB,eAA2BK,EAAQL,EAARK,SAC3CC,EAAuDC,IAApCC,EAAUF,EAAVE,WAAYC,EAAUH,EAAVG,WAAYC,EAAOJ,EAAPI,QAC3CC,EADiBL,EAATM,WACoC,CAAE,EAAtCC,EAASF,EAATE,UAAWC,EAAOH,EAAPG,QAEbC,EAAiBC,EAAQC,MAAMC,IAAuBC,KAAI,SAACC,EAAGC,GAAQ,OAC1EC,gBAACC,EAAQ,CAACC,IAAKH,GACZX,EAAQS,KAAI,SAAAM,EAAuBC,GAAW,IAA/BC,EAAgBF,EAAhBE,iBAAgB,OAC9BL,EAACM,cAAAC,EACC,CAAAL,IAAG,GAAAM,OAAKT,OAAQS,OAAIJ,GACpBK,KAAMC,EAAsBL,EAAkBN,IAEjD,IACQ,IAGb,OACEC,EACEM,cAAA,MAAA,CAAA3B,IAAKA,EACLC,GAAIA,EACJC,UAAW8B,EAAGC,EAAOC,UAAWhC,iBACnBC,GAAcgC,EAAUC,EAAuBC,WAAYpC,GACxEqC,KAAK,YAEJ1B,EACGE,EACAD,EACAL,GACCJ,GAAaY,MAAMuB,QAAQnC,IAAiC,IAApBA,EAASoC,OAClDjC,EACAH,EAGV"}
1	+ {"version":3,"file":"TableBody.js","sources":["../../../../../../src/components/Table/TableBody/TableBody.tsx"],"sourcesContent":["import React, { type ReactElement, type ComponentProps, forwardRef } from \"react\";\nimport cx from \"classnames\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport TableRow, { type TableRowProps } from \"../TableRow/TableRow\";\nimport type VirtualizedList from \"../../VirtualizedList/VirtualizedList\";\nimport styles from \"./TableBody.module.scss\";\nimport { useTable } from \"../context/TableContext/TableContext\";\nimport TableCellSkeleton from \"../TableCellSkeleton/TableCellSkeleton\";\nimport { SKELETON_ROWS_AMOUNT } from \"../Table/TableConsts\";\nimport { getLoadingTypeForCell } from \"../Table/tableHelpers\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\n\nexport interface TableBodyProps extends VibeComponentProps {\n /*\n The child components inside the table body, such as `<TableRow />` elements.\n */\n children?:\n \| ReactElement<TableRowProps>\n \| ReactElement<TableRowProps>[]\n \| ReactElement<ComponentProps<typeof VirtualizedList>>;\n}\n\nconst TableBody = forwardRef(\n ({ id, className, \"data-testid\": dataTestId, children }: TableBodyProps, ref: React.ForwardedRef<HTMLDivElement>) => {\n const { dataState, emptyState, errorState, columns } = useTable();\n const { isLoading, isError } = dataState \|\| {};\n\n const skeletonRender = [...new Array(SKELETON_ROWS_AMOUNT)].map((_, rowIndex) => (\n <TableRow key={rowIndex}>\n {columns.map(({ loadingStateType }, columnIndex) => (\n <TableCellSkeleton\n key={`${rowIndex}-${columnIndex}`}\n type={getLoadingTypeForCell(loadingStateType, rowIndex)}\n />\n ))}\n </TableRow>\n ));\n\n return (\n <div\n ref={ref}\n id={id}\n className={cx(styles.tableBody, className)}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TABLE_BODY, id)}\n role=\"rowgroup\"\n >\n {isLoading\n ? skeletonRender\n : isError\n ? errorState\n : !children \|\| (Array.isArray(children) && children.length === 0)\n ? emptyState\n : children}\n </div>\n );\n }\n);\n\nexport default TableBody;\n"],"names":["TableBody","forwardRef","_ref","ref","id","className","dataTestId","children","_useTable","useTable","emptyState","errorState","columns","_ref2","dataState","isLoading","isError","skeletonRender","_toConsumableArray","Array","SKELETON_ROWS_AMOUNT","map","_","rowIndex","React","TableRow","key","_ref3","columnIndex","loadingStateType","createElement","TableCellSkeleton","concat","type","getLoadingTypeForCell","cx","styles","tableBody","getTestId","ComponentDefaultTestId","TABLE_BODY","role","isArray","length"],"mappings":"8lBAuBMA,IAAAA,EAAYC,GAChB,SAAAC,EAAyEC,GAA2C,IAAjHC,EAAEF,EAAFE,GAAIC,EAASH,EAATG,UAA0BC,EAAUJ,EAAzB,eAA2BK,EAAQL,EAARK,SAC3CC,EAAuDC,IAApCC,EAAUF,EAAVE,WAAYC,EAAUH,EAAVG,WAAYC,EAAOJ,EAAPI,QAC3CC,EADiBL,EAATM,WACoC,CAAE,EAAtCC,EAASF,EAATE,UAAWC,EAAOH,EAAPG,QAEbC,EAAiBC,EAAQC,MAAMC,IAAuBC,KAAI,SAACC,EAAGC,GAAQ,OAC1EC,gBAACC,EAAQ,CAACC,IAAKH,GACZX,EAAQS,KAAI,SAAAM,EAAuBC,GAAW,IAA/BC,EAAgBF,EAAhBE,iBAAgB,OAC9BL,EAACM,cAAAC,EACC,CAAAL,IAAG,GAAAM,OAAKT,OAAQS,OAAIJ,GACpBK,KAAMC,EAAsBL,EAAkBN,IAEjD,IACQ,IAGb,OACEC,EACEM,cAAA,MAAA,CAAA3B,IAAKA,EACLC,GAAIA,EACJC,UAAW8B,EAAGC,EAAOC,UAAWhC,iBACnBC,GAAcgC,EAAUC,EAAuBC,WAAYpC,GACxEqC,KAAK,YAEJ1B,EACGE,EACAD,EACAL,GACCJ,GAAaY,MAAMuB,QAAQnC,IAAiC,IAApBA,EAASoC,OAClDjC,EACAH,EAGV"}

package/dist/mocked_classnames/src/components/Table/TableBody/TableBody.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={tableBody:"tableBody"};!function(e){const t="s_id-afed3a5f5737_3_58_0";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".tableBody {\n  height: 100%;\n}");export{e as default};
+var e={tableBody:"tableBody"};!function(e){const t="s_id-afed3a5f5737_3_58_1";if("undefined"!=typeof document){const d=document.head||document.getElementsByTagName("head")[0];if(d.querySelector("#"+t))return;const n=document.createElement("style");n.id=t,d.firstChild?d.insertBefore(n,d.firstChild):d.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".tableBody {\n  height: 100%;\n}");export{e as default};
 //# sourceMappingURL=TableBody.module.scss.js.map

package/dist/mocked_classnames/src/components/Table/TableCell/TableCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableCell.js","sources":["../../../../../../src/components/Table/TableCell/TableCell.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { VibeComponentProps } from \"../../../types\";\nimport Text from \"../../Text/Text\";\nimport styles from \"./TableCell.module.scss\";\nimport cx from \"classnames\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\n\nexport interface TableCellProps extends VibeComponentProps {\n /*\n The content inside the table cell.\n /\n children?: React.ReactNode;\n /\n If true, makes the cell sticky (typically used for frozen columns).\n */\n sticky?: boolean;\n}\n\nconst TableCell = forwardRef(\n (\n { sticky, id, className, \"data-testid\": dataTestId, children }: TableCellProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const isSingleChild = React.Children.count(children) === 1;\n const typeOfFirstChild = typeof React.Children.toArray(children)[0];\n const isFirstChildString = typeOfFirstChild === \"string\" \|\| typeOfFirstChild === \"number\";\n\n return (\n <div\n ref={ref}\n id={id}\n className={cx(styles.tableCell, { [styles.sticky]: sticky }, className)}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TABLE_CELL, id)}\n role=\"cell\"\n >\n {isSingleChild && isFirstChildString ? (\n <Text type=\"text2\" color=\"primary\">\n {children}\n </Text>\n ) : (\n children\n )}\n </div>\n );\n }\n);\n\nexport default TableCell;\n"],"names":["TableCell","forwardRef","_ref","ref","sticky","id","className","dataTestId","children","isSingleChild","React","Children","count","typeOfFirstChild","_typeof","toArray","isFirstChildString","createElement","cx","styles","tableCell","_defineProperty","getTestId","ComponentDefaultTestId","TABLE_CELL","role","Text","type","color"],"mappings":"sWAmBMA,IAAAA,EAAYC,GAChB,SAAAC,EAEEC,GACE,IAFAC,EAAMF,EAANE,OAAQC,EAAEH,EAAFG,GAAIC,EAASJ,EAATI,UAA0BC,EAAUL,EAAzB,eAA2BM,EAAQN,EAARM,SAG9CC,EAAmD,IAAnCC,EAAMC,SAASC,MAAMJ,GACrCK,EAAgBC,EAAUJ,EAAMC,SAASI,QAAQP,GAAU,IAC3DQ,EAA0C,WAArBH,GAAsD,WAArBA,EAE5D,OACEH,EAAAO,cAAA,MAAA,CACEd,IAAKA,EACLE,GAAIA,EACJC,UAAWY,EAAGC,EAAOC,UAASC,EAAKF,GAAAA,EAAOf,OAASA,GAAUE,GAChD,cAAAC,GAAce,EAAUC,EAAuBC,WAAYnB,GACxEoB,KAAK,QAEJhB,GAAiBO,EAChBN,EAAAO,cAACS,EAAK,CAAAC,KAAK,QAAQC,MAAM,WACtBpB,GAGHA,EAIR"}
1	+ {"version":3,"file":"TableCell.js","sources":["../../../../../../src/components/Table/TableCell/TableCell.tsx"],"sourcesContent":["import React, { forwardRef } from \"react\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport Text from \"../../Text/Text\";\nimport styles from \"./TableCell.module.scss\";\nimport cx from \"classnames\";\nimport { getTestId } from \"../../../tests/test-ids-utils\";\nimport { ComponentDefaultTestId } from \"../../../tests/constants\";\n\nexport interface TableCellProps extends VibeComponentProps {\n /*\n The content inside the table cell.\n /\n children?: React.ReactNode;\n /\n If true, makes the cell sticky (typically used for frozen columns).\n */\n sticky?: boolean;\n}\n\nconst TableCell = forwardRef(\n (\n { sticky, id, className, \"data-testid\": dataTestId, children }: TableCellProps,\n ref: React.ForwardedRef<HTMLDivElement>\n ) => {\n const isSingleChild = React.Children.count(children) === 1;\n const typeOfFirstChild = typeof React.Children.toArray(children)[0];\n const isFirstChildString = typeOfFirstChild === \"string\" \|\| typeOfFirstChild === \"number\";\n\n return (\n <div\n ref={ref}\n id={id}\n className={cx(styles.tableCell, { [styles.sticky]: sticky }, className)}\n data-testid={dataTestId \|\| getTestId(ComponentDefaultTestId.TABLE_CELL, id)}\n role=\"cell\"\n >\n {isSingleChild && isFirstChildString ? (\n <Text type=\"text2\" color=\"primary\">\n {children}\n </Text>\n ) : (\n children\n )}\n </div>\n );\n }\n);\n\nexport default TableCell;\n"],"names":["TableCell","forwardRef","_ref","ref","sticky","id","className","dataTestId","children","isSingleChild","React","Children","count","typeOfFirstChild","_typeof","toArray","isFirstChildString","createElement","cx","styles","tableCell","_defineProperty","getTestId","ComponentDefaultTestId","TABLE_CELL","role","Text","type","color"],"mappings":"sWAmBMA,IAAAA,EAAYC,GAChB,SAAAC,EAEEC,GACE,IAFAC,EAAMF,EAANE,OAAQC,EAAEH,EAAFG,GAAIC,EAASJ,EAATI,UAA0BC,EAAUL,EAAzB,eAA2BM,EAAQN,EAARM,SAG9CC,EAAmD,IAAnCC,EAAMC,SAASC,MAAMJ,GACrCK,EAAgBC,EAAUJ,EAAMC,SAASI,QAAQP,GAAU,IAC3DQ,EAA0C,WAArBH,GAAsD,WAArBA,EAE5D,OACEH,EAAAO,cAAA,MAAA,CACEd,IAAKA,EACLE,GAAIA,EACJC,UAAWY,EAAGC,EAAOC,UAASC,EAAKF,GAAAA,EAAOf,OAASA,GAAUE,GAChD,cAAAC,GAAce,EAAUC,EAAuBC,WAAYnB,GACxEoB,KAAK,QAEJhB,GAAiBO,EAChBN,EAAAO,cAACS,EAAK,CAAAC,KAAK,QAAQC,MAAM,WACtBpB,GAGHA,EAIR"}

package/dist/mocked_classnames/src/components/Table/TableCell/TableCell.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={tableCell:"tableCell",sticky:"sticky"};!function(e){const t="s_id-25789b81dac4_3_58_0";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const l=document.createElement("style");l.id=t,n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".tableCell {\n  padding: 9px 16px;\n  overflow: hidden;\n  display: flex;\n  align-items: center;\n}\n.tableCell.sticky {\n  z-index: 1;\n  position: sticky;\n  left: 0;\n  box-shadow: var(--sticky-cell-box-shadow);\n}");export{e as default};
+var e={tableCell:"tableCell",sticky:"sticky"};!function(e){const t="s_id-25789b81dac4_3_58_1";if("undefined"!=typeof document){const n=document.head||document.getElementsByTagName("head")[0];if(n.querySelector("#"+t))return;const l=document.createElement("style");l.id=t,n.firstChild?n.insertBefore(l,n.firstChild):n.appendChild(l),l.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[t]=e)}(".tableCell {\n  padding: 9px 16px;\n  overflow: hidden;\n  display: flex;\n  align-items: center;\n}\n.tableCell.sticky {\n  z-index: 1;\n  position: sticky;\n  left: 0;\n  box-shadow: var(--sticky-cell-box-shadow);\n}");export{e as default};
 //# sourceMappingURL=TableCell.module.scss.js.map

package/dist/mocked_classnames/src/components/Table/TableCellSkeleton/TableCellSkeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableCellSkeleton.js","sources":["../../../../../../src/components/Table/TableCellSkeleton/TableCellSkeleton.tsx"],"sourcesContent":["import React from \"react\";\nimport cx from \"classnames\";\nimport TableCell from \"../TableCell/TableCell\";\nimport Skeleton from \"../../Skeleton/Skeleton\";\nimport styles from \"./TableCellSkeleton.module.scss\";\nimport { VibeComponentProps } from \"../../../types\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport { TableLoadingStateType } from \"../Table/Table\";\nimport { getSkeletonType } from \"../Table/tableHelpers\";\nimport { camelCase } from \"lodash-es\";\n\nexport interface TableCellSkeletonProps extends VibeComponentProps {\n /*\n The type of loading state for the skeleton.\n /\n type?: TableLoadingStateType;\n /\n If true, renders a shorter skeleton for text-based loading states.\n */\n short?: boolean;\n}\n\nconst TableCellSkeleton: React.FC<TableCellSkeletonProps> = ({ type = \"long-text\" }) => {\n const isText = [\"long-text\", \"medium-text\"].includes(type);\n return (\n <TableCell>\n <Skeleton\n type={getSkeletonType(type)}\n wrapperClassName={cx(styles.tableCellSkeletonWrapper, getStyle(styles, camelCase(type)))}\n className={cx(styles.tableCellSkeleton, { [getStyle(styles, camelCase(type))]: !isText })}\n fullWidth\n />\n </TableCell>\n );\n};\n\nexport default TableCellSkeleton;\n"],"names":["TableCellSkeleton","_ref","_ref$type","type","isText","includes","React","TableCell","createElement","Skeleton","getSkeletonType","wrapperClassName","cx","styles","tableCellSkeletonWrapper","getStyle","camelCase","className","tableCellSkeleton","_defineProperty","fullWidth"],"mappings":"ibAsBA,IAAMA,EAAsD,SAArCC,GAAgE,IAAAC,EAAAD,EAAxBE,KAAAA,OAAO,IAAHD,EAAG,YAAWA,EACzEE,EAAS,CAAC,YAAa,eAAeC,SAASF,GACrD,OACEG,gBAACC,EAAS,KACRD,EAACE,cAAAC,EACC,CAAAN,KAAMO,EAAgBP,GACtBQ,iBAAkBC,EAAGC,EAAOC,yBAA0BC,EAASF,EAAQG,EAAUb,KACjFc,UAAWL,EAAGC,EAAOK,kBAAiBC,EAAA,CAAA,EAAKJ,EAASF,EAAQG,EAAUb,KAAUC,IAChFgB,WAAS,IAIjB"}
1	+ {"version":3,"file":"TableCellSkeleton.js","sources":["../../../../../../src/components/Table/TableCellSkeleton/TableCellSkeleton.tsx"],"sourcesContent":["import React from \"react\";\nimport cx from \"classnames\";\nimport TableCell from \"../TableCell/TableCell\";\nimport Skeleton from \"../../Skeleton/Skeleton\";\nimport styles from \"./TableCellSkeleton.module.scss\";\nimport { type VibeComponentProps } from \"../../../types\";\nimport { getStyle } from \"../../../helpers/typesciptCssModulesHelper\";\nimport { type TableLoadingStateType } from \"../Table/Table\";\nimport { getSkeletonType } from \"../Table/tableHelpers\";\nimport { camelCase } from \"lodash-es\";\n\nexport interface TableCellSkeletonProps extends VibeComponentProps {\n /*\n The type of loading state for the skeleton.\n /\n type?: TableLoadingStateType;\n /\n If true, renders a shorter skeleton for text-based loading states.\n */\n short?: boolean;\n}\n\nconst TableCellSkeleton: React.FC<TableCellSkeletonProps> = ({ type = \"long-text\" }) => {\n const isText = [\"long-text\", \"medium-text\"].includes(type);\n return (\n <TableCell>\n <Skeleton\n type={getSkeletonType(type)}\n wrapperClassName={cx(styles.tableCellSkeletonWrapper, getStyle(styles, camelCase(type)))}\n className={cx(styles.tableCellSkeleton, { [getStyle(styles, camelCase(type))]: !isText })}\n fullWidth\n />\n </TableCell>\n );\n};\n\nexport default TableCellSkeleton;\n"],"names":["TableCellSkeleton","_ref","_ref$type","type","isText","includes","React","TableCell","createElement","Skeleton","getSkeletonType","wrapperClassName","cx","styles","tableCellSkeletonWrapper","getStyle","camelCase","className","tableCellSkeleton","_defineProperty","fullWidth"],"mappings":"ibAsBA,IAAMA,EAAsD,SAArCC,GAAgE,IAAAC,EAAAD,EAAxBE,KAAAA,OAAO,IAAHD,EAAG,YAAWA,EACzEE,EAAS,CAAC,YAAa,eAAeC,SAASF,GACrD,OACEG,gBAACC,EAAS,KACRD,EAACE,cAAAC,EACC,CAAAN,KAAMO,EAAgBP,GACtBQ,iBAAkBC,EAAGC,EAAOC,yBAA0BC,EAASF,EAAQG,EAAUb,KACjFc,UAAWL,EAAGC,EAAOK,kBAAiBC,EAAA,CAAA,EAAKJ,EAASF,EAAQG,EAAUb,KAAUC,IAChFgB,WAAS,IAIjB"}

package/dist/mocked_classnames/src/components/Table/TableCellSkeleton/TableCellSkeleton.module.scss.js CHANGED Viewed

@@ -1,2 +1,2 @@
-var e={tableCellSkeletonWrapper:"tableCellSkeletonWrapper",longText:"longText",mediumText:"mediumText",tableCellSkeleton:"tableCellSkeleton",circle:"circle",rectangle:"rectangle"};!function(e){const l="s_id-18cab9319884_3_58_0";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+l))return;const n=document.createElement("style");n.id=l,t.firstChild?t.insertBefore(n,t.firstChild):t.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[l]=e)}(".tableCellSkeletonWrapper {\n  height: 100%;\n}\n.tableCellSkeletonWrapper.longText {\n  padding-inline-end: var(--spacing-large);\n}\n.tableCellSkeletonWrapper.mediumText {\n  padding-inline-end: var(--spacing-xxxl);\n}\n.tableCellSkeletonWrapper .tableCellSkeleton {\n  height: 100%;\n}\n@supports (aspect-ratio: 1/1) {\n  .tableCellSkeletonWrapper .tableCellSkeleton.circle, .tableCellSkeletonWrapper .tableCellSkeleton.rectangle {\n    width: auto;\n    aspect-ratio: 1/1;\n  }\n}\n@supports not (aspect-ratio: 1/1) {\n  .tableCellSkeletonWrapper .tableCellSkeleton.circle, .tableCellSkeletonWrapper .tableCellSkeleton.rectangle {\n    width: 21px;\n  }\n}");export{e as default};
+var e={tableCellSkeletonWrapper:"tableCellSkeletonWrapper",longText:"longText",mediumText:"mediumText",tableCellSkeleton:"tableCellSkeleton",circle:"circle",rectangle:"rectangle"};!function(e){const l="s_id-18cab9319884_3_58_1";if("undefined"!=typeof document){const t=document.head||document.getElementsByTagName("head")[0];if(t.querySelector("#"+l))return;const n=document.createElement("style");n.id=l,t.firstChild?t.insertBefore(n,t.firstChild):t.appendChild(n),n.appendChild(document.createTextNode(e))}else globalThis.injectedStyles&&(globalThis.injectedStyles[l]=e)}(".tableCellSkeletonWrapper {\n  height: 100%;\n}\n.tableCellSkeletonWrapper.longText {\n  padding-inline-end: var(--spacing-large);\n}\n.tableCellSkeletonWrapper.mediumText {\n  padding-inline-end: var(--spacing-xxxl);\n}\n.tableCellSkeletonWrapper .tableCellSkeleton {\n  height: 100%;\n}\n@supports (aspect-ratio: 1/1) {\n  .tableCellSkeletonWrapper .tableCellSkeleton.circle, .tableCellSkeletonWrapper .tableCellSkeleton.rectangle {\n    width: auto;\n    aspect-ratio: 1/1;\n  }\n}\n@supports not (aspect-ratio: 1/1) {\n  .tableCellSkeletonWrapper .tableCellSkeleton.circle, .tableCellSkeletonWrapper .tableCellSkeleton.rectangle {\n    width: 21px;\n  }\n}");export{e as default};
 //# sourceMappingURL=TableCellSkeleton.module.scss.js.map