softable-pixels-web 1.2.36 → 1.2.38

package/dist/{InfoSummary-B6k4_vpG.js.map → InfoSummary-D8x-t44q.js.map}

@@ -1 +1 @@
-{"version":3,"file":"InfoSummary-B6k4_vpG.js","names":["SummaryHeader: React.FC<Props>","SummaryCaption: React.FC<Props>","SummaryHighlight: React.FC<Props>","SummaryItem: React.FC<SummaryItemProps>","InfoSummary: React.FC<InfoSummaryProps>"],"sources":["../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryHeader/styles.ts","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryHeader/index.tsx","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryCaption/styles.ts","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryCaption/index.tsx","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryHighlight/styles.ts","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryHighlight/index.tsx","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/styles.ts","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/index.tsx","../src/components/commons/toolkit/InfoSummary/styles.ts","../src/components/commons/toolkit/InfoSummary/index.tsx"],"sourcesContent":["// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryHeaderStyles(): StyleMap {\n  return styled({\n    container: {\n      width: '100%',\n      minHeight: '1rem',\n\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'flex-end',\n\n      gap: '0.125rem'\n    },\n\n    iconContainer: {\n      display: 'flex',\n      alignItems: 'flex-start'\n    },\n\n    textContainer: {\n      flex: '1',\n      maxWidth: '8rem',\n\n      display: 'flex',\n      alignItems: 'flex-start',\n\n      __rules: {\n        '& > p': {\n          whiteSpace: 'nowrap',\n          overflow: 'hidden',\n          textOverflow: 'ellipsis'\n        }\n      }\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\nimport type { ReactNode } from 'react'\n\n// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryHeaderStyles } from './styles'\n\ninterface Props {\n  title: string\n  icon?: ReactNode\n}\n\nexport const SummaryHeader: React.FC<Props> = ({ icon, title }) => {\n  const { styles } = useThemedStyles({}, createSummaryHeaderStyles)\n\n  return (\n    <header style={styles.container}>\n      {icon ? <div style={styles.iconContainer}>{icon}</div> : null}\n\n      <div style={styles.textContainer}>\n        <Typography variant=\"b1\" lineHeight=\"100%\" fontSize=\"0.75rem\">\n          {title}\n        </Typography>\n      </div>\n    </header>\n  )\n}\n","// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryCaptionStyles(): StyleMap {\n  return styled({\n    container: {\n      width: '100%',\n      minHeight: '0.625rem',\n\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyItems: 'start',\n\n      columnGap: '0.125rem'\n    },\n\n    textContainer: {\n      flex: '1',\n      maxWidth: '8rem',\n\n      display: 'flex',\n      alignItems: 'center',\n\n      __rules: {\n        '& > p': {\n          whiteSpace: 'nowrap',\n          overflow: 'hidden',\n          textOverflow: 'ellipsis'\n        }\n      }\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryCaptionStyles } from './styles'\n\ninterface Props {\n  loading?: boolean\n  captionText?: string\n}\n\nexport const SummaryCaption: React.FC<Props> = ({ loading, captionText }) => {\n  // Hooks\n  const { styles } = useThemedStyles({}, createSummaryCaptionStyles)\n\n  return (\n    <div style={styles.container}>\n      <div style={styles.textContainer}>\n        <Typography\n          variant=\"b3\"\n          lineHeight=\"100%\"\n          isLoading={loading}\n          fontSize=\"0.625rem\"\n          color=\"var(--px-text-secondary)\"\n        >\n          {captionText}\n        </Typography>\n      </div>\n    </div>\n  )\n}\n","// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryHighlightStyles(): StyleMap {\n  return styled({\n    container: {\n      width: '100%',\n      minHeight: '1rem',\n\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'flex-end',\n\n      columnGap: '0.125rem'\n    },\n\n    iconContainer: {\n      display: 'flex',\n      alignItems: 'flex-start'\n    },\n\n    textContainer: {\n      flex: '1',\n      maxWidth: '8rem',\n\n      display: 'flex',\n      alignItems: 'flex-start',\n\n      __rules: {\n        '& > p': {\n          whiteSpace: 'nowrap',\n          overflow: 'hidden',\n          textOverflow: 'ellipsis',\n          lineHeight: '1'\n        }\n      }\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\nimport type { ReactNode } from 'react'\n\n// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryHighlightStyles } from './styles'\n\ninterface Props {\n  loading?: boolean\n  highlightText?: string\n  highlightIcon?: ReactNode\n}\n\nexport const SummaryHighlight: React.FC<Props> = ({\n  loading,\n  highlightText,\n  highlightIcon\n}) => {\n  // Hooks\n  const { styles } = useThemedStyles({}, createSummaryHighlightStyles)\n\n  return (\n    <div style={styles.container}>\n      {highlightIcon ? (\n        <div style={styles.iconContainer}>{highlightIcon}</div>\n      ) : null}\n\n      <div style={styles.textContainer}>\n        <Typography\n          variant=\"b1\"\n          lineHeight=\"100%\"\n          fontSize=\"0.875rem\"\n          fontWeight=\"regular\"\n          isLoading={loading}\n        >\n          {highlightText}\n        </Typography>\n      </div>\n    </div>\n  )\n}\n","// Types\nimport type { SummaryItemProps } from './types'\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryItemStyles(props: SummaryItemProps): StyleMap {\n  return styled({\n    container: {\n      height: '100%',\n      borderRight: props.isLast ? 'none' : '1px solid var(--border-secondary)'\n    },\n\n    content: {\n      minWidth: '8rem',\n      height: '100%',\n\n      display: 'flex',\n      flexDirection: 'column',\n\n      rowGap: '0.125rem',\n      paddingBlock: '0.5rem',\n      paddingInline: '1rem'\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { SummaryHeader } from './components/SummaryHeader'\nimport { SummaryCaption } from './components/SummaryCaption'\nimport { SummaryHighlight } from './components/SummaryHighlight'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SummaryItemProps } from './types'\n\n// Styles\nimport { createSummaryItemStyles } from './styles'\n\nexport const SummaryItem: React.FC<SummaryItemProps> = props => {\n  // Hooks\n  const { styles } = useThemedStyles(props, createSummaryItemStyles)\n\n  return (\n    <li style={styles.container}>\n      <article style={styles.content}>\n        <SummaryHeader icon={props.item.titleIcon} title={props.item.title} />\n\n        <SummaryHighlight\n          loading={props.loading}\n          highlightText={props.item.highlight}\n          highlightIcon={props.item.highlightIcon}\n        />\n\n        <SummaryCaption\n          loading={props.loading}\n          captionText={props.item.caption}\n        />\n      </article>\n    </li>\n  )\n}\n","// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createInfoSummaryStyles(): StyleMap {\n  return styled({\n    section: {\n      height: '5rem',\n      minHeight: '5rem',\n\n      width: 'fit-content',\n\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'center',\n\n      borderWidth: 1,\n      backgroundColor: 'var(--px-bg)',\n      borderColor: 'var(--px-border-primary)',\n\n      borderRadius: '10px',\n      paddingBlock: 'var(--px-space-sm)'\n    },\n\n    summaryListContainer: {\n      width: '100%',\n      height: '100%',\n\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'flex-start'\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { SummaryItem } from './components/SummaryItem'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { InfoSummaryProps } from './types'\n\n// Styles\nimport { createInfoSummaryStyles } from './styles'\n\nexport * from './types'\n\nexport const InfoSummary: React.FC<InfoSummaryProps> = ({ infos, loading }) => {\n  // Hooks\n  const { styles } = useThemedStyles({}, createInfoSummaryStyles)\n\n  // Functions\n  function renderSummaryItems() {\n    return (\n      <ul style={styles.summaryListContainer}>\n        {infos.map((info, index) => (\n          <SummaryItem\n            item={info}\n            key={info.id}\n            loading={loading}\n            isLast={index === infos.length - 1}\n          />\n        ))}\n      </ul>\n    )\n  }\n\n  return <section style={styles.section}>{renderSummaryItems()}</section>\n}\n"],"mappings":"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"}
+{"version":3,"file":"InfoSummary-D8x-t44q.js","names":["SummaryHeader: React.FC<Props>","SummaryCaption: React.FC<Props>","SummaryHighlight: React.FC<Props>","SummaryItem: React.FC<SummaryItemProps>","InfoSummary: React.FC<InfoSummaryProps>"],"sources":["../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryHeader/styles.ts","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryHeader/index.tsx","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryCaption/styles.ts","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryCaption/index.tsx","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryHighlight/styles.ts","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/components/SummaryHighlight/index.tsx","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/styles.ts","../src/components/commons/toolkit/InfoSummary/components/SummaryItem/index.tsx","../src/components/commons/toolkit/InfoSummary/styles.ts","../src/components/commons/toolkit/InfoSummary/index.tsx"],"sourcesContent":["// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryHeaderStyles(): StyleMap {\n  return styled({\n    container: {\n      width: '100%',\n      minHeight: '1rem',\n\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'flex-end',\n\n      gap: '0.125rem'\n    },\n\n    iconContainer: {\n      display: 'flex',\n      alignItems: 'flex-start'\n    },\n\n    textContainer: {\n      flex: '1',\n      maxWidth: '8rem',\n\n      display: 'flex',\n      alignItems: 'flex-start',\n\n      __rules: {\n        '& > p': {\n          whiteSpace: 'nowrap',\n          overflow: 'hidden',\n          textOverflow: 'ellipsis'\n        }\n      }\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\nimport type { ReactNode } from 'react'\n\n// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryHeaderStyles } from './styles'\n\ninterface Props {\n  title: string\n  icon?: ReactNode\n}\n\nexport const SummaryHeader: React.FC<Props> = ({ icon, title }) => {\n  const { styles } = useThemedStyles({}, createSummaryHeaderStyles)\n\n  return (\n    <header style={styles.container}>\n      {icon ? <div style={styles.iconContainer}>{icon}</div> : null}\n\n      <div style={styles.textContainer}>\n        <Typography variant=\"b1\" lineHeight=\"100%\" fontSize=\"0.75rem\">\n          {title}\n        </Typography>\n      </div>\n    </header>\n  )\n}\n","// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryCaptionStyles(): StyleMap {\n  return styled({\n    container: {\n      width: '100%',\n      minHeight: '0.625rem',\n\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'center',\n      justifyItems: 'start',\n\n      columnGap: '0.125rem'\n    },\n\n    textContainer: {\n      flex: '1',\n      maxWidth: '8rem',\n\n      display: 'flex',\n      alignItems: 'center',\n\n      __rules: {\n        '& > p': {\n          whiteSpace: 'nowrap',\n          overflow: 'hidden',\n          textOverflow: 'ellipsis'\n        }\n      }\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryCaptionStyles } from './styles'\n\ninterface Props {\n  loading?: boolean\n  captionText?: string\n}\n\nexport const SummaryCaption: React.FC<Props> = ({ loading, captionText }) => {\n  // Hooks\n  const { styles } = useThemedStyles({}, createSummaryCaptionStyles)\n\n  return (\n    <div style={styles.container}>\n      <div style={styles.textContainer}>\n        <Typography\n          variant=\"b3\"\n          lineHeight=\"100%\"\n          isLoading={loading}\n          fontSize=\"0.625rem\"\n          color=\"var(--px-text-secondary)\"\n        >\n          {captionText}\n        </Typography>\n      </div>\n    </div>\n  )\n}\n","// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryHighlightStyles(): StyleMap {\n  return styled({\n    container: {\n      width: '100%',\n      minHeight: '1rem',\n\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'flex-end',\n\n      columnGap: '0.125rem'\n    },\n\n    iconContainer: {\n      display: 'flex',\n      alignItems: 'flex-start'\n    },\n\n    textContainer: {\n      flex: '1',\n      maxWidth: '8rem',\n\n      display: 'flex',\n      alignItems: 'flex-start',\n\n      __rules: {\n        '& > p': {\n          whiteSpace: 'nowrap',\n          overflow: 'hidden',\n          textOverflow: 'ellipsis',\n          lineHeight: '1'\n        }\n      }\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\nimport type { ReactNode } from 'react'\n\n// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createSummaryHighlightStyles } from './styles'\n\ninterface Props {\n  loading?: boolean\n  highlightText?: string\n  highlightIcon?: ReactNode\n}\n\nexport const SummaryHighlight: React.FC<Props> = ({\n  loading,\n  highlightText,\n  highlightIcon\n}) => {\n  // Hooks\n  const { styles } = useThemedStyles({}, createSummaryHighlightStyles)\n\n  return (\n    <div style={styles.container}>\n      {highlightIcon ? (\n        <div style={styles.iconContainer}>{highlightIcon}</div>\n      ) : null}\n\n      <div style={styles.textContainer}>\n        <Typography\n          variant=\"b1\"\n          lineHeight=\"100%\"\n          fontSize=\"0.875rem\"\n          fontWeight=\"regular\"\n          isLoading={loading}\n        >\n          {highlightText}\n        </Typography>\n      </div>\n    </div>\n  )\n}\n","// Types\nimport type { SummaryItemProps } from './types'\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createSummaryItemStyles(props: SummaryItemProps): StyleMap {\n  return styled({\n    container: {\n      height: '100%',\n      borderRight: props.isLast ? 'none' : '1px solid var(--border-secondary)'\n    },\n\n    content: {\n      minWidth: '8rem',\n      height: '100%',\n\n      display: 'flex',\n      flexDirection: 'column',\n\n      rowGap: '0.125rem',\n      paddingBlock: '0.5rem',\n      paddingInline: '1rem'\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { SummaryHeader } from './components/SummaryHeader'\nimport { SummaryCaption } from './components/SummaryCaption'\nimport { SummaryHighlight } from './components/SummaryHighlight'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SummaryItemProps } from './types'\n\n// Styles\nimport { createSummaryItemStyles } from './styles'\n\nexport const SummaryItem: React.FC<SummaryItemProps> = props => {\n  // Hooks\n  const { styles } = useThemedStyles(props, createSummaryItemStyles)\n\n  return (\n    <li style={styles.container}>\n      <article style={styles.content}>\n        <SummaryHeader icon={props.item.titleIcon} title={props.item.title} />\n\n        <SummaryHighlight\n          loading={props.loading}\n          highlightText={props.item.highlight}\n          highlightIcon={props.item.highlightIcon}\n        />\n\n        <SummaryCaption\n          loading={props.loading}\n          captionText={props.item.caption}\n        />\n      </article>\n    </li>\n  )\n}\n","// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createInfoSummaryStyles(): StyleMap {\n  return styled({\n    section: {\n      height: '5rem',\n      minHeight: '5rem',\n\n      width: 'fit-content',\n\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'center',\n\n      borderWidth: 1,\n      backgroundColor: 'var(--px-bg)',\n      borderColor: 'var(--px-border-primary)',\n\n      borderRadius: '10px',\n      paddingBlock: 'var(--px-space-sm)'\n    },\n\n    summaryListContainer: {\n      width: '100%',\n      height: '100%',\n\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'flex-start'\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { SummaryItem } from './components/SummaryItem'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { InfoSummaryProps } from './types'\n\n// Styles\nimport { createInfoSummaryStyles } from './styles'\n\nexport * from './types'\n\nexport const InfoSummary: React.FC<InfoSummaryProps> = ({ infos, loading }) => {\n  // Hooks\n  const { styles } = useThemedStyles({}, createInfoSummaryStyles)\n\n  // Functions\n  function renderSummaryItems() {\n    return (\n      <ul style={styles.summaryListContainer}>\n        {infos.map((info, index) => (\n          <SummaryItem\n            item={info}\n            key={info.id}\n            loading={loading}\n            isLast={index === infos.length - 1}\n          />\n        ))}\n      </ul>\n    )\n  }\n\n  return <section style={styles.section}>{renderSummaryItems()}</section>\n}\n"],"mappings":"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"}

package/dist/{Input-BLnysNxN.js → Input-ChS1OoFI.js}

@@ -1,6 +1,6 @@
 import { n as styled, t as useThemedStyles } from "./useThemedStyles-Dco_54KA.js";
 import { t as Icon } from "./Icon-bV19y393.js";
-import { t as Label } from "./Label-VE3hoSbt.js";
+import { t as Label } from "./Label-CBUa-x13.js";
 import { t as ErrorMessage } from "./ErrorMessage-6pG4hFId.js";
 import { c as MaskModule, i as FloatMask, o as Locale, r as IntegerMask, s as MaskType } from "./MaskModule-DZko7F_e.js";
 import { forwardRef, useEffect, useId, useImperativeHandle, useMemo, useRef, useState } from "react";
@@ -17,7 +17,8 @@ function useInput(props) {
 	const { value, delay, mask, onChange, min, max, ...rest } = props;
 	const inputRef = useRef(null);
 	const timeoutRef = useRef(null);
-	const [inputValue, setInputValue] = useState(props.value);
+	const internalValueRef = useRef(value);
+	const [inputValue, setInputValue] = useState(value);
 	const [showPassword, setShowPassword] = useState(false);
 	const { minLength, maxLength } = useMemo(() => {
 		const appliedMask = getMask();
@@ -30,9 +31,6 @@ function useInput(props) {
 		rest.minLength,
 		rest.maxLength
 	]);
-	useEffect(() => {
-		setInputValue(value);
-	}, [value]);
 	function getMask() {
 		if (!mask) return void 0;
 		if (mask === MaskType.INTEGER) return new IntegerMask({
@@ -57,6 +55,12 @@ function useInput(props) {
 	function handleBlur() {
 		inputRef.current?.blur();
 	}
+	useEffect(() => {
+		if (value !== internalValueRef.current) {
+			internalValueRef.current = value;
+			setInputValue(value);
+		}
+	}, [value]);
 	function handleChange(e) {
 		let value$1 = e.target.value;
 		if (timeoutRef.current) clearTimeout(timeoutRef.current);
@@ -64,6 +68,8 @@ function useInput(props) {
 			const module = getMask();
 			if (module) value$1 = module.format(value$1);
 		}
+		internalValueRef.current = value$1;
+		setInputValue(value$1);
 		if (!delay) onChange?.(value$1);
 		else timeoutRef.current = setTimeout(() => onChange?.(value$1), delay);
 	}
@@ -144,7 +150,11 @@ const Input = forwardRef((props, ref) => {
 	const { inputRef, minLength, maxLength, inputValue, showPassword, handleChange, handleRefMethods, togglePasswordVisibility } = useInput(props);
 	useImperativeHandle(ref, handleRefMethods);
 	const { styles, classes } = useThemedStyles(props, createInputStyles, {
-		pick: (p) => [p.disabled, p.errorMessage],
+		pick: (p) => [
+			p.disabled,
+			p.errorMessage,
+			p.value
+		],
 		override: props.styles,
 		applyCommonProps: true,
 		commonSlot: "container"
@@ -212,4 +222,4 @@ Input.displayName = "Input";
 
 //#endregion
 export { Input as t };
-//# sourceMappingURL=Input-BLnysNxN.js.map
+//# sourceMappingURL=Input-ChS1OoFI.js.map

package/dist/Input-ChS1OoFI.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input-ChS1OoFI.js","names":["value"],"sources":["../src/components/commons/inputs/Input/hooks/utils.ts","../src/components/commons/inputs/Input/hooks/useInput/index.ts","../src/components/commons/inputs/Input/styles.ts","../src/components/commons/inputs/Input/index.tsx"],"sourcesContent":["import type { FloatProps, InputProps } from '../types'\n\nexport function checkIsFloatConfig(props: InputProps): props is FloatProps {\n  return props.mask === 'FLOAT'\n}\n","// External Libraries\nimport { useState, useRef, useMemo, useEffect } from 'react'\n\n// Services\nimport { Locale, MaskModule, MaskType } from 'src/services/MaskModule'\n\n// Utils\nimport { checkIsFloatConfig } from '../utils'\n\n// Types\nimport type { InputProps } from '../../types'\nimport { FloatMask } from '@services/MaskModule/locales/br/masks/FloatMask'\nimport { IntegerMask } from '@services/MaskModule/locales/br/masks/IntegerMask'\n\nexport function useInput(props: InputProps) {\n  // Constants\n  const { value, delay, mask, onChange, min, max, ...rest } = props\n  // Refs\n  const inputRef = useRef<HTMLInputElement>(null)\n  const timeoutRef = useRef<NodeJS.Timeout>(null)\n  const internalValueRef = useRef(value)\n\n  // States\n  const [inputValue, setInputValue] = useState(value)\n  const [showPassword, setShowPassword] = useState(false)\n\n  // Constants\n  // biome-ignore lint/correctness/useExhaustiveDependencies: Not Needed\n  const { minLength, maxLength } = useMemo(() => {\n    const appliedMask = getMask()\n\n    const minLength = rest.minLength ?? appliedMask?.minLength\n    const maxLength = rest.maxLength ?? appliedMask?.maxLength\n\n    return { minLength, maxLength }\n  }, [mask, rest.minLength, rest.maxLength])\n\n  // Functions\n  function getMask() {\n    if (!mask) return undefined\n\n    if (mask === MaskType.INTEGER) return new IntegerMask({ max, min })\n\n    if (mask === MaskType.FLOAT && checkIsFloatConfig(props)) {\n      return new FloatMask({ decimalDigits: props.decimalPlaces })\n    }\n\n    return MaskModule.getMask(Locale.BR, mask)\n  }\n\n  function togglePasswordVisibility() {\n    setShowPassword(prev => !prev)\n  }\n\n  function handleRefMethods() {\n    return { focus: handleFocus, blur: handleBlur }\n  }\n\n  function handleFocus() {\n    inputRef.current?.focus()\n  }\n\n  function handleBlur() {\n    inputRef.current?.blur()\n  }\n\n  // Sync only external value changes (not triggered by user typing)\n  useEffect(() => {\n    if (value !== internalValueRef.current) {\n      internalValueRef.current = value\n      setInputValue(value)\n    }\n  }, [value])\n\n  function handleChange(e: React.ChangeEvent<HTMLInputElement>) {\n    let value = e.target.value\n\n    if (timeoutRef.current) clearTimeout(timeoutRef.current)\n\n    if (mask) {\n      const module = getMask()\n      if (module) value = module.format(value)\n    }\n\n    internalValueRef.current = value\n    setInputValue(value)\n\n    if (!delay) onChange?.(value)\n    else {\n      timeoutRef.current = setTimeout(() => onChange?.(value), delay)\n    }\n  }\n\n  return {\n    inputRef,\n    minLength,\n    maxLength,\n    inputValue,\n    showPassword,\n    handleChange,\n    handleRefMethods,\n    togglePasswordVisibility\n  }\n}\n","// Hooks\nimport { styled } from '@hooks/useThemedStyles/types'\n\n// Types\nimport type { InputProps } from './types'\n\nexport function createInputStyles(props: InputProps) {\n  return styled({\n    container: {\n      width: '100%',\n\n      display: 'flex',\n      flexDirection: 'column',\n\n      rowGap: '0.375rem'\n    },\n    wrapper: {\n      width: '100%',\n      display: 'flex',\n      alignItems: 'center',\n\n      borderWidth: 1,\n      columnGap: '0.25rem',\n      borderRadius: '0.5rem',\n      padding: '0.625rem 0.875rem',\n\n      opacity: props.disabled ? 0.5 : 1,\n      boxShadow: 'var(--px-shadow-default)',\n      borderColor: props.errorMessage\n        ? 'var(--px-color-error)'\n        : 'var(--px-border-primary)',\n\n      __rules: {\n        '&:focus-within': {\n          outlineOffset: '-1px',\n          outline: `2px solid var(${props.errorMessage ? '--px-color-error' : '--px-color-primary'})`\n        }\n      }\n    },\n\n    input: {\n      flex: 1,\n\n      fontWeight: 500,\n      fontSize: '1rem',\n      lineHeight: '1.5rem',\n      fontFamily: 'inherit',\n      color: 'var(--px-text-primary)',\n\n      __rules: {\n        '&:disabled': {\n          cursor: 'not-allowed'\n        },\n\n        '&:focus': {\n          outline: 'none'\n        },\n\n        '&::placeholder': {\n          fontWeight: 400,\n          color: 'var(--px-text-secondary)'\n        }\n      }\n    },\n\n    button: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n\n      cursor: 'pointer',\n      padding: '0.25rem',\n      borderRadius: '0.5rem',\n\n      __rules: {\n        '&:focus': {\n          outline: '1px solid var(--px-border-primary)'\n        }\n      }\n    }\n  })\n}\n","/** biome-ignore-all lint/a11y/noAutofocus: It's a custom input component */\n// External Libraries\nimport { forwardRef, useId, useImperativeHandle, useMemo } from 'react'\n\n// Components\nimport { Label } from '../../toolkit/Label'\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { ErrorMessage } from '../../toolkit/ErrorMessage'\n\n// Types\nimport type { InputProps, InputMethods } from './types'\n\n// Hooks\nimport { useInput } from './hooks/useInput'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createInputStyles } from './styles'\n\nexport const Input = forwardRef<InputMethods, InputProps>((props, ref) => {\n  // Constants\n  const reactId = useId()\n  const inputId = useMemo(() => {\n    return props.id || `input-${reactId}`\n  }, [props.id, reactId])\n\n  // Hooks\n  const {\n    inputRef,\n    minLength,\n    maxLength,\n    inputValue,\n    showPassword,\n    handleChange,\n    handleRefMethods,\n    togglePasswordVisibility\n  } = useInput(props)\n  useImperativeHandle(ref, handleRefMethods)\n\n  // Hooks\n  const { styles, classes } = useThemedStyles(props, createInputStyles, {\n    pick: p => [p.disabled, p.errorMessage, p.value],\n    override: props.styles,\n    applyCommonProps: true,\n    commonSlot: 'container'\n  })\n\n  // Functions\n  function getType() {\n    if (props.type === 'password' && showPassword) return 'text'\n    return props.type\n  }\n\n  function renderEndContent() {\n    if (props.type === 'password') {\n      return (\n        <button\n          type=\"button\"\n          style={styles.button}\n          className={classes.button}\n          onClick={togglePasswordVisibility}\n        >\n          <Icon\n            size=\"sm\"\n            name={showPassword ? 'general-eye-off' : 'general-eye'}\n          />\n        </button>\n      )\n    }\n\n    return props.endIcon ?? null\n  }\n\n  return (\n    <div style={styles.container}>\n      {props.hideLabel ? null : (\n        <Label\n          htmlFor={inputId}\n          label={props.label}\n          required={props.required}\n          requiredColor={props.requiredColor}\n          {...props.labelConfig}\n        />\n      )}\n\n      <div style={styles.wrapper} className={classes.wrapper}>\n        {props.startIcon}\n\n        <input\n          ref={inputRef}\n          id={inputId}\n          type={getType()}\n          value={inputValue}\n          style={styles.input}\n          minLength={minLength}\n          maxLength={maxLength}\n          required={props.required}\n          disabled={props.disabled}\n          className={classes.input}\n          autoFocus={props.autoFocus}\n          spellCheck={props.spellCheck}\n          autoCorrect={props.autoCorrect}\n          placeholder={props.placeholder}\n          autoComplete={props.autoComplete}\n          autoCapitalize={props.autoCapitalize}\n          aria-label={!props.hideLabel ? undefined : props.label}\n          onChange={handleChange}\n        />\n\n        {renderEndContent()}\n      </div>\n\n      {props.errorMessage ? (\n        <ErrorMessage message={props.errorMessage} />\n      ) : null}\n    </div>\n  )\n})\n\nInput.displayName = 'Input'\n"],"mappings":"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"}

package/dist/{Label-VE3hoSbt.js → Label-CBUa-x13.js}

@@ -1,4 +1,4 @@
-import { t as Typography } from "./Typography-u0BPHgCr.js";
+import { t as Typography } from "./Typography-CcQTHV-F.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/commons/toolkit/Label/index.tsx
@@ -22,4 +22,4 @@ const Label = (props) => {
 
 //#endregion
 export { Label as t };
-//# sourceMappingURL=Label-VE3hoSbt.js.map
+//# sourceMappingURL=Label-CBUa-x13.js.map

package/dist/{Label-VE3hoSbt.js.map → Label-CBUa-x13.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Label-VE3hoSbt.js","names":["Label: React.FC<LabelProps>"],"sources":["../src/components/commons/toolkit/Label/index.tsx"],"sourcesContent":["// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Types\nimport type { LabelProps } from './types'\n\nexport const Label: React.FC<LabelProps> = props => {\n  const {\n    label,\n    color,\n    htmlFor,\n    required,\n    requiredColor,\n    variant = 'b2',\n    ...rest\n  } = props\n\n  return (\n    <label htmlFor={htmlFor}>\n      <Typography\n        variant={variant}\n        color={color ?? 'var(px-text-primary)'}\n        {...rest}\n      >\n        {label}\n\n        {required ? (\n          <Typography\n            as=\"span\"\n            variant=\"b2\"\n            color={requiredColor ?? 'var(--px-text-error)'}\n          >\n            {' '}\n            *\n          </Typography>\n        ) : null}\n      </Typography>\n    </label>\n  )\n}\n"],"mappings":";;;;AAMA,MAAaA,SAA8B,UAAS;CAClD,MAAM,EACJ,OACA,OACA,SACA,UACA,eACA,UAAU,MACV,GAAG,SACD;AAEJ,QACE,oBAAC;EAAe;YACd,qBAAC;GACU;GACT,OAAO,SAAS;GAChB,GAAI;cAEH,OAEA,WACC,qBAAC;IACC,IAAG;IACH,SAAQ;IACR,OAAO,iBAAiB;eAEvB,KAAI;KAEM,GACX;IACO;GACP"}
+{"version":3,"file":"Label-CBUa-x13.js","names":["Label: React.FC<LabelProps>"],"sources":["../src/components/commons/toolkit/Label/index.tsx"],"sourcesContent":["// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Types\nimport type { LabelProps } from './types'\n\nexport const Label: React.FC<LabelProps> = props => {\n  const {\n    label,\n    color,\n    htmlFor,\n    required,\n    requiredColor,\n    variant = 'b2',\n    ...rest\n  } = props\n\n  return (\n    <label htmlFor={htmlFor}>\n      <Typography\n        variant={variant}\n        color={color ?? 'var(px-text-primary)'}\n        {...rest}\n      >\n        {label}\n\n        {required ? (\n          <Typography\n            as=\"span\"\n            variant=\"b2\"\n            color={requiredColor ?? 'var(--px-text-error)'}\n          >\n            {' '}\n            *\n          </Typography>\n        ) : null}\n      </Typography>\n    </label>\n  )\n}\n"],"mappings":";;;;AAMA,MAAaA,SAA8B,UAAS;CAClD,MAAM,EACJ,OACA,OACA,SACA,UACA,eACA,UAAU,MACV,GAAG,SACD;AAEJ,QACE,oBAAC;EAAe;YACd,qBAAC;GACU;GACT,OAAO,SAAS;GAChB,GAAI;cAEH,OAEA,WACC,qBAAC;IACC,IAAG;IACH,SAAQ;IACR,OAAO,iBAAiB;eAEvB,KAAI;KAEM,GACX;IACO;GACP"}

package/dist/{Pagination-DV4VUQj_.js → Pagination-i2_x464D.js}

@@ -1,8 +1,8 @@
 import { n as styled, t as useThemedStyles } from "./useThemedStyles-Dco_54KA.js";
-import { t as Typography } from "./Typography-u0BPHgCr.js";
+import { t as Typography } from "./Typography-CcQTHV-F.js";
 import { t as Icon } from "./Icon-bV19y393.js";
 import { t as IconButton } from "./IconButton-R8wpGZU_.js";
-import { t as Button } from "./Button-QcKlQyM3.js";
+import { t as Button } from "./Button-CWZvWbMh.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/commons/toolkit/Pagination/components/ArrowButtons/hooks/usePagination/index.ts
@@ -177,4 +177,4 @@ const Pagination = (props) => {
 
 //#endregion
 export { Pagination as t };
-//# sourceMappingURL=Pagination-DV4VUQj_.js.map
+//# sourceMappingURL=Pagination-i2_x464D.js.map

package/dist/{Pagination-DV4VUQj_.js.map → Pagination-i2_x464D.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Pagination-DV4VUQj_.js","names":["ArrowButtons: React.FC<ArrowButtonProps>","Pagination: React.FC<PaginationProps>"],"sources":["../src/components/commons/toolkit/Pagination/components/ArrowButtons/hooks/usePagination/index.ts","../src/components/commons/toolkit/Pagination/styles.ts","../src/components/commons/toolkit/Pagination/components/ArrowButtons/index.tsx","../src/components/commons/toolkit/Pagination/utils/getVisiblePages/index.ts","../src/components/commons/toolkit/Pagination/index.tsx"],"sourcesContent":["import type { PaginationInfoProps } from './types'\n\nexport function usePagination({\n  pageNumber,\n  totalPages,\n  onPageChange\n}: PaginationInfoProps) {\n  // Functions\n  function handleFirstPage() {\n    if (pageNumber > 1) return onPageChange(1)\n  }\n\n  function handlePreviousPage() {\n    if (pageNumber > 1) return onPageChange(pageNumber - 1)\n  }\n\n  function handleNextPage() {\n    if (pageNumber < totalPages) return onPageChange(pageNumber + 1)\n  }\n\n  function handleLastPage() {\n    if (pageNumber < totalPages) return onPageChange(totalPages)\n  }\n\n  return {\n    handleFirstPage,\n    handlePreviousPage,\n    handleNextPage,\n    handleLastPage\n  }\n}\n","// Types\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createPaginationStyles() {\n  return styled({\n    container: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n\n      gap: '0.25rem'\n    },\n\n    pagesRow: {\n      display: 'flex',\n      alignItems: 'center',\n\n      gap: '0.25rem'\n    },\n\n    arrowButtons: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n\n      gap: '0.25rem'\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { IconButton } from '@components/commons/buttons/IconButton'\n\n// Hooks\nimport { usePagination } from './hooks/usePagination'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { ArrowButtonProps } from './types'\n\n// Styles\nimport { createPaginationStyles } from '../../styles'\n\nexport const ArrowButtons: React.FC<ArrowButtonProps> = props => {\n  const { pageNumber, totalPages, direction, onPageChange } = props\n\n  // Constants\n  const isFirstPage = pageNumber === 1\n  const isLastPage = pageNumber === totalPages\n\n  // Hooks\n  const {\n    handleFirstPage,\n    handlePreviousPage,\n    handleNextPage,\n    handleLastPage\n  } = usePagination({ pageNumber, totalPages, onPageChange })\n  const { styles } = useThemedStyles(props, createPaginationStyles)\n\n  // Functions\n  function renderPreviousButtons() {\n    if (totalPages === 1) return null\n\n    return (\n      <div style={styles.arrowButtons}>\n        <IconButton\n          variant=\"outlined\"\n          isDisabled={isFirstPage}\n          icon={<Icon name={'chevrons-double-left'} />}\n          onClick={handleFirstPage}\n        />\n\n        <IconButton\n          variant=\"outlined\"\n          isDisabled={isFirstPage}\n          icon={<Icon name={'chevrons-left'} />}\n          onClick={handlePreviousPage}\n        />\n      </div>\n    )\n  }\n\n  function renderNextButtons() {\n    if (totalPages === 1) return null\n\n    return (\n      <div style={styles.arrowButtons}>\n        <IconButton\n          variant=\"outlined\"\n          isDisabled={isLastPage}\n          icon={<Icon name={'chevrons-right'} />}\n          onClick={handleNextPage}\n        />\n\n        <IconButton\n          variant=\"outlined\"\n          isDisabled={isLastPage}\n          icon={<Icon name={'chevrons-double-right'} />}\n          onClick={handleLastPage}\n        />\n      </div>\n    )\n  }\n\n  return direction === 'left' ? renderPreviousButtons() : renderNextButtons()\n}\n","interface Props {\n  pageNumber: number\n  totalPages: number\n}\n\nexport function getVisiblePages({\n  pageNumber,\n  totalPages\n}: Props): (number | string)[] {\n  if (totalPages <= 4) {\n    return Array.from({ length: totalPages }, (_, i) => i + 1)\n  }\n\n  if (pageNumber <= 3) {\n    return [1, 2, 3, '...', totalPages]\n  }\n\n  if (pageNumber >= totalPages - 2) {\n    return [totalPages - 3, totalPages - 2, totalPages - 1, totalPages]\n  }\n\n  return [pageNumber - 1, pageNumber, pageNumber + 1, '...', totalPages]\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { Typography } from '../Typography'\nimport { ArrowButtons } from './components/ArrowButtons'\nimport { Button } from '@components/commons/buttons/Button'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Utils\nimport { getVisiblePages } from './utils/getVisiblePages'\n\n// Types\nimport type { PaginationProps } from './types'\n\n// Styles\nimport { createPaginationStyles } from './styles'\n\nexport const Pagination: React.FC<PaginationProps> = props => {\n  const { pageNumber, totalPages, onPageChange } = props\n\n  // Hooks\n  const { styles } = useThemedStyles(props, createPaginationStyles, {\n    applyCommonProps: true,\n    commonSlot: 'container'\n  })\n\n  // Functions\n  function renderPagination() {\n    const pages = getVisiblePages({ pageNumber, totalPages })\n\n    return (\n      <div style={styles.pagesRow}>\n        {pages.map((page, index) =>\n          page === '...' ? (\n            <Typography\n              key={`ellipsis-${index.toString()}`}\n              variant=\"b1\"\n              color={'var(--px-btn-outlined-label)'}\n              styles={{ text: { paddingTop: '0.5rem' } }}\n            >\n              ...\n            </Typography>\n          ) : (\n            <Button\n              key={`${page}-${index.toString()}`}\n              px=\"1rem\"\n              py=\"0.5rem\"\n              label={String(page)}\n              variant={page === pageNumber ? 'filled' : 'outlined'}\n              onClick={() => onPageChange(page as number)}\n            />\n          )\n        )}\n      </div>\n    )\n  }\n\n  return (\n    <div style={styles.container}>\n      <ArrowButtons\n        direction=\"left\"\n        pageNumber={pageNumber}\n        totalPages={totalPages}\n        onPageChange={onPageChange}\n      />\n\n      {renderPagination()}\n\n      <ArrowButtons\n        direction=\"right\"\n        pageNumber={pageNumber}\n        totalPages={totalPages}\n        onPageChange={onPageChange}\n      />\n    </div>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"Pagination-i2_x464D.js","names":["ArrowButtons: React.FC<ArrowButtonProps>","Pagination: React.FC<PaginationProps>"],"sources":["../src/components/commons/toolkit/Pagination/components/ArrowButtons/hooks/usePagination/index.ts","../src/components/commons/toolkit/Pagination/styles.ts","../src/components/commons/toolkit/Pagination/components/ArrowButtons/index.tsx","../src/components/commons/toolkit/Pagination/utils/getVisiblePages/index.ts","../src/components/commons/toolkit/Pagination/index.tsx"],"sourcesContent":["import type { PaginationInfoProps } from './types'\n\nexport function usePagination({\n  pageNumber,\n  totalPages,\n  onPageChange\n}: PaginationInfoProps) {\n  // Functions\n  function handleFirstPage() {\n    if (pageNumber > 1) return onPageChange(1)\n  }\n\n  function handlePreviousPage() {\n    if (pageNumber > 1) return onPageChange(pageNumber - 1)\n  }\n\n  function handleNextPage() {\n    if (pageNumber < totalPages) return onPageChange(pageNumber + 1)\n  }\n\n  function handleLastPage() {\n    if (pageNumber < totalPages) return onPageChange(totalPages)\n  }\n\n  return {\n    handleFirstPage,\n    handlePreviousPage,\n    handleNextPage,\n    handleLastPage\n  }\n}\n","// Types\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createPaginationStyles() {\n  return styled({\n    container: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n\n      gap: '0.25rem'\n    },\n\n    pagesRow: {\n      display: 'flex',\n      alignItems: 'center',\n\n      gap: '0.25rem'\n    },\n\n    arrowButtons: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n\n      gap: '0.25rem'\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { IconButton } from '@components/commons/buttons/IconButton'\n\n// Hooks\nimport { usePagination } from './hooks/usePagination'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { ArrowButtonProps } from './types'\n\n// Styles\nimport { createPaginationStyles } from '../../styles'\n\nexport const ArrowButtons: React.FC<ArrowButtonProps> = props => {\n  const { pageNumber, totalPages, direction, onPageChange } = props\n\n  // Constants\n  const isFirstPage = pageNumber === 1\n  const isLastPage = pageNumber === totalPages\n\n  // Hooks\n  const {\n    handleFirstPage,\n    handlePreviousPage,\n    handleNextPage,\n    handleLastPage\n  } = usePagination({ pageNumber, totalPages, onPageChange })\n  const { styles } = useThemedStyles(props, createPaginationStyles)\n\n  // Functions\n  function renderPreviousButtons() {\n    if (totalPages === 1) return null\n\n    return (\n      <div style={styles.arrowButtons}>\n        <IconButton\n          variant=\"outlined\"\n          isDisabled={isFirstPage}\n          icon={<Icon name={'chevrons-double-left'} />}\n          onClick={handleFirstPage}\n        />\n\n        <IconButton\n          variant=\"outlined\"\n          isDisabled={isFirstPage}\n          icon={<Icon name={'chevrons-left'} />}\n          onClick={handlePreviousPage}\n        />\n      </div>\n    )\n  }\n\n  function renderNextButtons() {\n    if (totalPages === 1) return null\n\n    return (\n      <div style={styles.arrowButtons}>\n        <IconButton\n          variant=\"outlined\"\n          isDisabled={isLastPage}\n          icon={<Icon name={'chevrons-right'} />}\n          onClick={handleNextPage}\n        />\n\n        <IconButton\n          variant=\"outlined\"\n          isDisabled={isLastPage}\n          icon={<Icon name={'chevrons-double-right'} />}\n          onClick={handleLastPage}\n        />\n      </div>\n    )\n  }\n\n  return direction === 'left' ? renderPreviousButtons() : renderNextButtons()\n}\n","interface Props {\n  pageNumber: number\n  totalPages: number\n}\n\nexport function getVisiblePages({\n  pageNumber,\n  totalPages\n}: Props): (number | string)[] {\n  if (totalPages <= 4) {\n    return Array.from({ length: totalPages }, (_, i) => i + 1)\n  }\n\n  if (pageNumber <= 3) {\n    return [1, 2, 3, '...', totalPages]\n  }\n\n  if (pageNumber >= totalPages - 2) {\n    return [totalPages - 3, totalPages - 2, totalPages - 1, totalPages]\n  }\n\n  return [pageNumber - 1, pageNumber, pageNumber + 1, '...', totalPages]\n}\n","// External Libraries\nimport type React from 'react'\n\n// Components\nimport { Typography } from '../Typography'\nimport { ArrowButtons } from './components/ArrowButtons'\nimport { Button } from '@components/commons/buttons/Button'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Utils\nimport { getVisiblePages } from './utils/getVisiblePages'\n\n// Types\nimport type { PaginationProps } from './types'\n\n// Styles\nimport { createPaginationStyles } from './styles'\n\nexport const Pagination: React.FC<PaginationProps> = props => {\n  const { pageNumber, totalPages, onPageChange } = props\n\n  // Hooks\n  const { styles } = useThemedStyles(props, createPaginationStyles, {\n    applyCommonProps: true,\n    commonSlot: 'container'\n  })\n\n  // Functions\n  function renderPagination() {\n    const pages = getVisiblePages({ pageNumber, totalPages })\n\n    return (\n      <div style={styles.pagesRow}>\n        {pages.map((page, index) =>\n          page === '...' ? (\n            <Typography\n              key={`ellipsis-${index.toString()}`}\n              variant=\"b1\"\n              color={'var(--px-btn-outlined-label)'}\n              styles={{ text: { paddingTop: '0.5rem' } }}\n            >\n              ...\n            </Typography>\n          ) : (\n            <Button\n              key={`${page}-${index.toString()}`}\n              px=\"1rem\"\n              py=\"0.5rem\"\n              label={String(page)}\n              variant={page === pageNumber ? 'filled' : 'outlined'}\n              onClick={() => onPageChange(page as number)}\n            />\n          )\n        )}\n      </div>\n    )\n  }\n\n  return (\n    <div style={styles.container}>\n      <ArrowButtons\n        direction=\"left\"\n        pageNumber={pageNumber}\n        totalPages={totalPages}\n        onPageChange={onPageChange}\n      />\n\n      {renderPagination()}\n\n      <ArrowButtons\n        direction=\"right\"\n        pageNumber={pageNumber}\n        totalPages={totalPages}\n        onPageChange={onPageChange}\n      />\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/{SearchInput-vI-WcTPT.js → SearchInput-zePMheJK.js}

@@ -1,6 +1,6 @@
 import { n as styled, t as useThemedStyles } from "./useThemedStyles-Dco_54KA.js";
 import { t as Icon } from "./Icon-bV19y393.js";
-import { t as Label } from "./Label-VE3hoSbt.js";
+import { t as Label } from "./Label-CBUa-x13.js";
 import { useEffect, useId, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 
@@ -104,4 +104,4 @@ const SearchInput = ({ delay = 500, ...props }) => {
 
 //#endregion
 export { SearchInput as t };
-//# sourceMappingURL=SearchInput-vI-WcTPT.js.map
+//# sourceMappingURL=SearchInput-zePMheJK.js.map

package/dist/{SearchInput-vI-WcTPT.js.map → SearchInput-zePMheJK.js.map}

@@ -1 +1 @@
-{"version":3,"file":"SearchInput-vI-WcTPT.js","names":["SearchInput: React.FC<SearchInputProps>"],"sources":["../src/components/commons/inputs/SearchInput/styles.ts","../src/components/commons/inputs/SearchInput/index.tsx"],"sourcesContent":["import { styled } from '@hooks/useThemedStyles/types'\n\nexport function createSearchInputStyles() {\n  return styled({\n    container: {\n      width: '100%',\n      display: 'flex',\n      flexDirection: 'column',\n      rowGap: '0.5rem'\n    },\n\n    wrapper: {\n      width: '100%',\n      display: 'flex',\n      alignItems: 'center',\n\n      borderWidth: 1,\n      columnGap: '0.5rem',\n      borderRadius: '0.5rem',\n      padding: '0.625rem 0.875rem',\n\n      boxShadow: 'var(--px-shadow-default)',\n      borderColor: 'var(--px-border-primary)',\n\n      __rules: {\n        '&:focus-within': {\n          outlineOffset: '-1px',\n          outline: `2px solid var(--px-color-primary)`\n        }\n      }\n    },\n    input: {\n      flex: 1,\n\n      fontWeight: 500,\n      fontSize: '1rem',\n      lineHeight: '1.5rem',\n      fontFamily: 'inherit',\n      color: 'var(--px-text-primary)',\n\n      __rules: {\n        '&:disabled': {\n          cursor: 'not-allowed'\n        },\n\n        '&:focus': {\n          outline: 'none'\n        },\n\n        '&::placeholder': {\n          fontWeight: 400,\n          color: 'var(--px-text-secondary)'\n        }\n      }\n    }\n  })\n}\n","/** biome-ignore-all lint/a11y/noAutofocus: It's a custom search input component */\n// External Libraries\nimport type React from 'react'\nimport { useEffect, useId, useRef, useState } from 'react'\n\n// Components\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { Label } from '@components/commons/toolkit/Label'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SearchInputProps } from './types'\n\n// Styles\nimport { createSearchInputStyles } from './styles'\n\nexport const SearchInput: React.FC<SearchInputProps> = ({\n  delay = 500,\n  ...props\n}) => {\n  // Constants\n  const inputId = useId()\n  const resolvedProps = { ...props, delay }\n\n  // Hooks\n  const { styles, classes } = useThemedStyles(\n    resolvedProps,\n    createSearchInputStyles,\n    {\n      pick: p => [p.delay, p.value, p.hasSearchIcon],\n      applyCommonProps: true,\n      commonSlot: 'container'\n    }\n  )\n\n  // Refs\n  const timeoutRef = useRef<NodeJS.Timeout>(null)\n\n  // States\n  const [inputValue, setInputValue] = useState(props.value)\n\n  // UseEffects\n  useEffect(() => {\n    setInputValue(props.value)\n  }, [props.value])\n\n  // Functions\n  function handleInput(e: React.ChangeEvent<HTMLInputElement>) {\n    setInputValue(e.target.value)\n\n    if (timeoutRef.current) clearTimeout(timeoutRef.current)\n\n    timeoutRef.current = setTimeout(() => {\n      props.onChange(e.target.value)\n    }, delay)\n  }\n\n  return (\n    <div style={styles.container}>\n      {!props.hideLabel ? (\n        <Label htmlFor={inputId} label={props.label} />\n      ) : null}\n\n      <div style={styles.wrapper} className={classes.wrapper}>\n        {props.hasSearchIcon ? (\n          <Icon name=\"general-search\" size=\"sm\" color=\"secondary\" />\n        ) : null}\n\n        <input\n          id={inputId}\n          type=\"search\"\n          value={inputValue}\n          style={styles.input}\n          className={classes.input}\n          autoFocus={props.autoFocus}\n          placeholder={props.placeholder || 'Pesquisar'}\n          aria-label={!props.hideLabel ? undefined : props.label}\n          onChange={handleInput}\n        />\n      </div>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;AAEA,SAAgB,0BAA0B;AACxC,QAAO,OAAO;EACZ,WAAW;GACT,OAAO;GACP,SAAS;GACT,eAAe;GACf,QAAQ;GACT;EAED,SAAS;GACP,OAAO;GACP,SAAS;GACT,YAAY;GAEZ,aAAa;GACb,WAAW;GACX,cAAc;GACd,SAAS;GAET,WAAW;GACX,aAAa;GAEb,SAAS,EACP,kBAAkB;IAChB,eAAe;IACf,SAAS;IACV,EACF;GACF;EACD,OAAO;GACL,MAAM;GAEN,YAAY;GACZ,UAAU;GACV,YAAY;GACZ,YAAY;GACZ,OAAO;GAEP,SAAS;IACP,cAAc,EACZ,QAAQ,eACT;IAED,WAAW,EACT,SAAS,QACV;IAED,kBAAkB;KAChB,YAAY;KACZ,OAAO;KACR;IACF;GACF;EACF,CAAC;;;;;ACrCJ,MAAaA,eAA2C,EACtD,QAAQ,KACR,GAAG,YACC;CAEJ,MAAM,UAAU,OAAO;CAIvB,MAAM,EAAE,QAAQ,YAAY,gBAHN;EAAE,GAAG;EAAO;EAAO,EAKvC,yBACA;EACE,OAAM,MAAK;GAAC,EAAE;GAAO,EAAE;GAAO,EAAE;GAAc;EAC9C,kBAAkB;EAClB,YAAY;EACb,CACF;CAGD,MAAM,aAAa,OAAuB,KAAK;CAG/C,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM,MAAM;AAGzD,iBAAgB;AACd,gBAAc,MAAM,MAAM;IACzB,CAAC,MAAM,MAAM,CAAC;CAGjB,SAAS,YAAY,GAAwC;AAC3D,gBAAc,EAAE,OAAO,MAAM;AAE7B,MAAI,WAAW,QAAS,cAAa,WAAW,QAAQ;AAExD,aAAW,UAAU,iBAAiB;AACpC,SAAM,SAAS,EAAE,OAAO,MAAM;KAC7B,MAAM;;AAGX,QACE,qBAAC;EAAI,OAAO,OAAO;aAChB,CAAC,MAAM,YACN,oBAAC;GAAM,SAAS;GAAS,OAAO,MAAM;IAAS,GAC7C,MAEJ,qBAAC;GAAI,OAAO,OAAO;GAAS,WAAW,QAAQ;cAC5C,MAAM,gBACL,oBAAC;IAAK,MAAK;IAAiB,MAAK;IAAK,OAAM;KAAc,GACxD,MAEJ,oBAAC;IACC,IAAI;IACJ,MAAK;IACL,OAAO;IACP,OAAO,OAAO;IACd,WAAW,QAAQ;IACnB,WAAW,MAAM;IACjB,aAAa,MAAM,eAAe;IAClC,cAAY,CAAC,MAAM,YAAY,SAAY,MAAM;IACjD,UAAU;KACV;IACE;GACF"}
+{"version":3,"file":"SearchInput-zePMheJK.js","names":["SearchInput: React.FC<SearchInputProps>"],"sources":["../src/components/commons/inputs/SearchInput/styles.ts","../src/components/commons/inputs/SearchInput/index.tsx"],"sourcesContent":["import { styled } from '@hooks/useThemedStyles/types'\n\nexport function createSearchInputStyles() {\n  return styled({\n    container: {\n      width: '100%',\n      display: 'flex',\n      flexDirection: 'column',\n      rowGap: '0.5rem'\n    },\n\n    wrapper: {\n      width: '100%',\n      display: 'flex',\n      alignItems: 'center',\n\n      borderWidth: 1,\n      columnGap: '0.5rem',\n      borderRadius: '0.5rem',\n      padding: '0.625rem 0.875rem',\n\n      boxShadow: 'var(--px-shadow-default)',\n      borderColor: 'var(--px-border-primary)',\n\n      __rules: {\n        '&:focus-within': {\n          outlineOffset: '-1px',\n          outline: `2px solid var(--px-color-primary)`\n        }\n      }\n    },\n    input: {\n      flex: 1,\n\n      fontWeight: 500,\n      fontSize: '1rem',\n      lineHeight: '1.5rem',\n      fontFamily: 'inherit',\n      color: 'var(--px-text-primary)',\n\n      __rules: {\n        '&:disabled': {\n          cursor: 'not-allowed'\n        },\n\n        '&:focus': {\n          outline: 'none'\n        },\n\n        '&::placeholder': {\n          fontWeight: 400,\n          color: 'var(--px-text-secondary)'\n        }\n      }\n    }\n  })\n}\n","/** biome-ignore-all lint/a11y/noAutofocus: It's a custom search input component */\n// External Libraries\nimport type React from 'react'\nimport { useEffect, useId, useRef, useState } from 'react'\n\n// Components\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { Label } from '@components/commons/toolkit/Label'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SearchInputProps } from './types'\n\n// Styles\nimport { createSearchInputStyles } from './styles'\n\nexport const SearchInput: React.FC<SearchInputProps> = ({\n  delay = 500,\n  ...props\n}) => {\n  // Constants\n  const inputId = useId()\n  const resolvedProps = { ...props, delay }\n\n  // Hooks\n  const { styles, classes } = useThemedStyles(\n    resolvedProps,\n    createSearchInputStyles,\n    {\n      pick: p => [p.delay, p.value, p.hasSearchIcon],\n      applyCommonProps: true,\n      commonSlot: 'container'\n    }\n  )\n\n  // Refs\n  const timeoutRef = useRef<NodeJS.Timeout>(null)\n\n  // States\n  const [inputValue, setInputValue] = useState(props.value)\n\n  // UseEffects\n  useEffect(() => {\n    setInputValue(props.value)\n  }, [props.value])\n\n  // Functions\n  function handleInput(e: React.ChangeEvent<HTMLInputElement>) {\n    setInputValue(e.target.value)\n\n    if (timeoutRef.current) clearTimeout(timeoutRef.current)\n\n    timeoutRef.current = setTimeout(() => {\n      props.onChange(e.target.value)\n    }, delay)\n  }\n\n  return (\n    <div style={styles.container}>\n      {!props.hideLabel ? (\n        <Label htmlFor={inputId} label={props.label} />\n      ) : null}\n\n      <div style={styles.wrapper} className={classes.wrapper}>\n        {props.hasSearchIcon ? (\n          <Icon name=\"general-search\" size=\"sm\" color=\"secondary\" />\n        ) : null}\n\n        <input\n          id={inputId}\n          type=\"search\"\n          value={inputValue}\n          style={styles.input}\n          className={classes.input}\n          autoFocus={props.autoFocus}\n          placeholder={props.placeholder || 'Pesquisar'}\n          aria-label={!props.hideLabel ? undefined : props.label}\n          onChange={handleInput}\n        />\n      </div>\n    </div>\n  )\n}\n"],"mappings":";;;;;;;AAEA,SAAgB,0BAA0B;AACxC,QAAO,OAAO;EACZ,WAAW;GACT,OAAO;GACP,SAAS;GACT,eAAe;GACf,QAAQ;GACT;EAED,SAAS;GACP,OAAO;GACP,SAAS;GACT,YAAY;GAEZ,aAAa;GACb,WAAW;GACX,cAAc;GACd,SAAS;GAET,WAAW;GACX,aAAa;GAEb,SAAS,EACP,kBAAkB;IAChB,eAAe;IACf,SAAS;IACV,EACF;GACF;EACD,OAAO;GACL,MAAM;GAEN,YAAY;GACZ,UAAU;GACV,YAAY;GACZ,YAAY;GACZ,OAAO;GAEP,SAAS;IACP,cAAc,EACZ,QAAQ,eACT;IAED,WAAW,EACT,SAAS,QACV;IAED,kBAAkB;KAChB,YAAY;KACZ,OAAO;KACR;IACF;GACF;EACF,CAAC;;;;;ACrCJ,MAAaA,eAA2C,EACtD,QAAQ,KACR,GAAG,YACC;CAEJ,MAAM,UAAU,OAAO;CAIvB,MAAM,EAAE,QAAQ,YAAY,gBAHN;EAAE,GAAG;EAAO;EAAO,EAKvC,yBACA;EACE,OAAM,MAAK;GAAC,EAAE;GAAO,EAAE;GAAO,EAAE;GAAc;EAC9C,kBAAkB;EAClB,YAAY;EACb,CACF;CAGD,MAAM,aAAa,OAAuB,KAAK;CAG/C,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM,MAAM;AAGzD,iBAAgB;AACd,gBAAc,MAAM,MAAM;IACzB,CAAC,MAAM,MAAM,CAAC;CAGjB,SAAS,YAAY,GAAwC;AAC3D,gBAAc,EAAE,OAAO,MAAM;AAE7B,MAAI,WAAW,QAAS,cAAa,WAAW,QAAQ;AAExD,aAAW,UAAU,iBAAiB;AACpC,SAAM,SAAS,EAAE,OAAO,MAAM;KAC7B,MAAM;;AAGX,QACE,qBAAC;EAAI,OAAO,OAAO;aAChB,CAAC,MAAM,YACN,oBAAC;GAAM,SAAS;GAAS,OAAO,MAAM;IAAS,GAC7C,MAEJ,qBAAC;GAAI,OAAO,OAAO;GAAS,WAAW,QAAQ;cAC5C,MAAM,gBACL,oBAAC;IAAK,MAAK;IAAiB,MAAK;IAAK,OAAM;KAAc,GACxD,MAEJ,oBAAC;IACC,IAAI;IACJ,MAAK;IACL,OAAO;IACP,OAAO,OAAO;IACd,WAAW,QAAQ;IACnB,WAAW,MAAM;IACjB,aAAa,MAAM,eAAe;IAClC,cAAY,CAAC,MAAM,YAAY,SAAY,MAAM;IACjD,UAAU;KACV;IACE;GACF"}

package/dist/{Select-ChVwX-7Z.js → Select-C8JCFwDy.js}

@@ -1,12 +1,12 @@
 import { n as styled, t as useThemedStyles } from "./useThemedStyles-Dco_54KA.js";
-import { t as Typography } from "./Typography-u0BPHgCr.js";
+import { t as Typography } from "./Typography-CcQTHV-F.js";
 import { t as Icon } from "./Icon-bV19y393.js";
 import { t as BasePopover } from "./BasePopover-CY-9StFD.js";
-import { t as Label } from "./Label-VE3hoSbt.js";
+import { t as Label } from "./Label-CBUa-x13.js";
 import { t as ErrorMessage } from "./ErrorMessage-6pG4hFId.js";
 import { t as Loader } from "./Loader-BTp8PCMz.js";
 import { r as ScrollDirection, t as ScrollPaginationContainer } from "./ScrollPaginationContainer-isAA4BsG.js";
-import { t as Input } from "./Input-BLnysNxN.js";
+import { t as Input } from "./Input-ChS1OoFI.js";
 import { forwardRef, useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 
@@ -527,4 +527,4 @@ const Select = (props) => {
 
 //#endregion
 export { types_exports as n, Select as t };
-//# sourceMappingURL=Select-ChVwX-7Z.js.map
+//# sourceMappingURL=Select-C8JCFwDy.js.map

package/dist/{Select-ChVwX-7Z.js.map → Select-C8JCFwDy.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Select-ChVwX-7Z.js","names":["value","Select: React.FC<SelectProps>","result: React.ReactNode[] | string"],"sources":["../src/utils/functions/normalizeString.ts","../src/components/commons/inputs/Select/components/OptionItem/styles.ts","../src/components/commons/inputs/Select/components/OptionItem/index.tsx","../src/hooks/useCompositeListNavigation/index.ts","../src/components/commons/inputs/Select/hooks/useSelect/index.ts","../src/components/commons/inputs/Select/styles.ts","../src/components/commons/inputs/Select/types.ts","../src/components/commons/inputs/Select/index.tsx"],"sourcesContent":["export function normalizeString(value: string) {\n  if (!value || typeof value !== 'string') return ''\n\n  return value\n    .normalize('NFD')\n    .replace(/[\\u0300-\\u036f]/g, '')\n    .toUpperCase()\n    .trim()\n}\n","import type { OptionItemProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createOptionsStyles(\n  props: OptionItemProps & { ['data-active']?: string }\n) {\n  const { isSelected } = props\n  const isActive = props['data-active'] === 'true'\n  const highlighted = isSelected || isActive\n\n  return styled({\n    container: {\n      width: '100%',\n\n      display: 'flex',\n      alignItems: 'center',\n      textAlign: 'left',\n\n      borderRadius: '0.25rem',\n      padding: '0.5rem 0.75rem',\n\n      cursor: 'pointer',\n      transition: 'background-color 0.2s ease-out',\n\n      backgroundColor: highlighted\n        ? 'var(--px-background-card-hover)'\n        : 'transparent',\n\n      __rules: {\n        '&:hover': {\n          backgroundColor: 'var(--px-background-card-hover) !important'\n        },\n\n        '&:focus': {\n          outlineOffset: '-2px',\n          outline: '2px solid var(--px-color-primary)'\n        }\n      }\n    },\n\n    text: {\n      flex: 1,\n\n      fontSize: '1rem',\n      fontWeight: 500,\n      lineHeight: '1.5rem',\n      fontFamily: 'inherit',\n      color: 'var(--px-text-primary)',\n\n      overflow: 'hidden',\n      whiteSpace: 'nowrap',\n      textOverflow: 'ellipsis'\n    },\n\n    optionContent: {\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'center',\n      columnGap: '0.25rem'\n    }\n  })\n}\n","/** biome-ignore-all lint/a11y/useSemanticElements: It's a custom select component */\nimport type React from 'react'\nimport { forwardRef } from 'react'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { OptionItemProps } from './types'\n\n// Styles\nimport { createOptionsStyles } from './styles'\n\ntype NativeButtonProps = Omit<\n  React.ComponentPropsWithoutRef<'button'>,\n  'onClick'\n>\n\nexport const OptionItem = forwardRef<\n  HTMLButtonElement,\n  OptionItemProps & NativeButtonProps\n>((props, ref) => {\n  const { styles, classes } = useThemedStyles(props, createOptionsStyles)\n\n  const { option, isSelected, onClick, ...rest } = props\n\n  return (\n    <button\n      {...rest}\n      ref={ref}\n      type=\"button\"\n      role=\"option\"\n      style={styles.container}\n      className={classes.container}\n      aria-label={option.label}\n      aria-selected={isSelected}\n      onClick={() => onClick(option.value)}\n    >\n      <div style={styles.optionContent}>\n        {option.startIcon}\n        <span style={styles.text}> {option.label}</span>\n      </div>\n    </button>\n  )\n})\n\nOptionItem.displayName = 'OptionItem'\n","// External Libraries\nimport { useCallback, useEffect, useRef, useState } from 'react'\n\nexport type CompositeItemMeta = {\n  disabled?: boolean\n  hasChildren?: boolean\n  onActivate?: () => void\n  onOpenChildren?: () => void\n  onCloseChildren?: () => void\n}\n\ntype Params = {\n  open: boolean\n  itemCount: number\n  autoFocusFirstOption?: boolean\n  initialIndex?: number\n  onCloseByTab?: () => void\n  setOpen: (v: boolean) => void\n  makeMeta: (index: number) => CompositeItemMeta\n}\n\nfunction findNextEnabled(\n  start: number,\n  dir: 1 | -1,\n  count: number,\n  isDisabled: (i: number) => boolean\n) {\n  if (count <= 0) return 0\n  let i = start\n  for (let step = 0; step < count; step++) {\n    i = (i + dir + count) % count\n    if (!isDisabled(i)) return i\n  }\n  return start\n}\n\nfunction findFirstEnabled(count: number, isDisabled: (i: number) => boolean) {\n  for (let i = 0; i < count; i++) if (!isDisabled(i)) return i\n  return 0\n}\n\nexport function useCompositeListNavigation({\n  open,\n  itemCount,\n  autoFocusFirstOption = true,\n  initialIndex,\n  setOpen,\n  makeMeta,\n  onCloseByTab\n}: Params) {\n  const listRef = useRef<HTMLElement | null>(null)\n  const itemRefs = useRef<Array<HTMLButtonElement | null>>([])\n\n  const isDisabled = useCallback(\n    (i: number) => !!makeMeta(i).disabled,\n    [makeMeta]\n  )\n\n  const [activeIndex, setActiveIndex] = useState(0)\n\n  const focusItem = useCallback((i: number) => {\n    const el = itemRefs.current[i]\n    if (!el) return\n    el.focus({ preventScroll: true })\n    el.scrollIntoView({ block: 'nearest' })\n  }, [])\n\n  const openAndFocus = useCallback(\n    (index?: number) => {\n      setOpen(true)\n\n      if (!autoFocusFirstOption) return\n\n      const next =\n        typeof index === 'number'\n          ? index\n          : typeof initialIndex === 'number'\n            ? initialIndex\n            : findFirstEnabled(itemCount, isDisabled)\n\n      setActiveIndex(next)\n      requestAnimationFrame(() => focusItem(next))\n    },\n    [\n      autoFocusFirstOption,\n      focusItem,\n      initialIndex,\n      isDisabled,\n      itemCount,\n      setOpen\n    ]\n  )\n\n  useEffect(() => {\n    if (!open || !autoFocusFirstOption) return\n    requestAnimationFrame(() => focusItem(activeIndex))\n  }, [open, activeIndex, autoFocusFirstOption, focusItem])\n\n  const move = useCallback(\n    (dir: 1 | -1) => {\n      const next = findNextEnabled(activeIndex, dir, itemCount, isDisabled)\n      setActiveIndex(next)\n      requestAnimationFrame(() => focusItem(next))\n    },\n    [activeIndex, itemCount, isDisabled, focusItem]\n  )\n\n  const activate = useCallback(() => {\n    const meta = makeMeta(activeIndex)\n    if (meta.disabled) return\n    meta.onActivate?.()\n  }, [activeIndex, makeMeta])\n\n  const onListKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (!open) return\n\n      switch (e.key) {\n        case 'ArrowDown':\n          e.preventDefault()\n          move(+1)\n          return\n\n        case 'ArrowUp':\n          e.preventDefault()\n          move(-1)\n          return\n\n        case 'Escape':\n          e.preventDefault()\n          setOpen(false)\n          onCloseByTab?.()\n          return\n\n        case 'Home': {\n          e.preventDefault()\n          const first = findFirstEnabled(itemCount, isDisabled)\n          setActiveIndex(first)\n          requestAnimationFrame(() => focusItem(first))\n          return\n        }\n\n        case 'End': {\n          e.preventDefault()\n          let last = itemCount - 1\n          for (let i = itemCount - 1; i >= 0; i--) {\n            if (!isDisabled(i)) {\n              last = i\n              break\n            }\n          }\n          setActiveIndex(last)\n          requestAnimationFrame(() => focusItem(last))\n          return\n        }\n\n        case 'Enter': {\n          e.preventDefault()\n          activate()\n          return\n        }\n\n        case 'ArrowRight': {\n          e.preventDefault()\n          const meta = makeMeta(activeIndex)\n          if (meta.hasChildren) meta.onOpenChildren?.()\n          return\n        }\n\n        case 'ArrowLeft': {\n          e.preventDefault()\n          const meta = makeMeta(activeIndex)\n          meta.onCloseChildren?.()\n          return\n        }\n      }\n    },\n    [\n      open,\n      itemCount,\n      activeIndex,\n      move,\n      activate,\n      makeMeta,\n      focusItem,\n      isDisabled,\n      onCloseByTab,\n      setOpen\n    ]\n  )\n\n  const getTriggerProps = useCallback(() => {\n    return {\n      onKeyDown: (e: React.KeyboardEvent) => {\n        if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {\n          e.preventDefault()\n          if (!open) openAndFocus()\n          return\n        }\n\n        if (e.key === 'ArrowUp') {\n          e.preventDefault()\n          if (!open) openAndFocus(itemCount > 0 ? itemCount - 1 : 0)\n        }\n      }\n    }\n  }, [open, openAndFocus, itemCount])\n\n  const getListProps = useCallback(() => {\n    return {\n      ref: (el: HTMLElement | null) => {\n        listRef.current = el\n      },\n      onKeyDown: onListKeyDown\n    }\n  }, [onListKeyDown])\n\n  const getItemProps = useCallback(\n    (index: number) => {\n      const isActive = index === activeIndex\n      return {\n        ref: (el: HTMLButtonElement | null) => {\n          itemRefs.current[index] = el\n        },\n        tabIndex: isActive ? 0 : -1,\n        'data-active': isActive ? 'true' : 'false'\n      } as const\n    },\n    [activeIndex]\n  )\n\n  return {\n    activeIndex,\n    getListProps,\n    getItemProps,\n    openAndFocus,\n    setActiveIndex,\n    getTriggerProps\n  }\n}\n","// External Libraries\nimport { useEffect, useRef, useState } from 'react'\n\n// Hooks\nimport { useCompositeListNavigation } from '@hooks/useCompositeListNavigation'\n\n// Utils\nimport { normalizeString } from '@utils/functions'\n\n// Types\nimport type { SelectOption, SelectProps } from '../../types'\n\nexport function useSelect({\n  value,\n  options,\n  multiple,\n  disabled,\n  canClear,\n  withSearch,\n  onChange,\n  onSearchChange\n}: SelectProps) {\n  // Refs\n  const timeoutRef = useRef<NodeJS.Timeout>(null)\n\n  // States\n  const [open, setOpen] = useState(false)\n  const [search, setSearch] = useState('')\n  const [availableOptions, setAvailableOptions] = useState<SelectOption[]>([])\n\n  // Hooks\n  const nav = useCompositeListNavigation({\n    open,\n    itemCount: availableOptions.length,\n    autoFocusFirstOption: !withSearch,\n    makeMeta: makeMeta,\n    setOpen: changeOpen\n  })\n\n  useEffect(() => {\n    setAvailableOptions(options ?? [])\n  }, [options])\n\n  // Functions\n  function handleOptionClick(option: string) {\n    const isAlreadySelected = value.includes(option)\n\n    if (!multiple) {\n      if (isAlreadySelected) {\n        if (canClear) onChange([])\n      } else onChange([option])\n\n      setOpen(false)\n      return\n    }\n\n    if (isAlreadySelected) {\n      if (value.length === 1) {\n        if (canClear) onChange([])\n      } else onChange(value.filter(v => v !== option))\n    } else onChange([...value, option])\n  }\n\n  function makeMeta(index: number) {\n    const opt = availableOptions[index]\n\n    return {\n      onActivate: () => {\n        if (opt) handleOptionClick(opt.value)\n      }\n    }\n  }\n\n  function changeOpen(value: boolean) {\n    setOpen(value)\n    setSearch('')\n    setAvailableOptions(options)\n  }\n\n  function togglePanel() {\n    if (disabled) return\n    if (!open) nav.openAndFocus()\n  }\n\n  function closePanel() {\n    setOpen(false)\n  }\n\n  function handleSearchChange(value: string) {\n    setSearch(value)\n    if (onSearchChange) return onSearchChange(value)\n\n    if (timeoutRef.current) clearTimeout(timeoutRef.current)\n\n    if (!search) return setAvailableOptions(options)\n\n    timeoutRef.current = setTimeout(() => {\n      const normalizedSearch = normalizeString(value)\n      const filteredOptions = options.filter(opt =>\n        normalizeString(opt.label).includes(normalizedSearch)\n      )\n\n      setAvailableOptions(filteredOptions)\n    }, 500)\n  }\n\n  return {\n    nav,\n    open,\n    search,\n    availableOptions,\n    makeMeta,\n    changeOpen,\n    togglePanel,\n    closePanel,\n    handleOptionClick,\n    handleSearchChange\n  }\n}\n","import { styled } from '@hooks/useThemedStyles/types'\nimport type { SelectProps } from './types'\n\nexport function createSelectStyles(props: SelectProps) {\n  return styled({\n    container: {\n      width: '100%',\n\n      display: 'flex',\n      flexDirection: 'column',\n      position: 'relative',\n\n      rowGap: '0.375rem'\n    },\n\n    content: {\n      width: '100%',\n      height: '2.75rem',\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n\n      borderWidth: 1,\n      columnGap: '0.25rem',\n      borderRadius: '0.5rem',\n      padding: '0.625rem 0.875rem',\n\n      opacity: props.disabled || props.isLoading ? 0.5 : 1,\n      cursor: props.isLoading\n        ? 'progress'\n        : props.disabled\n          ? 'not-allowed'\n          : 'pointer',\n      boxShadow: 'var(--px-shadow-default)',\n      borderColor: props.errorMessage\n        ? 'var(--px-color-error)'\n        : 'var(--px-border-primary)',\n\n      __rules: {\n        '&:focus-within': {\n          outlineOffset: '-1px !important',\n          outline: `2px solid var(${props.errorMessage ? '--px-color-error' : '--px-color-primary'}) !important`\n        }\n      }\n    },\n\n    text: {\n      flex: 1,\n\n      textAlign: 'left',\n\n      overflow: 'hidden',\n      whiteSpace: 'nowrap',\n      textOverflow: 'ellipsis',\n\n      fontSize: '1rem',\n      lineHeight: '1.5rem',\n      fontFamily: 'inherit',\n      fontWeight: props.value.length ? 500 : 400,\n      color: props.value.length\n        ? 'var(--px-text-primary)'\n        : 'var(--px-text-secondary)'\n    },\n\n    panel: { width: '100%' },\n\n    contentValueImage: {\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'center',\n      columnGap: '0.25rem'\n    },\n\n    iconContainer: {\n      display: 'flex',\n      justifyContent: 'center',\n      alignItems: 'center',\n      maxWidth: '1rem'\n    }\n  })\n}\n","import type {\n  TextProps,\n  LayoutProps,\n  MarginProps,\n  TypeStyles\n} from '@hooks/useThemedStyles/types'\nimport type { createSelectStyles } from './styles'\nimport type { FloatingOptions } from '@hooks/useFloating/types'\nimport type { PopoverProps } from '@components/commons/toolkit/Popover/types'\nimport type { Pagination } from '@components/commons/toolkit/ScrollPaginationContainer/types'\n\nexport interface SelectProps extends LayoutProps, MarginProps {\n  label: string\n  value: string[]\n  placeholder?: string\n  options: SelectOption[]\n  isLoading?: boolean\n\n  portalId?: PopoverProps['portalId']\n  strategy?: FloatingOptions['strategy']\n  placement?: FloatingOptions['placement']\n  scrollContainerId?: FloatingOptions['scrollContainerId']\n  absoluteReference?: FloatingOptions['absoluteReference']\n\n  canClear?: boolean\n  multiple?: boolean\n  required?: boolean\n  disabled?: boolean\n  hideLabel?: boolean\n  withSearch?: boolean\n  autoFocusFirstOption?: boolean\n  errorMessage?: string\n  maxVisibleItems?: number\n  maxHeightPopover?: string\n  searchPlaceholder?: string\n\n  pagination?: Pagination\n\n  startIcon?: React.ReactNode\n  styles?: TypeStyles<typeof createSelectStyles>\n\n  requiredColor?: string\n  labelConfig?: TextProps\n\n  onChange: (value: string[]) => void\n  onSearchChange?: (value: string) => void\n}\n\nexport interface SelectOption {\n  label: string\n  value: string\n  startIcon?: React.ReactNode\n}\n","/** biome-ignore-all lint/a11y/useSemanticElements: It's a custom select component */\n// External Libraries\nimport type React from 'react'\nimport { useMemo } from 'react'\n\n// Components\nimport { Input } from '../Input'\nimport { OptionItem } from './components/OptionItem'\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { Label } from '@components/commons/toolkit/Label'\nimport { ErrorMessage } from '../../toolkit/ErrorMessage'\nimport { Loader } from '@components/commons/toolkit/Loader'\nimport { Typography } from '@components/commons/toolkit/Typography'\nimport { BasePopover } from '@components/commons/structure/BasePopover'\nimport { ScrollPaginationContainer } from '@components/commons/toolkit/ScrollPaginationContainer'\n\n// Hooks\nimport { useSelect } from './hooks/useSelect'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SelectProps } from './types'\nimport type { PopoverTriggerRenderProps } from '@components/commons/toolkit/Popover/types'\nimport { ScrollDirection } from '@components/commons/toolkit/ScrollPaginationContainer/types'\n\n// Styles\nimport { createSelectStyles } from './styles'\n\nexport * as SelectTypes from './types'\n\nexport const Select: React.FC<SelectProps> = props => {\n  const {\n    nav,\n    open,\n    search,\n    availableOptions,\n    changeOpen,\n    handleOptionClick,\n    handleSearchChange\n  } = useSelect(props)\n  const { styles, classes } = useThemedStyles(props, createSelectStyles, {\n    pick: p => [p.disabled, p.errorMessage, p.value, p.isLoading],\n    override: props.styles,\n    applyCommonProps: true,\n    commonSlot: 'container'\n  })\n\n  const maxVisible = props.maxVisibleItems ?? Infinity\n  const optionsMap = useMemo(\n    () =>\n      new Map(\n        props.options.map(option => [\n          option.value,\n          { label: option.label, startIcon: option.startIcon }\n        ])\n      ),\n    [props.options]\n  )\n\n  // Functions\n  function renderContent() {\n    if (!props.value?.length) return props.placeholder\n\n    const resolvedValues = props.value.map(\n      val => optionsMap.get(val) ?? { label: val, startIcon: null }\n    )\n    const visibleItems = resolvedValues.slice(0, maxVisible)\n    const hiddenCount = resolvedValues.length - visibleItems.length\n\n    let result: React.ReactNode[] | string = []\n\n    if (props.multiple) {\n      result = visibleItems.map(i => i.label).join(', ')\n    } else {\n      result = visibleItems.map(i => (\n        <span key={i.label} style={styles.contentValueImage}>\n          {i.startIcon ? i.startIcon : null}\n          <span style={styles.text}>{i.label}</span>\n        </span>\n      ))\n    }\n\n    if (typeof result === 'object' && hiddenCount > 0)\n      result.push(<span key=\"hidden-count\">{hiddenCount}</span>)\n\n    if (typeof result === 'string' && hiddenCount > 0)\n      result = `${result} ${hiddenCount}`\n\n    return result\n  }\n\n  function renderTrigger({\n    ref,\n    ariaExpanded,\n    onClick\n  }: PopoverTriggerRenderProps) {\n    const triggerKeyProps = nav.getTriggerProps()\n\n    return (\n      <button\n        ref={ref as React.RefObject<HTMLButtonElement>}\n        dir=\"ltr\"\n        type=\"button\"\n        role=\"combobox\"\n        style={styles.content}\n        aria-autocomplete=\"none\"\n        aria-label={props.label}\n        className={classes.content}\n        aria-expanded={ariaExpanded}\n        disabled={props.disabled || props.isLoading}\n        {...triggerKeyProps}\n        onClick={onClick}\n      >\n        {props.value.length ? props.startIcon : null}\n\n        <span id=\"text-content\" style={styles.text}>\n          {renderContent()}\n        </span>\n\n        {props.isLoading ? (\n          <Loader size=\"1rem\" color=\"var(--px-color-primary)\" />\n        ) : (\n          <div style={styles.iconContainer}>\n            <Icon size=\"sm\" name=\"chevrons-down\" />\n          </div>\n        )}\n      </button>\n    )\n  }\n\n  function renderOptions() {\n    if (availableOptions.length === 0) {\n      return (\n        <Typography variant=\"b2\" textAlign=\"center\">\n          No options\n        </Typography>\n      )\n    }\n\n    return availableOptions.map((option, idx) => (\n      <OptionItem\n        key={option.value}\n        option={option}\n        onClick={handleOptionClick}\n        isSelected={props.value.includes(option.value)}\n        {...nav.getItemProps(idx)}\n      />\n    ))\n  }\n\n  return (\n    <div style={styles.container}>\n      {props.hideLabel ? null : (\n        <Label\n          label={props.label}\n          required={props.required}\n          requiredColor={props.requiredColor}\n          {...props.labelConfig}\n        />\n      )}\n\n      <BasePopover\n        open={open}\n        portalId={props.portalId}\n        absoluteReference={props.absoluteReference}\n        maxHeight={props.maxHeightPopover}\n        floatingOptions={{\n          viewportMargin: 0,\n          strategy: props.strategy,\n          placement: props.placement,\n          scrollContainerId: props.scrollContainerId\n        }}\n        trigger={renderTrigger}\n        onOpenChange={changeOpen}\n      >\n        <ScrollPaginationContainer\n          fillFlex\n          direction={ScrollDirection.Vertical}\n          verticalPagination={props.pagination}\n        >\n          <div style={styles.panel} role=\"listbox\" {...nav.getListProps()}>\n            {props.withSearch ? (\n              <Input\n                hideLabel\n                autoFocus\n                mb=\"0.5rem\"\n                value={search}\n                label=\"Search\"\n                placeholder={props.searchPlaceholder ?? 'Pesquisar...'}\n                onChange={handleSearchChange}\n              />\n            ) : null}\n\n            {renderOptions()}\n          </div>\n        </ScrollPaginationContainer>\n      </BasePopover>\n\n      {props.errorMessage ? (\n        <ErrorMessage message={props.errorMessage} />\n      ) : null}\n    </div>\n  )\n}\n"],"mappings":"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"}
+{"version":3,"file":"Select-C8JCFwDy.js","names":["value","Select: React.FC<SelectProps>","result: React.ReactNode[] | string"],"sources":["../src/utils/functions/normalizeString.ts","../src/components/commons/inputs/Select/components/OptionItem/styles.ts","../src/components/commons/inputs/Select/components/OptionItem/index.tsx","../src/hooks/useCompositeListNavigation/index.ts","../src/components/commons/inputs/Select/hooks/useSelect/index.ts","../src/components/commons/inputs/Select/styles.ts","../src/components/commons/inputs/Select/types.ts","../src/components/commons/inputs/Select/index.tsx"],"sourcesContent":["export function normalizeString(value: string) {\n  if (!value || typeof value !== 'string') return ''\n\n  return value\n    .normalize('NFD')\n    .replace(/[\\u0300-\\u036f]/g, '')\n    .toUpperCase()\n    .trim()\n}\n","import type { OptionItemProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createOptionsStyles(\n  props: OptionItemProps & { ['data-active']?: string }\n) {\n  const { isSelected } = props\n  const isActive = props['data-active'] === 'true'\n  const highlighted = isSelected || isActive\n\n  return styled({\n    container: {\n      width: '100%',\n\n      display: 'flex',\n      alignItems: 'center',\n      textAlign: 'left',\n\n      borderRadius: '0.25rem',\n      padding: '0.5rem 0.75rem',\n\n      cursor: 'pointer',\n      transition: 'background-color 0.2s ease-out',\n\n      backgroundColor: highlighted\n        ? 'var(--px-background-card-hover)'\n        : 'transparent',\n\n      __rules: {\n        '&:hover': {\n          backgroundColor: 'var(--px-background-card-hover) !important'\n        },\n\n        '&:focus': {\n          outlineOffset: '-2px',\n          outline: '2px solid var(--px-color-primary)'\n        }\n      }\n    },\n\n    text: {\n      flex: 1,\n\n      fontSize: '1rem',\n      fontWeight: 500,\n      lineHeight: '1.5rem',\n      fontFamily: 'inherit',\n      color: 'var(--px-text-primary)',\n\n      overflow: 'hidden',\n      whiteSpace: 'nowrap',\n      textOverflow: 'ellipsis'\n    },\n\n    optionContent: {\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'center',\n      columnGap: '0.25rem'\n    }\n  })\n}\n","/** biome-ignore-all lint/a11y/useSemanticElements: It's a custom select component */\nimport type React from 'react'\nimport { forwardRef } from 'react'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { OptionItemProps } from './types'\n\n// Styles\nimport { createOptionsStyles } from './styles'\n\ntype NativeButtonProps = Omit<\n  React.ComponentPropsWithoutRef<'button'>,\n  'onClick'\n>\n\nexport const OptionItem = forwardRef<\n  HTMLButtonElement,\n  OptionItemProps & NativeButtonProps\n>((props, ref) => {\n  const { styles, classes } = useThemedStyles(props, createOptionsStyles)\n\n  const { option, isSelected, onClick, ...rest } = props\n\n  return (\n    <button\n      {...rest}\n      ref={ref}\n      type=\"button\"\n      role=\"option\"\n      style={styles.container}\n      className={classes.container}\n      aria-label={option.label}\n      aria-selected={isSelected}\n      onClick={() => onClick(option.value)}\n    >\n      <div style={styles.optionContent}>\n        {option.startIcon}\n        <span style={styles.text}> {option.label}</span>\n      </div>\n    </button>\n  )\n})\n\nOptionItem.displayName = 'OptionItem'\n","// External Libraries\nimport { useCallback, useEffect, useRef, useState } from 'react'\n\nexport type CompositeItemMeta = {\n  disabled?: boolean\n  hasChildren?: boolean\n  onActivate?: () => void\n  onOpenChildren?: () => void\n  onCloseChildren?: () => void\n}\n\ntype Params = {\n  open: boolean\n  itemCount: number\n  autoFocusFirstOption?: boolean\n  initialIndex?: number\n  onCloseByTab?: () => void\n  setOpen: (v: boolean) => void\n  makeMeta: (index: number) => CompositeItemMeta\n}\n\nfunction findNextEnabled(\n  start: number,\n  dir: 1 | -1,\n  count: number,\n  isDisabled: (i: number) => boolean\n) {\n  if (count <= 0) return 0\n  let i = start\n  for (let step = 0; step < count; step++) {\n    i = (i + dir + count) % count\n    if (!isDisabled(i)) return i\n  }\n  return start\n}\n\nfunction findFirstEnabled(count: number, isDisabled: (i: number) => boolean) {\n  for (let i = 0; i < count; i++) if (!isDisabled(i)) return i\n  return 0\n}\n\nexport function useCompositeListNavigation({\n  open,\n  itemCount,\n  autoFocusFirstOption = true,\n  initialIndex,\n  setOpen,\n  makeMeta,\n  onCloseByTab\n}: Params) {\n  const listRef = useRef<HTMLElement | null>(null)\n  const itemRefs = useRef<Array<HTMLButtonElement | null>>([])\n\n  const isDisabled = useCallback(\n    (i: number) => !!makeMeta(i).disabled,\n    [makeMeta]\n  )\n\n  const [activeIndex, setActiveIndex] = useState(0)\n\n  const focusItem = useCallback((i: number) => {\n    const el = itemRefs.current[i]\n    if (!el) return\n    el.focus({ preventScroll: true })\n    el.scrollIntoView({ block: 'nearest' })\n  }, [])\n\n  const openAndFocus = useCallback(\n    (index?: number) => {\n      setOpen(true)\n\n      if (!autoFocusFirstOption) return\n\n      const next =\n        typeof index === 'number'\n          ? index\n          : typeof initialIndex === 'number'\n            ? initialIndex\n            : findFirstEnabled(itemCount, isDisabled)\n\n      setActiveIndex(next)\n      requestAnimationFrame(() => focusItem(next))\n    },\n    [\n      autoFocusFirstOption,\n      focusItem,\n      initialIndex,\n      isDisabled,\n      itemCount,\n      setOpen\n    ]\n  )\n\n  useEffect(() => {\n    if (!open || !autoFocusFirstOption) return\n    requestAnimationFrame(() => focusItem(activeIndex))\n  }, [open, activeIndex, autoFocusFirstOption, focusItem])\n\n  const move = useCallback(\n    (dir: 1 | -1) => {\n      const next = findNextEnabled(activeIndex, dir, itemCount, isDisabled)\n      setActiveIndex(next)\n      requestAnimationFrame(() => focusItem(next))\n    },\n    [activeIndex, itemCount, isDisabled, focusItem]\n  )\n\n  const activate = useCallback(() => {\n    const meta = makeMeta(activeIndex)\n    if (meta.disabled) return\n    meta.onActivate?.()\n  }, [activeIndex, makeMeta])\n\n  const onListKeyDown = useCallback(\n    (e: React.KeyboardEvent) => {\n      if (!open) return\n\n      switch (e.key) {\n        case 'ArrowDown':\n          e.preventDefault()\n          move(+1)\n          return\n\n        case 'ArrowUp':\n          e.preventDefault()\n          move(-1)\n          return\n\n        case 'Escape':\n          e.preventDefault()\n          setOpen(false)\n          onCloseByTab?.()\n          return\n\n        case 'Home': {\n          e.preventDefault()\n          const first = findFirstEnabled(itemCount, isDisabled)\n          setActiveIndex(first)\n          requestAnimationFrame(() => focusItem(first))\n          return\n        }\n\n        case 'End': {\n          e.preventDefault()\n          let last = itemCount - 1\n          for (let i = itemCount - 1; i >= 0; i--) {\n            if (!isDisabled(i)) {\n              last = i\n              break\n            }\n          }\n          setActiveIndex(last)\n          requestAnimationFrame(() => focusItem(last))\n          return\n        }\n\n        case 'Enter': {\n          e.preventDefault()\n          activate()\n          return\n        }\n\n        case 'ArrowRight': {\n          e.preventDefault()\n          const meta = makeMeta(activeIndex)\n          if (meta.hasChildren) meta.onOpenChildren?.()\n          return\n        }\n\n        case 'ArrowLeft': {\n          e.preventDefault()\n          const meta = makeMeta(activeIndex)\n          meta.onCloseChildren?.()\n          return\n        }\n      }\n    },\n    [\n      open,\n      itemCount,\n      activeIndex,\n      move,\n      activate,\n      makeMeta,\n      focusItem,\n      isDisabled,\n      onCloseByTab,\n      setOpen\n    ]\n  )\n\n  const getTriggerProps = useCallback(() => {\n    return {\n      onKeyDown: (e: React.KeyboardEvent) => {\n        if (e.key === 'Enter' || e.key === ' ' || e.key === 'ArrowDown') {\n          e.preventDefault()\n          if (!open) openAndFocus()\n          return\n        }\n\n        if (e.key === 'ArrowUp') {\n          e.preventDefault()\n          if (!open) openAndFocus(itemCount > 0 ? itemCount - 1 : 0)\n        }\n      }\n    }\n  }, [open, openAndFocus, itemCount])\n\n  const getListProps = useCallback(() => {\n    return {\n      ref: (el: HTMLElement | null) => {\n        listRef.current = el\n      },\n      onKeyDown: onListKeyDown\n    }\n  }, [onListKeyDown])\n\n  const getItemProps = useCallback(\n    (index: number) => {\n      const isActive = index === activeIndex\n      return {\n        ref: (el: HTMLButtonElement | null) => {\n          itemRefs.current[index] = el\n        },\n        tabIndex: isActive ? 0 : -1,\n        'data-active': isActive ? 'true' : 'false'\n      } as const\n    },\n    [activeIndex]\n  )\n\n  return {\n    activeIndex,\n    getListProps,\n    getItemProps,\n    openAndFocus,\n    setActiveIndex,\n    getTriggerProps\n  }\n}\n","// External Libraries\nimport { useEffect, useRef, useState } from 'react'\n\n// Hooks\nimport { useCompositeListNavigation } from '@hooks/useCompositeListNavigation'\n\n// Utils\nimport { normalizeString } from '@utils/functions'\n\n// Types\nimport type { SelectOption, SelectProps } from '../../types'\n\nexport function useSelect({\n  value,\n  options,\n  multiple,\n  disabled,\n  canClear,\n  withSearch,\n  onChange,\n  onSearchChange\n}: SelectProps) {\n  // Refs\n  const timeoutRef = useRef<NodeJS.Timeout>(null)\n\n  // States\n  const [open, setOpen] = useState(false)\n  const [search, setSearch] = useState('')\n  const [availableOptions, setAvailableOptions] = useState<SelectOption[]>([])\n\n  // Hooks\n  const nav = useCompositeListNavigation({\n    open,\n    itemCount: availableOptions.length,\n    autoFocusFirstOption: !withSearch,\n    makeMeta: makeMeta,\n    setOpen: changeOpen\n  })\n\n  useEffect(() => {\n    setAvailableOptions(options ?? [])\n  }, [options])\n\n  // Functions\n  function handleOptionClick(option: string) {\n    const isAlreadySelected = value.includes(option)\n\n    if (!multiple) {\n      if (isAlreadySelected) {\n        if (canClear) onChange([])\n      } else onChange([option])\n\n      setOpen(false)\n      return\n    }\n\n    if (isAlreadySelected) {\n      if (value.length === 1) {\n        if (canClear) onChange([])\n      } else onChange(value.filter(v => v !== option))\n    } else onChange([...value, option])\n  }\n\n  function makeMeta(index: number) {\n    const opt = availableOptions[index]\n\n    return {\n      onActivate: () => {\n        if (opt) handleOptionClick(opt.value)\n      }\n    }\n  }\n\n  function changeOpen(value: boolean) {\n    setOpen(value)\n    setSearch('')\n    setAvailableOptions(options)\n  }\n\n  function togglePanel() {\n    if (disabled) return\n    if (!open) nav.openAndFocus()\n  }\n\n  function closePanel() {\n    setOpen(false)\n  }\n\n  function handleSearchChange(value: string) {\n    setSearch(value)\n    if (onSearchChange) return onSearchChange(value)\n\n    if (timeoutRef.current) clearTimeout(timeoutRef.current)\n\n    if (!search) return setAvailableOptions(options)\n\n    timeoutRef.current = setTimeout(() => {\n      const normalizedSearch = normalizeString(value)\n      const filteredOptions = options.filter(opt =>\n        normalizeString(opt.label).includes(normalizedSearch)\n      )\n\n      setAvailableOptions(filteredOptions)\n    }, 500)\n  }\n\n  return {\n    nav,\n    open,\n    search,\n    availableOptions,\n    makeMeta,\n    changeOpen,\n    togglePanel,\n    closePanel,\n    handleOptionClick,\n    handleSearchChange\n  }\n}\n","import { styled } from '@hooks/useThemedStyles/types'\nimport type { SelectProps } from './types'\n\nexport function createSelectStyles(props: SelectProps) {\n  return styled({\n    container: {\n      width: '100%',\n\n      display: 'flex',\n      flexDirection: 'column',\n      position: 'relative',\n\n      rowGap: '0.375rem'\n    },\n\n    content: {\n      width: '100%',\n      height: '2.75rem',\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n\n      borderWidth: 1,\n      columnGap: '0.25rem',\n      borderRadius: '0.5rem',\n      padding: '0.625rem 0.875rem',\n\n      opacity: props.disabled || props.isLoading ? 0.5 : 1,\n      cursor: props.isLoading\n        ? 'progress'\n        : props.disabled\n          ? 'not-allowed'\n          : 'pointer',\n      boxShadow: 'var(--px-shadow-default)',\n      borderColor: props.errorMessage\n        ? 'var(--px-color-error)'\n        : 'var(--px-border-primary)',\n\n      __rules: {\n        '&:focus-within': {\n          outlineOffset: '-1px !important',\n          outline: `2px solid var(${props.errorMessage ? '--px-color-error' : '--px-color-primary'}) !important`\n        }\n      }\n    },\n\n    text: {\n      flex: 1,\n\n      textAlign: 'left',\n\n      overflow: 'hidden',\n      whiteSpace: 'nowrap',\n      textOverflow: 'ellipsis',\n\n      fontSize: '1rem',\n      lineHeight: '1.5rem',\n      fontFamily: 'inherit',\n      fontWeight: props.value.length ? 500 : 400,\n      color: props.value.length\n        ? 'var(--px-text-primary)'\n        : 'var(--px-text-secondary)'\n    },\n\n    panel: { width: '100%' },\n\n    contentValueImage: {\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'center',\n      columnGap: '0.25rem'\n    },\n\n    iconContainer: {\n      display: 'flex',\n      justifyContent: 'center',\n      alignItems: 'center',\n      maxWidth: '1rem'\n    }\n  })\n}\n","import type {\n  TextProps,\n  LayoutProps,\n  MarginProps,\n  TypeStyles\n} from '@hooks/useThemedStyles/types'\nimport type { createSelectStyles } from './styles'\nimport type { FloatingOptions } from '@hooks/useFloating/types'\nimport type { PopoverProps } from '@components/commons/toolkit/Popover/types'\nimport type { Pagination } from '@components/commons/toolkit/ScrollPaginationContainer/types'\n\nexport interface SelectProps extends LayoutProps, MarginProps {\n  label: string\n  value: string[]\n  placeholder?: string\n  options: SelectOption[]\n  isLoading?: boolean\n\n  portalId?: PopoverProps['portalId']\n  strategy?: FloatingOptions['strategy']\n  placement?: FloatingOptions['placement']\n  scrollContainerId?: FloatingOptions['scrollContainerId']\n  absoluteReference?: FloatingOptions['absoluteReference']\n\n  canClear?: boolean\n  multiple?: boolean\n  required?: boolean\n  disabled?: boolean\n  hideLabel?: boolean\n  withSearch?: boolean\n  autoFocusFirstOption?: boolean\n  errorMessage?: string\n  maxVisibleItems?: number\n  maxHeightPopover?: string\n  searchPlaceholder?: string\n\n  pagination?: Pagination\n\n  startIcon?: React.ReactNode\n  styles?: TypeStyles<typeof createSelectStyles>\n\n  requiredColor?: string\n  labelConfig?: TextProps\n\n  onChange: (value: string[]) => void\n  onSearchChange?: (value: string) => void\n}\n\nexport interface SelectOption {\n  label: string\n  value: string\n  startIcon?: React.ReactNode\n}\n","/** biome-ignore-all lint/a11y/useSemanticElements: It's a custom select component */\n// External Libraries\nimport type React from 'react'\nimport { useMemo } from 'react'\n\n// Components\nimport { Input } from '../Input'\nimport { OptionItem } from './components/OptionItem'\nimport { Icon } from '@components/commons/toolkit/Icon'\nimport { Label } from '@components/commons/toolkit/Label'\nimport { ErrorMessage } from '../../toolkit/ErrorMessage'\nimport { Loader } from '@components/commons/toolkit/Loader'\nimport { Typography } from '@components/commons/toolkit/Typography'\nimport { BasePopover } from '@components/commons/structure/BasePopover'\nimport { ScrollPaginationContainer } from '@components/commons/toolkit/ScrollPaginationContainer'\n\n// Hooks\nimport { useSelect } from './hooks/useSelect'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SelectProps } from './types'\nimport type { PopoverTriggerRenderProps } from '@components/commons/toolkit/Popover/types'\nimport { ScrollDirection } from '@components/commons/toolkit/ScrollPaginationContainer/types'\n\n// Styles\nimport { createSelectStyles } from './styles'\n\nexport * as SelectTypes from './types'\n\nexport const Select: React.FC<SelectProps> = props => {\n  const {\n    nav,\n    open,\n    search,\n    availableOptions,\n    changeOpen,\n    handleOptionClick,\n    handleSearchChange\n  } = useSelect(props)\n  const { styles, classes } = useThemedStyles(props, createSelectStyles, {\n    pick: p => [p.disabled, p.errorMessage, p.value, p.isLoading],\n    override: props.styles,\n    applyCommonProps: true,\n    commonSlot: 'container'\n  })\n\n  const maxVisible = props.maxVisibleItems ?? Infinity\n  const optionsMap = useMemo(\n    () =>\n      new Map(\n        props.options.map(option => [\n          option.value,\n          { label: option.label, startIcon: option.startIcon }\n        ])\n      ),\n    [props.options]\n  )\n\n  // Functions\n  function renderContent() {\n    if (!props.value?.length) return props.placeholder\n\n    const resolvedValues = props.value.map(\n      val => optionsMap.get(val) ?? { label: val, startIcon: null }\n    )\n    const visibleItems = resolvedValues.slice(0, maxVisible)\n    const hiddenCount = resolvedValues.length - visibleItems.length\n\n    let result: React.ReactNode[] | string = []\n\n    if (props.multiple) {\n      result = visibleItems.map(i => i.label).join(', ')\n    } else {\n      result = visibleItems.map(i => (\n        <span key={i.label} style={styles.contentValueImage}>\n          {i.startIcon ? i.startIcon : null}\n          <span style={styles.text}>{i.label}</span>\n        </span>\n      ))\n    }\n\n    if (typeof result === 'object' && hiddenCount > 0)\n      result.push(<span key=\"hidden-count\">{hiddenCount}</span>)\n\n    if (typeof result === 'string' && hiddenCount > 0)\n      result = `${result} ${hiddenCount}`\n\n    return result\n  }\n\n  function renderTrigger({\n    ref,\n    ariaExpanded,\n    onClick\n  }: PopoverTriggerRenderProps) {\n    const triggerKeyProps = nav.getTriggerProps()\n\n    return (\n      <button\n        ref={ref as React.RefObject<HTMLButtonElement>}\n        dir=\"ltr\"\n        type=\"button\"\n        role=\"combobox\"\n        style={styles.content}\n        aria-autocomplete=\"none\"\n        aria-label={props.label}\n        className={classes.content}\n        aria-expanded={ariaExpanded}\n        disabled={props.disabled || props.isLoading}\n        {...triggerKeyProps}\n        onClick={onClick}\n      >\n        {props.value.length ? props.startIcon : null}\n\n        <span id=\"text-content\" style={styles.text}>\n          {renderContent()}\n        </span>\n\n        {props.isLoading ? (\n          <Loader size=\"1rem\" color=\"var(--px-color-primary)\" />\n        ) : (\n          <div style={styles.iconContainer}>\n            <Icon size=\"sm\" name=\"chevrons-down\" />\n          </div>\n        )}\n      </button>\n    )\n  }\n\n  function renderOptions() {\n    if (availableOptions.length === 0) {\n      return (\n        <Typography variant=\"b2\" textAlign=\"center\">\n          No options\n        </Typography>\n      )\n    }\n\n    return availableOptions.map((option, idx) => (\n      <OptionItem\n        key={option.value}\n        option={option}\n        onClick={handleOptionClick}\n        isSelected={props.value.includes(option.value)}\n        {...nav.getItemProps(idx)}\n      />\n    ))\n  }\n\n  return (\n    <div style={styles.container}>\n      {props.hideLabel ? null : (\n        <Label\n          label={props.label}\n          required={props.required}\n          requiredColor={props.requiredColor}\n          {...props.labelConfig}\n        />\n      )}\n\n      <BasePopover\n        open={open}\n        portalId={props.portalId}\n        absoluteReference={props.absoluteReference}\n        maxHeight={props.maxHeightPopover}\n        floatingOptions={{\n          viewportMargin: 0,\n          strategy: props.strategy,\n          placement: props.placement,\n          scrollContainerId: props.scrollContainerId\n        }}\n        trigger={renderTrigger}\n        onOpenChange={changeOpen}\n      >\n        <ScrollPaginationContainer\n          fillFlex\n          direction={ScrollDirection.Vertical}\n          verticalPagination={props.pagination}\n        >\n          <div style={styles.panel} role=\"listbox\" {...nav.getListProps()}>\n            {props.withSearch ? (\n              <Input\n                hideLabel\n                autoFocus\n                mb=\"0.5rem\"\n                value={search}\n                label=\"Search\"\n                placeholder={props.searchPlaceholder ?? 'Pesquisar...'}\n                onChange={handleSearchChange}\n              />\n            ) : null}\n\n            {renderOptions()}\n          </div>\n        </ScrollPaginationContainer>\n      </BasePopover>\n\n      {props.errorMessage ? (\n        <ErrorMessage message={props.errorMessage} />\n      ) : null}\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/{Switch-DlZXMyGG.js → Switch-D3Eitmnj.js}

@@ -1,5 +1,5 @@
 import { n as styled, t as useThemedStyles } from "./useThemedStyles-Dco_54KA.js";
-import { t as Typography } from "./Typography-u0BPHgCr.js";
+import { t as Typography } from "./Typography-CcQTHV-F.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 
 //#region src/components/commons/toolkit/Switch/styles.ts
@@ -68,4 +68,4 @@ const Switch = (props) => {
 
 //#endregion
 export { Switch as t };
-//# sourceMappingURL=Switch-DlZXMyGG.js.map
+//# sourceMappingURL=Switch-D3Eitmnj.js.map

package/dist/{Switch-DlZXMyGG.js.map → Switch-D3Eitmnj.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Switch-DlZXMyGG.js","names":["Switch: React.FC<SwitchThumbProps>"],"sources":["../src/components/commons/toolkit/Switch/styles.ts","../src/components/commons/toolkit/Switch/index.tsx"],"sourcesContent":["// Types\nimport type { SwitchThumbProps } from './types'\n\n// Styles\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createSwitchThumbStyles({\n  checked,\n  fitContent,\n  colorActive,\n  colorInactive,\n  colorIndicator\n}: SwitchThumbProps) {\n  return styled({\n    wrapper: {\n      width: fitContent ? 'fit-content' : '100%',\n\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n\n      columnGap: '0.5rem'\n    },\n    container: {\n      width: '2.5rem',\n      height: '1.5rem',\n\n      position: 'relative',\n\n      display: 'inline-flex',\n      alignItems: 'center',\n      marginLeft: '0.5rem',\n\n      borderRadius: '2rem',\n      padding: '0.125rem',\n\n      transition: 'background-color 0.5s',\n      backgroundColor: checked\n        ? (colorActive ?? 'var(--px-color-success)')\n        : (colorInactive ?? 'var(--px-color-disabled)')\n    },\n\n    indicator: {\n      height: '1.25rem',\n      width: '1.25rem',\n\n      position: 'absolute',\n      left: '0.125rem',\n      top: '0.125rem',\n\n      borderRadius: '9999px',\n      backgroundColor: colorIndicator ?? 'var(--px-surface)',\n\n      transition: 'transform 0.5s',\n      transform: checked ? 'translateX(1rem)' : 'translateX(0)',\n      willChange: 'transform'\n    }\n  })\n}\n","// External Libraries\n/** biome-ignore-all lint/a11y/noStaticElementInteractions: Not Needed */\n/** biome-ignore-all lint/a11y/useKeyWithClickEvents: Not Needed */\nimport type React from 'react'\nimport type { MouseEvent } from 'react'\n\n// Components\nimport { Typography } from '../Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SwitchThumbProps } from './types'\n\n// Styles\nimport { createSwitchThumbStyles } from './styles'\n\nexport const Switch: React.FC<SwitchThumbProps> = props => {\n  const { label, checked, onChange } = props\n\n  // Hooks\n  const { styles } = useThemedStyles(props, createSwitchThumbStyles, {\n    applyCommonProps: true,\n    pick: p => [p.checked]\n  })\n\n  // Functions\n  function handleChange(e: MouseEvent<HTMLSpanElement>) {\n    e.stopPropagation()\n    e.preventDefault()\n\n    onChange?.(!checked)\n  }\n\n  return (\n    <div style={styles.wrapper}>\n      {label ? (\n        <Typography variant=\"b2\" color=\"var(px-text-primary)\">\n          {label}\n        </Typography>\n      ) : null}\n\n      <span style={styles.container} onClick={handleChange}>\n        <span style={styles.indicator} />\n      </span>\n    </div>\n  )\n}\n"],"mappings":";;;;;AAMA,SAAgB,wBAAwB,EACtC,SACA,YACA,aACA,eACA,kBACmB;AACnB,QAAO,OAAO;EACZ,SAAS;GACP,OAAO,aAAa,gBAAgB;GAEpC,SAAS;GACT,YAAY;GACZ,gBAAgB;GAEhB,WAAW;GACZ;EACD,WAAW;GACT,OAAO;GACP,QAAQ;GAER,UAAU;GAEV,SAAS;GACT,YAAY;GACZ,YAAY;GAEZ,cAAc;GACd,SAAS;GAET,YAAY;GACZ,iBAAiB,UACZ,eAAe,4BACf,iBAAiB;GACvB;EAED,WAAW;GACT,QAAQ;GACR,OAAO;GAEP,UAAU;GACV,MAAM;GACN,KAAK;GAEL,cAAc;GACd,iBAAiB,kBAAkB;GAEnC,YAAY;GACZ,WAAW,UAAU,qBAAqB;GAC1C,YAAY;GACb;EACF,CAAC;;;;;ACvCJ,MAAaA,UAAqC,UAAS;CACzD,MAAM,EAAE,OAAO,SAAS,aAAa;CAGrC,MAAM,EAAE,WAAW,gBAAgB,OAAO,yBAAyB;EACjE,kBAAkB;EAClB,OAAM,MAAK,CAAC,EAAE,QAAQ;EACvB,CAAC;CAGF,SAAS,aAAa,GAAgC;AACpD,IAAE,iBAAiB;AACnB,IAAE,gBAAgB;AAElB,aAAW,CAAC,QAAQ;;AAGtB,QACE,qBAAC;EAAI,OAAO,OAAO;aAChB,QACC,oBAAC;GAAW,SAAQ;GAAK,OAAM;aAC5B;IACU,GACX,MAEJ,oBAAC;GAAK,OAAO,OAAO;GAAW,SAAS;aACtC,oBAAC,UAAK,OAAO,OAAO,YAAa;IAC5B;GACH"}
+{"version":3,"file":"Switch-D3Eitmnj.js","names":["Switch: React.FC<SwitchThumbProps>"],"sources":["../src/components/commons/toolkit/Switch/styles.ts","../src/components/commons/toolkit/Switch/index.tsx"],"sourcesContent":["// Types\nimport type { SwitchThumbProps } from './types'\n\n// Styles\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createSwitchThumbStyles({\n  checked,\n  fitContent,\n  colorActive,\n  colorInactive,\n  colorIndicator\n}: SwitchThumbProps) {\n  return styled({\n    wrapper: {\n      width: fitContent ? 'fit-content' : '100%',\n\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'space-between',\n\n      columnGap: '0.5rem'\n    },\n    container: {\n      width: '2.5rem',\n      height: '1.5rem',\n\n      position: 'relative',\n\n      display: 'inline-flex',\n      alignItems: 'center',\n      marginLeft: '0.5rem',\n\n      borderRadius: '2rem',\n      padding: '0.125rem',\n\n      transition: 'background-color 0.5s',\n      backgroundColor: checked\n        ? (colorActive ?? 'var(--px-color-success)')\n        : (colorInactive ?? 'var(--px-color-disabled)')\n    },\n\n    indicator: {\n      height: '1.25rem',\n      width: '1.25rem',\n\n      position: 'absolute',\n      left: '0.125rem',\n      top: '0.125rem',\n\n      borderRadius: '9999px',\n      backgroundColor: colorIndicator ?? 'var(--px-surface)',\n\n      transition: 'transform 0.5s',\n      transform: checked ? 'translateX(1rem)' : 'translateX(0)',\n      willChange: 'transform'\n    }\n  })\n}\n","// External Libraries\n/** biome-ignore-all lint/a11y/noStaticElementInteractions: Not Needed */\n/** biome-ignore-all lint/a11y/useKeyWithClickEvents: Not Needed */\nimport type React from 'react'\nimport type { MouseEvent } from 'react'\n\n// Components\nimport { Typography } from '../Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SwitchThumbProps } from './types'\n\n// Styles\nimport { createSwitchThumbStyles } from './styles'\n\nexport const Switch: React.FC<SwitchThumbProps> = props => {\n  const { label, checked, onChange } = props\n\n  // Hooks\n  const { styles } = useThemedStyles(props, createSwitchThumbStyles, {\n    applyCommonProps: true,\n    pick: p => [p.checked]\n  })\n\n  // Functions\n  function handleChange(e: MouseEvent<HTMLSpanElement>) {\n    e.stopPropagation()\n    e.preventDefault()\n\n    onChange?.(!checked)\n  }\n\n  return (\n    <div style={styles.wrapper}>\n      {label ? (\n        <Typography variant=\"b2\" color=\"var(px-text-primary)\">\n          {label}\n        </Typography>\n      ) : null}\n\n      <span style={styles.container} onClick={handleChange}>\n        <span style={styles.indicator} />\n      </span>\n    </div>\n  )\n}\n"],"mappings":";;;;;AAMA,SAAgB,wBAAwB,EACtC,SACA,YACA,aACA,eACA,kBACmB;AACnB,QAAO,OAAO;EACZ,SAAS;GACP,OAAO,aAAa,gBAAgB;GAEpC,SAAS;GACT,YAAY;GACZ,gBAAgB;GAEhB,WAAW;GACZ;EACD,WAAW;GACT,OAAO;GACP,QAAQ;GAER,UAAU;GAEV,SAAS;GACT,YAAY;GACZ,YAAY;GAEZ,cAAc;GACd,SAAS;GAET,YAAY;GACZ,iBAAiB,UACZ,eAAe,4BACf,iBAAiB;GACvB;EAED,WAAW;GACT,QAAQ;GACR,OAAO;GAEP,UAAU;GACV,MAAM;GACN,KAAK;GAEL,cAAc;GACd,iBAAiB,kBAAkB;GAEnC,YAAY;GACZ,WAAW,UAAU,qBAAqB;GAC1C,YAAY;GACb;EACF,CAAC;;;;;ACvCJ,MAAaA,UAAqC,UAAS;CACzD,MAAM,EAAE,OAAO,SAAS,aAAa;CAGrC,MAAM,EAAE,WAAW,gBAAgB,OAAO,yBAAyB;EACjE,kBAAkB;EAClB,OAAM,MAAK,CAAC,EAAE,QAAQ;EACvB,CAAC;CAGF,SAAS,aAAa,GAAgC;AACpD,IAAE,iBAAiB;AACnB,IAAE,gBAAgB;AAElB,aAAW,CAAC,QAAQ;;AAGtB,QACE,qBAAC;EAAI,OAAO,OAAO;aAChB,QACC,oBAAC;GAAW,SAAQ;GAAK,OAAM;aAC5B;IACU,GACX,MAEJ,oBAAC;GAAK,OAAO,OAAO;GAAW,SAAS;aACtC,oBAAC,UAAK,OAAO,OAAO,YAAa;IAC5B;GACH"}

package/dist/{TabSwitch-Co6kaDbi.js → TabSwitch-UPXOZTf4.js}

@@ -1,5 +1,5 @@
 import { n as styled, t as useThemedStyles } from "./useThemedStyles-Dco_54KA.js";
-import { t as Typography } from "./Typography-u0BPHgCr.js";
+import { t as Typography } from "./Typography-CcQTHV-F.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { motion } from "framer-motion";
 
@@ -127,4 +127,4 @@ const TabSwitch = (props) => {
 
 //#endregion
 export { types_exports as n, TabSwitch as t };
-//# sourceMappingURL=TabSwitch-Co6kaDbi.js.map
+//# sourceMappingURL=TabSwitch-UPXOZTf4.js.map

package/dist/{TabSwitch-Co6kaDbi.js.map → TabSwitch-UPXOZTf4.js.map}

@@ -1 +1 @@
-{"version":3,"file":"TabSwitch-Co6kaDbi.js","names":[],"sources":["../src/components/commons/toolkit/TabSwitch/components/TabSwitchItem/styles.ts","../src/components/commons/toolkit/TabSwitch/components/TabSwitchItem/index.tsx","../src/components/commons/toolkit/TabSwitch/styles.ts","../src/components/commons/toolkit/TabSwitch/types.ts","../src/components/commons/toolkit/TabSwitch/index.tsx"],"sourcesContent":["// External Libraries\nimport { styled } from '@hooks/useThemedStyles/types'\n\ninterface Params {\n  disabled?: boolean\n  selected?: boolean\n  selectedColor?: string\n  variant: 'default' | 'underline'\n}\n\nexport function createTabSwitchItemStyles({\n  variant,\n  disabled,\n  selected,\n  selectedColor\n}: Params) {\n  const accent = selectedColor ?? 'var(--px-color-primary)'\n\n  return styled({\n    item: {\n      minHeight: '1.25rem',\n      position: 'relative',\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      gap: 4,\n      background: 'transparent',\n      border: 0,\n      padding: '8px 10px',\n      cursor: disabled ? 'not-allowed' : 'pointer',\n      opacity: disabled ? 0.5 : 1,\n      userSelect: 'none',\n      whiteSpace: 'nowrap',\n      __rules: { '& > p': { zIndex: 1 } }\n    },\n\n    selectedBg:\n      variant === 'default'\n        ? {\n            position: 'absolute',\n            inset: 0,\n            borderRadius: 6,\n            border: '1px solid var(--px-border-primary)',\n            background: selected ? accent : 'transparent'\n          }\n        : {\n            position: 'absolute',\n            left: 0,\n            right: 0,\n            bottom: -2,\n            height: 2,\n            background: selected ? accent : 'transparent'\n          }\n  })\n}\n","// External Libraries\nimport { motion } from 'framer-motion'\n\n// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SwitchOption } from '../../types'\n\n// Styles\nimport { createTabSwitchItemStyles } from './styles'\n\ntype Props<T> = {\n  option: SwitchOption<T>\n  selected: boolean\n  layoutId?: string\n  disabled?: boolean\n  selectedColor?: string\n  selectedLabelColor?: string\n  variant: 'default' | 'underline'\n  onClick: (value: T) => void\n}\n\nexport const SwitchItem = <T,>(props: Props<T>) => {\n  const { option, disabled, selected, layoutId, onClick } = props\n\n  const { styles, classes } = useThemedStyles(\n    props,\n    createTabSwitchItemStyles,\n    {\n      pick: p => [p.variant, p.selectedColor, p.selectedLabelColor, p.selected]\n    }\n  )\n\n  const isDisabled = disabled || option.disabled\n\n  return (\n    <button\n      type=\"button\"\n      style={styles.item}\n      className={classes.item}\n      tabIndex={isDisabled ? -1 : 0}\n      onClick={() => !isDisabled && onClick(option.value)}\n    >\n      {selected ? (\n        <motion.div\n          layoutId={layoutId || 'pixel-tabswitch-selected'}\n          style={styles.selectedBg}\n        />\n      ) : null}\n\n      {option.icon ? (\n        <span style={{ display: 'inline-flex' }}>{option.icon}</span>\n      ) : null}\n\n      {option.label ? (\n        <Typography variant=\"b1\" fontWeight=\"bold\">\n          {option.label}\n        </Typography>\n      ) : null}\n    </button>\n  )\n}\n","// Types\nimport type { TabSwitchProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createTabSwitchStyles<T>(props: TabSwitchProps<T>) {\n  const { fitContent, backgroundColor, variant } = props\n\n  return styled({\n    container: {\n      display: 'flex',\n      padding: '3px',\n      flexDirection: 'row',\n      alignItems: 'center',\n      borderRadius: '0.5rem',\n      color: 'var(--px-text-primary, #4b5563)',\n      width: fitContent ? 'fit-content' : '100%',\n      backgroundColor: backgroundColor ?? 'transparent',\n      borderBottom:\n        variant === 'underline'\n          ? '1px solid var(--px-border-primary, #e5e7eb)'\n          : 'unset',\n      gap: 0,\n      __rules: { '& svg': { zIndex: 1 } }\n    }\n  })\n}\n","// Types\nimport type { CommonStyleProps, TypeStyles } from '@hooks/useThemedStyles/types'\nimport type { ReactNode } from 'react'\nimport type { createTabSwitchStyles } from './styles'\n\nexport interface SwitchOption<T> {\n  value: T\n  label?: string\n  disabled?: boolean\n\n  icon?: ReactNode\n}\n\nexport interface TabSwitchProps<T> extends CommonStyleProps {\n  currentValue: T\n  options: SwitchOption<T>[]\n\n  disabled?: boolean\n  fitContent?: boolean\n\n  layoutId?: string\n\n  selectedColor?: string\n  backgroundColor?: string\n  selectedLabelColor?: string\n\n  variant?: 'default' | 'underline'\n\n  styles?: TypeStyles<typeof createTabSwitchStyles>\n\n  onChange: (value: T) => void\n}\n","// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Components\nimport { SwitchItem } from './components/TabSwitchItem'\n\n// Types\nimport type { TabSwitchProps } from './types'\n\n// Styles\nimport { createTabSwitchStyles } from './styles'\n\nexport * as TabSwitchTypes from './types'\n\nexport const TabSwitch = <T,>(props: TabSwitchProps<T>) => {\n  {\n    const {\n      options,\n      disabled,\n      layoutId,\n      currentValue,\n      variant = 'default',\n      onChange\n    } = props\n\n    const { styles, classes } = useThemedStyles(props, createTabSwitchStyles, {\n      pick: p => [p.disabled, p.currentValue],\n      override: props.styles,\n      applyCommonProps: true\n    })\n\n    return (\n      <div style={styles.container} className={classes.container}>\n        {options.map(opt => (\n          <SwitchItem\n            key={String(opt.value)}\n            option={opt}\n            variant={variant}\n            layoutId={layoutId}\n            disabled={disabled}\n            selectedColor={props.selectedColor}\n            selected={currentValue === opt.value}\n            selectedLabelColor={props.selectedLabelColor}\n            onClick={onChange}\n          />\n        ))}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAUA,SAAgB,0BAA0B,EACxC,SACA,UACA,UACA,iBACS;CACT,MAAM,SAAS,iBAAiB;AAEhC,QAAO,OAAO;EACZ,MAAM;GACJ,WAAW;GACX,UAAU;GACV,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,KAAK;GACL,YAAY;GACZ,QAAQ;GACR,SAAS;GACT,QAAQ,WAAW,gBAAgB;GACnC,SAAS,WAAW,KAAM;GAC1B,YAAY;GACZ,YAAY;GACZ,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE;GACpC;EAED,YACE,YAAY,YACR;GACE,UAAU;GACV,OAAO;GACP,cAAc;GACd,QAAQ;GACR,YAAY,WAAW,SAAS;GACjC,GACD;GACE,UAAU;GACV,MAAM;GACN,OAAO;GACP,QAAQ;GACR,QAAQ;GACR,YAAY,WAAW,SAAS;GACjC;EACR,CAAC;;;;;AC3BJ,MAAa,cAAkB,UAAoB;CACjD,MAAM,EAAE,QAAQ,UAAU,UAAU,UAAU,YAAY;CAE1D,MAAM,EAAE,QAAQ,YAAY,gBAC1B,OACA,2BACA,EACE,OAAM,MAAK;EAAC,EAAE;EAAS,EAAE;EAAe,EAAE;EAAoB,EAAE;EAAS,EAC1E,CACF;CAED,MAAM,aAAa,YAAY,OAAO;AAEtC,QACE,qBAAC;EACC,MAAK;EACL,OAAO,OAAO;EACd,WAAW,QAAQ;EACnB,UAAU,aAAa,KAAK;EAC5B,eAAe,CAAC,cAAc,QAAQ,OAAO,MAAM;;GAElD,WACC,oBAAC,OAAO;IACN,UAAU,YAAY;IACtB,OAAO,OAAO;KACd,GACA;GAEH,OAAO,OACN,oBAAC;IAAK,OAAO,EAAE,SAAS,eAAe;cAAG,OAAO;KAAY,GAC3D;GAEH,OAAO,QACN,oBAAC;IAAW,SAAQ;IAAK,YAAW;cACjC,OAAO;KACG,GACX;;GACG;;;;;AC3Db,SAAgB,sBAAyB,OAA0B;CACjE,MAAM,EAAE,YAAY,iBAAiB,YAAY;AAEjD,QAAO,OAAO,EACZ,WAAW;EACT,SAAS;EACT,SAAS;EACT,eAAe;EACf,YAAY;EACZ,cAAc;EACd,OAAO;EACP,OAAO,aAAa,gBAAgB;EACpC,iBAAiB,mBAAmB;EACpC,cACE,YAAY,cACR,gDACA;EACN,KAAK;EACL,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE;EACpC,EACF,CAAC;;;;;;;;;AEVJ,MAAa,aAAiB,UAA6B;CACzD;EACE,MAAM,EACJ,SACA,UACA,UACA,cACA,UAAU,WACV,aACE;EAEJ,MAAM,EAAE,QAAQ,YAAY,gBAAgB,OAAO,uBAAuB;GACxE,OAAM,MAAK,CAAC,EAAE,UAAU,EAAE,aAAa;GACvC,UAAU,MAAM;GAChB,kBAAkB;GACnB,CAAC;AAEF,SACE,oBAAC;GAAI,OAAO,OAAO;GAAW,WAAW,QAAQ;aAC9C,QAAQ,KAAI,QACX,oBAAC;IAEC,QAAQ;IACC;IACC;IACA;IACV,eAAe,MAAM;IACrB,UAAU,iBAAiB,IAAI;IAC/B,oBAAoB,MAAM;IAC1B,SAAS;MARJ,OAAO,IAAI,MAAM,CAStB,CACF;IACE"}
+{"version":3,"file":"TabSwitch-UPXOZTf4.js","names":[],"sources":["../src/components/commons/toolkit/TabSwitch/components/TabSwitchItem/styles.ts","../src/components/commons/toolkit/TabSwitch/components/TabSwitchItem/index.tsx","../src/components/commons/toolkit/TabSwitch/styles.ts","../src/components/commons/toolkit/TabSwitch/types.ts","../src/components/commons/toolkit/TabSwitch/index.tsx"],"sourcesContent":["// External Libraries\nimport { styled } from '@hooks/useThemedStyles/types'\n\ninterface Params {\n  disabled?: boolean\n  selected?: boolean\n  selectedColor?: string\n  variant: 'default' | 'underline'\n}\n\nexport function createTabSwitchItemStyles({\n  variant,\n  disabled,\n  selected,\n  selectedColor\n}: Params) {\n  const accent = selectedColor ?? 'var(--px-color-primary)'\n\n  return styled({\n    item: {\n      minHeight: '1.25rem',\n      position: 'relative',\n      display: 'inline-flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      gap: 4,\n      background: 'transparent',\n      border: 0,\n      padding: '8px 10px',\n      cursor: disabled ? 'not-allowed' : 'pointer',\n      opacity: disabled ? 0.5 : 1,\n      userSelect: 'none',\n      whiteSpace: 'nowrap',\n      __rules: { '& > p': { zIndex: 1 } }\n    },\n\n    selectedBg:\n      variant === 'default'\n        ? {\n            position: 'absolute',\n            inset: 0,\n            borderRadius: 6,\n            border: '1px solid var(--px-border-primary)',\n            background: selected ? accent : 'transparent'\n          }\n        : {\n            position: 'absolute',\n            left: 0,\n            right: 0,\n            bottom: -2,\n            height: 2,\n            background: selected ? accent : 'transparent'\n          }\n  })\n}\n","// External Libraries\nimport { motion } from 'framer-motion'\n\n// Components\nimport { Typography } from '@components/commons/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Types\nimport type { SwitchOption } from '../../types'\n\n// Styles\nimport { createTabSwitchItemStyles } from './styles'\n\ntype Props<T> = {\n  option: SwitchOption<T>\n  selected: boolean\n  layoutId?: string\n  disabled?: boolean\n  selectedColor?: string\n  selectedLabelColor?: string\n  variant: 'default' | 'underline'\n  onClick: (value: T) => void\n}\n\nexport const SwitchItem = <T,>(props: Props<T>) => {\n  const { option, disabled, selected, layoutId, onClick } = props\n\n  const { styles, classes } = useThemedStyles(\n    props,\n    createTabSwitchItemStyles,\n    {\n      pick: p => [p.variant, p.selectedColor, p.selectedLabelColor, p.selected]\n    }\n  )\n\n  const isDisabled = disabled || option.disabled\n\n  return (\n    <button\n      type=\"button\"\n      style={styles.item}\n      className={classes.item}\n      tabIndex={isDisabled ? -1 : 0}\n      onClick={() => !isDisabled && onClick(option.value)}\n    >\n      {selected ? (\n        <motion.div\n          layoutId={layoutId || 'pixel-tabswitch-selected'}\n          style={styles.selectedBg}\n        />\n      ) : null}\n\n      {option.icon ? (\n        <span style={{ display: 'inline-flex' }}>{option.icon}</span>\n      ) : null}\n\n      {option.label ? (\n        <Typography variant=\"b1\" fontWeight=\"bold\">\n          {option.label}\n        </Typography>\n      ) : null}\n    </button>\n  )\n}\n","// Types\nimport type { TabSwitchProps } from './types'\nimport { styled } from '@hooks/useThemedStyles/types'\n\nexport function createTabSwitchStyles<T>(props: TabSwitchProps<T>) {\n  const { fitContent, backgroundColor, variant } = props\n\n  return styled({\n    container: {\n      display: 'flex',\n      padding: '3px',\n      flexDirection: 'row',\n      alignItems: 'center',\n      borderRadius: '0.5rem',\n      color: 'var(--px-text-primary, #4b5563)',\n      width: fitContent ? 'fit-content' : '100%',\n      backgroundColor: backgroundColor ?? 'transparent',\n      borderBottom:\n        variant === 'underline'\n          ? '1px solid var(--px-border-primary, #e5e7eb)'\n          : 'unset',\n      gap: 0,\n      __rules: { '& svg': { zIndex: 1 } }\n    }\n  })\n}\n","// Types\nimport type { CommonStyleProps, TypeStyles } from '@hooks/useThemedStyles/types'\nimport type { ReactNode } from 'react'\nimport type { createTabSwitchStyles } from './styles'\n\nexport interface SwitchOption<T> {\n  value: T\n  label?: string\n  disabled?: boolean\n\n  icon?: ReactNode\n}\n\nexport interface TabSwitchProps<T> extends CommonStyleProps {\n  currentValue: T\n  options: SwitchOption<T>[]\n\n  disabled?: boolean\n  fitContent?: boolean\n\n  layoutId?: string\n\n  selectedColor?: string\n  backgroundColor?: string\n  selectedLabelColor?: string\n\n  variant?: 'default' | 'underline'\n\n  styles?: TypeStyles<typeof createTabSwitchStyles>\n\n  onChange: (value: T) => void\n}\n","// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Components\nimport { SwitchItem } from './components/TabSwitchItem'\n\n// Types\nimport type { TabSwitchProps } from './types'\n\n// Styles\nimport { createTabSwitchStyles } from './styles'\n\nexport * as TabSwitchTypes from './types'\n\nexport const TabSwitch = <T,>(props: TabSwitchProps<T>) => {\n  {\n    const {\n      options,\n      disabled,\n      layoutId,\n      currentValue,\n      variant = 'default',\n      onChange\n    } = props\n\n    const { styles, classes } = useThemedStyles(props, createTabSwitchStyles, {\n      pick: p => [p.disabled, p.currentValue],\n      override: props.styles,\n      applyCommonProps: true\n    })\n\n    return (\n      <div style={styles.container} className={classes.container}>\n        {options.map(opt => (\n          <SwitchItem\n            key={String(opt.value)}\n            option={opt}\n            variant={variant}\n            layoutId={layoutId}\n            disabled={disabled}\n            selectedColor={props.selectedColor}\n            selected={currentValue === opt.value}\n            selectedLabelColor={props.selectedLabelColor}\n            onClick={onChange}\n          />\n        ))}\n      </div>\n    )\n  }\n}\n"],"mappings":";;;;;;AAUA,SAAgB,0BAA0B,EACxC,SACA,UACA,UACA,iBACS;CACT,MAAM,SAAS,iBAAiB;AAEhC,QAAO,OAAO;EACZ,MAAM;GACJ,WAAW;GACX,UAAU;GACV,SAAS;GACT,YAAY;GACZ,gBAAgB;GAChB,KAAK;GACL,YAAY;GACZ,QAAQ;GACR,SAAS;GACT,QAAQ,WAAW,gBAAgB;GACnC,SAAS,WAAW,KAAM;GAC1B,YAAY;GACZ,YAAY;GACZ,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE;GACpC;EAED,YACE,YAAY,YACR;GACE,UAAU;GACV,OAAO;GACP,cAAc;GACd,QAAQ;GACR,YAAY,WAAW,SAAS;GACjC,GACD;GACE,UAAU;GACV,MAAM;GACN,OAAO;GACP,QAAQ;GACR,QAAQ;GACR,YAAY,WAAW,SAAS;GACjC;EACR,CAAC;;;;;AC3BJ,MAAa,cAAkB,UAAoB;CACjD,MAAM,EAAE,QAAQ,UAAU,UAAU,UAAU,YAAY;CAE1D,MAAM,EAAE,QAAQ,YAAY,gBAC1B,OACA,2BACA,EACE,OAAM,MAAK;EAAC,EAAE;EAAS,EAAE;EAAe,EAAE;EAAoB,EAAE;EAAS,EAC1E,CACF;CAED,MAAM,aAAa,YAAY,OAAO;AAEtC,QACE,qBAAC;EACC,MAAK;EACL,OAAO,OAAO;EACd,WAAW,QAAQ;EACnB,UAAU,aAAa,KAAK;EAC5B,eAAe,CAAC,cAAc,QAAQ,OAAO,MAAM;;GAElD,WACC,oBAAC,OAAO;IACN,UAAU,YAAY;IACtB,OAAO,OAAO;KACd,GACA;GAEH,OAAO,OACN,oBAAC;IAAK,OAAO,EAAE,SAAS,eAAe;cAAG,OAAO;KAAY,GAC3D;GAEH,OAAO,QACN,oBAAC;IAAW,SAAQ;IAAK,YAAW;cACjC,OAAO;KACG,GACX;;GACG;;;;;AC3Db,SAAgB,sBAAyB,OAA0B;CACjE,MAAM,EAAE,YAAY,iBAAiB,YAAY;AAEjD,QAAO,OAAO,EACZ,WAAW;EACT,SAAS;EACT,SAAS;EACT,eAAe;EACf,YAAY;EACZ,cAAc;EACd,OAAO;EACP,OAAO,aAAa,gBAAgB;EACpC,iBAAiB,mBAAmB;EACpC,cACE,YAAY,cACR,gDACA;EACN,KAAK;EACL,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE;EACpC,EACF,CAAC;;;;;;;;;AEVJ,MAAa,aAAiB,UAA6B;CACzD;EACE,MAAM,EACJ,SACA,UACA,UACA,cACA,UAAU,WACV,aACE;EAEJ,MAAM,EAAE,QAAQ,YAAY,gBAAgB,OAAO,uBAAuB;GACxE,OAAM,MAAK,CAAC,EAAE,UAAU,EAAE,aAAa;GACvC,UAAU,MAAM;GAChB,kBAAkB;GACnB,CAAC;AAEF,SACE,oBAAC;GAAI,OAAO,OAAO;GAAW,WAAW,QAAQ;aAC9C,QAAQ,KAAI,QACX,oBAAC;IAEC,QAAQ;IACC;IACC;IACA;IACV,eAAe,MAAM;IACrB,UAAU,iBAAiB,IAAI;IAC/B,oBAAoB,MAAM;IAC1B,SAAS;MARJ,OAAO,IAAI,MAAM,CAStB,CACF;IACE"}

package/dist/{TextArea-s6HdNSc5.js → TextArea-BMJWFF3y.js}

@@ -1,6 +1,6 @@
 import { n as styled, t as useThemedStyles } from "./useThemedStyles-Dco_54KA.js";
-import { t as Typography } from "./Typography-u0BPHgCr.js";
-import { t as Label } from "./Label-VE3hoSbt.js";
+import { t as Typography } from "./Typography-CcQTHV-F.js";
+import { t as Label } from "./Label-CBUa-x13.js";
 import { t as ErrorMessage } from "./ErrorMessage-6pG4hFId.js";
 import { useId, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -116,4 +116,4 @@ const TextArea = (props) => {
 
 //#endregion
 export { TextArea as t };
-//# sourceMappingURL=TextArea-s6HdNSc5.js.map
+//# sourceMappingURL=TextArea-BMJWFF3y.js.map