softable-pixels-web 1.1.7 → 1.1.9

package/dist/InfoSummary-uorFDD40.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"InfoSummary-uorFDD40.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/toolkit/InfoSummary/components/SummaryItem/components/SummaryHeader/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHeader/index.tsx","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryCaption/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryCaption/index.tsx","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHighlight/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/components/SummaryHighlight/index.tsx","../src/components/toolkit/InfoSummary/components/SummaryItem/styles.ts","../src/components/toolkit/InfoSummary/components/SummaryItem/index.tsx","../src/components/toolkit/InfoSummary/styles.ts","../src/components/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/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/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/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-BvbMEjwE.js

@@ -1,327 +0,0 @@
-import { t as Icon } from "./Icon-Cv0qztmq.js";
-import { n as styled, t as useThemedStyles } from "./useThemedStyles-3rUXJYgS.js";
-import { t as Label } from "./Label-QQpNWSeV.js";
-import { useCallback, useId, useMemo, useRef, useState } from "react";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/commons/inputs/Input/hooks/useInput/index.ts
-const useInput = ({ value: controlledValue, defaultValue = "", onChange }) => {
-	const inputRef = useRef(null);
-	const [internalValue, setInternalValue] = useState(defaultValue);
-	const [showPassword, setShowPassword] = useState(false);
-	const isControlled = controlledValue !== void 0;
-	const currentValue = isControlled ? controlledValue : internalValue;
-	const handleChange = useCallback((e) => {
-		const value = e.target.value;
-		if (!isControlled) setInternalValue(value);
-		onChange?.(value);
-	}, [isControlled, onChange]);
-	const togglePasswordVisibility = useCallback(() => {
-		setShowPassword((prev) => !prev);
-	}, []);
-	return {
-		inputRef,
-		focusInput: useCallback(() => {
-			inputRef.current?.focus();
-		}, []),
-		isControlled,
-		currentValue,
-		showPassword,
-		handleChange,
-		togglePasswordVisibility
-	};
-};
-
-//#endregion
-//#region src/components/commons/inputs/Input/styles.ts
-const INPUT_STYLES = {
-	width: {
-		auto: { width: "auto" },
-		full: { width: "100%" },
-		md: { width: "12rem" },
-		lg: { width: "16rem" },
-		xl: { width: "20rem" },
-		"2xl": { width: "24rem" }
-	},
-	radius: {
-		none: { borderRadius: "0px" },
-		sm: { borderRadius: "0.125rem" },
-		md: { borderRadius: "0.375rem" },
-		lg: { borderRadius: "0.5rem" },
-		full: { borderRadius: "9999px" }
-	},
-	size: {
-		sm: {
-			wrapper: { minHeight: "2rem" },
-			input: {
-				padding: "0.5rem 0.75rem",
-				lineHeight: "1rem",
-				fontSize: "0.75rem"
-			},
-			label: {
-				fontSize: "0.75rem",
-				lineHeight: "1rem",
-				marginBottom: "0.25rem"
-			},
-			description: {
-				fontSize: "0.75rem",
-				lineHeight: "1rem",
-				marginTop: "0.25rem"
-			},
-			error: {
-				fontSize: "0.75rem",
-				lineHeight: "1rem",
-				marginTop: "0.25rem"
-			}
-		},
-		md: {
-			wrapper: { minHeight: "2.5rem" },
-			input: {
-				padding: "0.5rem 0.75rem",
-				lineHeight: "1.25rem",
-				fontSize: "0.875rem"
-			},
-			label: {
-				fontSize: "0.875rem",
-				lineHeight: "1.25rem",
-				marginBottom: "0.375rem"
-			},
-			description: {
-				fontSize: "0.75rem",
-				lineHeight: "1rem",
-				marginTop: "0.375rem"
-			},
-			error: {
-				fontSize: "0.75rem",
-				lineHeight: "1rem",
-				marginTop: "0.375rem"
-			}
-		},
-		lg: {
-			wrapper: { minHeight: "3rem" },
-			input: {
-				padding: "0.75rem 1rem",
-				lineHeight: "1.5rem",
-				fontSize: "1rem",
-				width: "16rem"
-			},
-			label: {
-				fontSize: "0.875rem",
-				lineHeight: "1.25rem",
-				marginBottom: "0.5rem"
-			},
-			description: {
-				fontSize: "0.875rem",
-				lineHeight: "1.25rem",
-				marginTop: "0.5rem"
-			},
-			error: {
-				fontSize: "0.875rem",
-				lineHeight: "1.25rem",
-				marginTop: "0.5rem"
-			}
-		}
-	},
-	variant: { bordered: {
-		wrapper: { border: "1px solid var(--px-border-primary)" },
-		input: {
-			backgroundColor: "transparent",
-			color: "var(--px-text-primary)",
-			"::placeholder": { color: "var(--px-text-secondary)" }
-		},
-		label: { color: "var(--px-text-primary)" },
-		button: {
-			color: "var(--px-text-secondary)",
-			":hover": { color: "var(--px-text-primary)" }
-		}
-	} },
-	state: {
-		default: {
-			input: {},
-			ring: { boxShadow: "0 0 0 2px var(--px-color-info)" }
-		},
-		invalid: {
-			wrapper: {
-				borderColor: "var(--px-color-invalid)",
-				__rules: { "&:focus-within": { boxShadow: "0 0 0 1px var(--px-background), 0 0 0 3px var(--px-color-invalid)" } }
-			},
-			input: { color: "var(--px-color-invalid)" },
-			error: { color: "var(--px-color-invalid)" }
-		},
-		disabled: {
-			wrapper: {
-				opacity: .6,
-				cursor: "not-allowed",
-				backgroundColor: "#f9fafb"
-			},
-			input: { cursor: "not-allowed" },
-			label: { cursor: "not-allowed" }
-		}
-	}
-};
-function createInputStyles(props) {
-	const { size = "md", variant = "bordered", radius = "md", isDisabled = false, isInvalid = false, focusedRingColor } = props;
-	const focusRingColor = focusedRingColor || "var(--px-color-info)";
-	return styled({
-		wrapper: {
-			position: "relative",
-			display: "flex",
-			alignItems: "center",
-			...INPUT_STYLES.size[size]?.wrapper ?? {},
-			...INPUT_STYLES.variant[variant]?.wrapper ?? {},
-			...INPUT_STYLES.radius[radius] ?? {},
-			__rules: { "&:focus-within": { boxShadow: `0 0 0 1px var(--px-background), 0 0 0 3px ${focusRingColor}` } },
-			...isDisabled ? INPUT_STYLES.state.disabled.wrapper : {},
-			...isInvalid ? INPUT_STYLES.state.invalid.wrapper : {}
-		},
-		input: {
-			flex: 1,
-			backgroundColor: "transparent",
-			outline: "none",
-			width: "100%",
-			...INPUT_STYLES.size[size]?.input ?? {},
-			...INPUT_STYLES.variant[variant]?.input ?? {},
-			...INPUT_STYLES.state.default.input ?? {},
-			...isDisabled ? INPUT_STYLES.state.disabled.input : {},
-			...isInvalid ? INPUT_STYLES.state.invalid.input : {}
-		},
-		label: {
-			...INPUT_STYLES.size[size]?.label ?? {},
-			...INPUT_STYLES.variant[variant]?.label ?? {},
-			...isDisabled ? INPUT_STYLES.state.disabled.label : {}
-		},
-		error: {
-			display: "block",
-			...INPUT_STYLES.size[size]?.error ?? {},
-			...INPUT_STYLES.state.invalid.error ?? {}
-		},
-		button: {
-			display: "flex",
-			alignItems: "center",
-			justifyContent: "center",
-			padding: "0.25rem",
-			cursor: "pointer",
-			...INPUT_STYLES.variant[variant]?.button ?? {},
-			...INPUT_STYLES.radius[radius] ?? {},
-			...isDisabled ? {
-				cursor: "not-allowed",
-				opacity: .5
-			} : {}
-		},
-		startContent: {
-			display: "flex",
-			alignItems: "center",
-			padding: "0.25rem"
-		}
-	});
-}
-
-//#endregion
-//#region src/components/commons/inputs/Input/index.tsx
-const Input = (props) => {
-	const { id, type, label, width, fullWidth, required, isDisabled, minLength, maxLength, placeholder, requiredColor, labelColor, labelWeight, labelVariant, startContent, endContent, errorMessage, onChange, value, defaultValue, size, radius, variant, isInvalid, ...nativeInputProps } = props;
-	const { inputRef, currentValue, showPassword, handleChange, togglePasswordVisibility } = useInput({
-		size,
-		value,
-		radius,
-		variant,
-		isInvalid,
-		fullWidth,
-		isDisabled,
-		defaultValue,
-		onChange
-	});
-	const reactId = useId();
-	const inputId = useMemo(() => {
-		return id || `input-${reactId}`;
-	}, [id, reactId]);
-	const containerWidth = getWidth();
-	const { styles, classes } = useThemedStyles(props, createInputStyles, {
-		pick: (p) => [
-			p.size,
-			p.variant,
-			p.radius,
-			p.isDisabled,
-			p.isInvalid,
-			p.focusedRingColor
-		],
-		override: props.styles,
-		applyCommonProps: true,
-		commonSlot: "input"
-	});
-	function getType() {
-		if (type === "password" && showPassword) return "text";
-		return type;
-	}
-	function getWidth() {
-		if (fullWidth) return { width: "100%" };
-		if (width) return INPUT_STYLES.width[width] || { width: "auto" };
-		return { width: "auto" };
-	}
-	function renderLabel() {
-		if (!label) return null;
-		return /* @__PURE__ */ jsx("div", {
-			className: "flex items-center gap-3",
-			children: /* @__PURE__ */ jsx(Label, {
-				htmlFor: inputId,
-				label,
-				required,
-				styles: { label: styles.label },
-				requiredColor,
-				labelColor,
-				labelWeight,
-				labelVariant
-			})
-		});
-	}
-	function renderEndContent() {
-		return /* @__PURE__ */ jsx(Fragment, { children: type === "password" ? /* @__PURE__ */ jsx("button", {
-			type: "button",
-			style: styles.button,
-			onClick: togglePasswordVisibility,
-			children: showPassword ? /* @__PURE__ */ jsx(Icon, { name: "general-eye-off" }) : /* @__PURE__ */ jsx(Icon, { name: "general-eye" })
-		}) : endContent });
-	}
-	return /* @__PURE__ */ jsxs("div", {
-		style: containerWidth,
-		children: [
-			renderLabel(),
-			/* @__PURE__ */ jsxs("div", {
-				style: styles.wrapper,
-				className: classes.wrapper,
-				children: [
-					startContent && /* @__PURE__ */ jsx("div", {
-						style: styles.startContent,
-						children: startContent
-					}),
-					/* @__PURE__ */ jsx("div", {
-						style: { flex: 1 },
-						children: /* @__PURE__ */ jsx("input", {
-							ref: inputRef,
-							id: inputId,
-							type: getType(),
-							value: currentValue,
-							style: styles.input,
-							className: classes.input,
-							disabled: isDisabled,
-							minLength,
-							maxLength,
-							placeholder: placeholder ?? "Digite aqui...",
-							onChange: handleChange,
-							...nativeInputProps
-						})
-					}),
-					renderEndContent() && /* @__PURE__ */ jsx("div", { children: renderEndContent() })
-				]
-			}),
-			errorMessage ? /* @__PURE__ */ jsx("div", {
-				style: styles.error,
-				children: errorMessage
-			}) : null
-		]
-	});
-};
-
-//#endregion
-export { Input as t };
-//# sourceMappingURL=Input-BvbMEjwE.js.map

package/dist/Input-BvbMEjwE.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Input-BvbMEjwE.js","names":["Input: React.FC<InputProps>"],"sources":["../src/components/commons/inputs/Input/hooks/useInput/index.ts","../src/components/commons/inputs/Input/styles.ts","../src/components/commons/inputs/Input/index.tsx"],"sourcesContent":["// External Libraries\nimport { useState, useRef, useCallback } from 'react'\n\n// Types\nimport type { InputProps } from '../../types'\n\nexport const useInput = ({\n  value: controlledValue,\n  defaultValue = '',\n  onChange,\n}: Partial<InputProps>) => {\n  // Refs\n  const inputRef = useRef<HTMLInputElement>(null)\n\n  // States\n  const [internalValue, setInternalValue] = useState(defaultValue)\n  const [showPassword, setShowPassword] = useState(false)\n\n  // Constants\n  const isControlled = controlledValue !== undefined\n  const currentValue = isControlled ? controlledValue : internalValue\n\n  // Functions\n  const handleChange = useCallback(\n    (e: React.ChangeEvent<HTMLInputElement>) => {\n      const value = e.target.value\n\n      if (!isControlled) setInternalValue(value)\n      onChange?.(value)\n    },\n    [isControlled, onChange],\n  )\n\n  const togglePasswordVisibility = useCallback(() => {\n    setShowPassword(prev => !prev)\n  }, [])\n\n  const focusInput = useCallback(() => {\n    inputRef.current?.focus()\n  }, [])\n\n  return {\n    inputRef,\n    focusInput,\n    isControlled,\n    currentValue,\n    showPassword,\n    handleChange,\n    togglePasswordVisibility,\n  }\n}\n","// External libraries\nimport type { CSSProperties } from 'react'\n\n// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\nimport type { InputProps } from './types'\n\nexport const INPUT_STYLES = {\n  width: {\n    auto: { width: 'auto' },\n    full: { width: '100%' },\n    md: { width: '12rem' },\n    lg: { width: '16rem' },\n    xl: { width: '20rem' },\n    '2xl': { width: '24rem' }\n  } as Record<string, CSSProperties>,\n  radius: {\n    none: { borderRadius: '0px' },\n    sm: { borderRadius: '0.125rem' },\n    md: { borderRadius: '0.375rem' },\n    lg: { borderRadius: '0.5rem' },\n    full: { borderRadius: '9999px' }\n  } as Record<string, CSSProperties>,\n  size: {\n    sm: {\n      wrapper: { minHeight: '2rem' },\n      input: {\n        padding: '0.5rem 0.75rem',\n        lineHeight: '1rem',\n        fontSize: '0.75rem'\n      },\n      label: {\n        fontSize: '0.75rem',\n        lineHeight: '1rem',\n        marginBottom: '0.25rem'\n      },\n      description: {\n        fontSize: '0.75rem',\n        lineHeight: '1rem',\n        marginTop: '0.25rem'\n      },\n      error: {\n        fontSize: '0.75rem',\n        lineHeight: '1rem',\n        marginTop: '0.25rem'\n      }\n    } as Record<string, CSSProperties>,\n    md: {\n      wrapper: { minHeight: '2.5rem' },\n      input: {\n        padding: '0.5rem 0.75rem',\n        lineHeight: '1.25rem',\n        fontSize: '0.875rem'\n      },\n      label: {\n        fontSize: '0.875rem',\n        lineHeight: '1.25rem',\n        marginBottom: '0.375rem'\n      },\n      description: {\n        fontSize: '0.75rem',\n        lineHeight: '1rem',\n        marginTop: '0.375rem'\n      },\n      error: {\n        fontSize: '0.75rem',\n        lineHeight: '1rem',\n        marginTop: '0.375rem'\n      }\n    } as Record<string, CSSProperties>,\n    lg: {\n      wrapper: { minHeight: '3rem' },\n      input: {\n        padding: '0.75rem 1rem',\n        lineHeight: '1.5rem',\n        fontSize: '1rem',\n        width: '16rem'\n      },\n      label: {\n        fontSize: '0.875rem',\n        lineHeight: '1.25rem',\n        marginBottom: '0.5rem'\n      },\n      description: {\n        fontSize: '0.875rem',\n        lineHeight: '1.25rem',\n        marginTop: '0.5rem'\n      },\n      error: {\n        fontSize: '0.875rem',\n        lineHeight: '1.25rem',\n        marginTop: '0.5rem'\n      }\n    } as Record<string, CSSProperties>\n  },\n  variant: {\n    bordered: {\n      wrapper: { border: '1px solid var(--px-border-primary)' },\n      input: {\n        backgroundColor: 'transparent',\n        color: 'var(--px-text-primary)',\n        '::placeholder': {\n          color: 'var(--px-text-secondary)'\n        }\n      },\n      label: { color: 'var(--px-text-primary)' },\n      button: {\n        color: 'var(--px-text-secondary)',\n        ':hover': { color: 'var(--px-text-primary)' }\n      }\n    } as Record<string, CSSProperties>\n  },\n  state: {\n    default: {\n      input: {},\n      ring: {\n        boxShadow: '0 0 0 2px var(--px-color-info)'\n      }\n    },\n    invalid: {\n      wrapper: {\n        borderColor: 'var(--px-color-invalid)',\n        __rules: {\n          '&:focus-within': {\n            boxShadow:\n              '0 0 0 1px var(--px-background), 0 0 0 3px var(--px-color-invalid)'\n          }\n        }\n      },\n      input: {\n        color: 'var(--px-color-invalid)'\n      },\n      error: {\n        color: 'var(--px-color-invalid)'\n      }\n    },\n\n    disabled: {\n      wrapper: {\n        opacity: 0.6,\n        cursor: 'not-allowed',\n        backgroundColor: '#f9fafb'\n      },\n      input: {\n        cursor: 'not-allowed'\n      },\n      label: {\n        cursor: 'not-allowed'\n      }\n    }\n  } as Record<string, Partial<StyleMap>>\n}\n\nexport function createInputStyles(props: InputProps): StyleMap {\n  const {\n    size = 'md',\n    variant = 'bordered',\n    radius = 'md',\n    isDisabled = false,\n    isInvalid = false,\n    focusedRingColor\n  } = props\n\n  const focusRingColor = focusedRingColor || 'var(--px-color-info)'\n\n  return styled({\n    wrapper: {\n      position: 'relative',\n      display: 'flex',\n      alignItems: 'center',\n\n      ...(INPUT_STYLES.size[size]?.wrapper ?? {}),\n      ...(INPUT_STYLES.variant[variant]?.wrapper ?? {}),\n      ...(INPUT_STYLES.radius[radius] ?? {}),\n\n      __rules: {\n        '&:focus-within': {\n          boxShadow: `0 0 0 1px var(--px-background), 0 0 0 3px ${focusRingColor}`\n        }\n      },\n\n      ...(isDisabled ? INPUT_STYLES.state.disabled.wrapper : {}),\n      ...(isInvalid ? INPUT_STYLES.state.invalid.wrapper : {})\n    },\n\n    input: {\n      flex: 1,\n      backgroundColor: 'transparent',\n      outline: 'none',\n      width: '100%',\n\n      ...(INPUT_STYLES.size[size]?.input ?? {}),\n\n      ...(INPUT_STYLES.variant[variant]?.input ?? {}),\n      ...(INPUT_STYLES.state.default.input ?? {}),\n\n      ...(isDisabled ? INPUT_STYLES.state.disabled.input : {}),\n      ...(isInvalid ? INPUT_STYLES.state.invalid.input : {})\n    },\n\n    label: {\n      ...(INPUT_STYLES.size[size]?.label ?? {}),\n      ...(INPUT_STYLES.variant[variant]?.label ?? {}),\n\n      ...(isDisabled ? INPUT_STYLES.state.disabled.label : {})\n    },\n\n    error: {\n      display: 'block',\n\n      ...(INPUT_STYLES.size[size]?.error ?? {}),\n      ...(INPUT_STYLES.state.invalid.error ?? {})\n    },\n\n    button: {\n      display: 'flex',\n      alignItems: 'center',\n      justifyContent: 'center',\n      padding: '0.25rem',\n      cursor: 'pointer',\n\n      ...(INPUT_STYLES.variant[variant]?.button ?? {}),\n      ...(INPUT_STYLES.radius[radius] ?? {}),\n\n      ...(isDisabled ? { cursor: 'not-allowed', opacity: 0.5 } : {})\n    },\n\n    startContent: {\n      display: 'flex',\n      alignItems: 'center',\n      padding: '0.25rem'\n    }\n  })\n}\n","// External Libraries\nimport type React from 'react'\nimport { useId, useMemo } from 'react'\n\n// Components\nimport { Label } from '../../Label'\nimport { Icon } from '@components/toolkit/Icon'\n\n// Types\nimport type { InputProps } from './types'\n\n// Hooks\nimport { useInput } from './hooks/useInput'\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createInputStyles, INPUT_STYLES } from './styles'\n\nexport const Input: React.FC<InputProps> = props => {\n  // Hooks\n  const {\n    id,\n    type,\n    label,\n    width,\n    fullWidth,\n    required,\n    isDisabled,\n    minLength,\n    maxLength,\n    placeholder,\n    requiredColor,\n    labelColor,\n    labelWeight,\n    labelVariant,\n    startContent,\n    endContent,\n    errorMessage,\n    onChange,\n    value,\n    defaultValue,\n    size,\n    radius,\n    variant,\n    isInvalid,\n    ...nativeInputProps\n  } = props\n\n  const {\n    inputRef,\n    currentValue,\n    showPassword,\n    handleChange,\n    togglePasswordVisibility\n  } = useInput({\n    size,\n    value,\n    radius,\n    variant,\n    isInvalid,\n    fullWidth,\n    isDisabled,\n    defaultValue,\n    onChange\n  })\n\n  // Constants\n  const reactId = useId()\n  const inputId = useMemo(() => {\n    return id || `input-${reactId}`\n  }, [id, reactId])\n  const containerWidth = getWidth()\n\n  // Hooks\n  const { styles, classes } = useThemedStyles(props, createInputStyles, {\n    pick: p => [\n      p.size,\n      p.variant,\n      p.radius,\n      p.isDisabled,\n      p.isInvalid,\n      p.focusedRingColor\n    ],\n    override: props.styles,\n    applyCommonProps: true,\n    commonSlot: 'input'\n  })\n\n  // Functions\n  function getType() {\n    if (type === 'password' && showPassword) return 'text'\n    return type\n  }\n\n  function getWidth() {\n    if (fullWidth) return { width: '100%' }\n    if (width) return INPUT_STYLES.width[width] || { width: 'auto' }\n    return { width: 'auto' }\n  }\n\n  function renderLabel() {\n    if (!label) return null\n\n    return (\n      <div className=\"flex items-center gap-3\">\n        <Label\n          htmlFor={inputId}\n          label={label}\n          required={required}\n          styles={{ label: styles.label }}\n          requiredColor={requiredColor}\n          labelColor={labelColor}\n          labelWeight={labelWeight}\n          labelVariant={labelVariant}\n        />\n      </div>\n    )\n  }\n\n  function renderEndContent() {\n    return (\n      <>\n        {type === 'password' ? (\n          <button\n            type=\"button\"\n            style={styles.button}\n            onClick={togglePasswordVisibility}\n          >\n            {showPassword ? (\n              <Icon name={'general-eye-off'} />\n            ) : (\n              <Icon name={'general-eye'} />\n            )}\n          </button>\n        ) : (\n          endContent\n        )}\n      </>\n    )\n  }\n\n  return (\n    <div style={containerWidth}>\n      {renderLabel()}\n      <div style={styles.wrapper} className={classes.wrapper}>\n        {startContent && <div style={styles.startContent}>{startContent}</div>}\n        <div style={{ flex: 1 }}>\n          <input\n            ref={inputRef}\n            id={inputId}\n            type={getType()}\n            value={currentValue}\n            style={styles.input}\n            className={classes.input}\n            disabled={isDisabled}\n            minLength={minLength}\n            maxLength={maxLength}\n            placeholder={placeholder ?? 'Digite aqui...'}\n            onChange={handleChange}\n            {...nativeInputProps}\n          />\n        </div>\n        {renderEndContent() && <div>{renderEndContent()}</div>}\n      </div>\n\n      {errorMessage ? <div style={styles.error}>{errorMessage}</div> : null}\n    </div>\n  )\n}\n"],"mappings":"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"}

package/dist/Label-QQpNWSeV.js

@@ -1,79 +0,0 @@
-import { n as styled, t as useThemedStyles } from "./useThemedStyles-3rUXJYgS.js";
-import { t as Typography } from "./Typography-BE-vQSfx.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-
-//#region src/components/commons/Label/style.ts
-const LABEL_VARIANTS = {
-	b1: {
-		fontSize: "1rem",
-		lineHeight: "1.5rem"
-	},
-	b2: {
-		fontSize: "0.875rem",
-		lineHeight: "1.25rem"
-	},
-	b3: {
-		fontSize: "0.75rem",
-		lineHeight: "1rem"
-	}
-};
-function createLabelStyles(props) {
-	const { labelColor, labelWeight, labelVariant = "b2", requiredColor } = props;
-	return styled({
-		label: {
-			display: "inline-flex",
-			alignItems: "center",
-			gap: "0.25rem",
-			fontWeight: labelWeight,
-			...LABEL_VARIANTS[labelVariant] ?? {},
-			...labelColor ? { color: labelColor } : {}
-		},
-		required: {
-			color: requiredColor,
-			lineHeight: "inherit",
-			fontSize: "inherit",
-			fontWeight: "inherit"
-		}
-	});
-}
-
-//#endregion
-//#region src/components/commons/Label/index.tsx
-const Label = (props) => {
-	const { htmlFor, label, required, requiredColor, labelColor, labelWeight, labelVariant = "b2" } = props;
-	const { styles } = useThemedStyles(props, createLabelStyles, {
-		pick: (p) => [
-			p.labelColor,
-			p.labelWeight,
-			p.labelVariant,
-			p.requiredColor
-		],
-		override: props.styles,
-		applyCommonProps: true
-	});
-	return /* @__PURE__ */ jsx("label", {
-		htmlFor,
-		style: styles.label,
-		children: /* @__PURE__ */ jsxs(Typography, {
-			variant: labelVariant,
-			styles: { text: {
-				minWidth: "fit-content",
-				color: labelColor,
-				fontWeight: labelWeight
-			} },
-			children: [label, required ? /* @__PURE__ */ jsx(Typography, {
-				as: "span",
-				variant: "b2",
-				styles: { text: {
-					color: requiredColor,
-					marginLeft: "0.125rem"
-				} },
-				children: "*"
-			}) : null]
-		})
-	});
-};
-
-//#endregion
-export { Label as t };
-//# sourceMappingURL=Label-QQpNWSeV.js.map

package/dist/Label-QQpNWSeV.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Label-QQpNWSeV.js","names":["LABEL_VARIANTS: Record<string, CSSProperties>"],"sources":["../src/components/commons/Label/style.ts","../src/components/commons/Label/index.tsx"],"sourcesContent":["// External libraries\nimport type { CSSProperties } from 'react'\n\n// Types\nimport type { LabelProps } from './types'\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nconst LABEL_VARIANTS: Record<string, CSSProperties> = {\n  b1: {\n    fontSize: '1rem',\n    lineHeight: '1.5rem'\n  },\n  b2: {\n    fontSize: '0.875rem',\n    lineHeight: '1.25rem'\n  },\n  b3: {\n    fontSize: '0.75rem',\n    lineHeight: '1rem'\n  }\n}\n\nexport function createLabelStyles(props: LabelProps): StyleMap {\n  const { labelColor, labelWeight, labelVariant = 'b2', requiredColor } = props\n\n  return styled({\n    label: {\n      display: 'inline-flex',\n      alignItems: 'center',\n      gap: '0.25rem',\n      fontWeight: labelWeight,\n\n      ...(LABEL_VARIANTS[labelVariant] ?? {}),\n\n      ...(labelColor ? { color: labelColor } : {})\n    },\n\n    required: {\n      color: requiredColor,\n      lineHeight: 'inherit',\n      fontSize: 'inherit',\n      fontWeight: 'inherit'\n    }\n  })\n}\n","// Components\nimport { Typography } from '@components/toolkit/Typography'\n\n// Types\nimport type { LabelProps } from './types'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createLabelStyles } from './style'\n\nexport const Label = (props: LabelProps) => {\n  const {\n    htmlFor,\n    label,\n    required,\n    requiredColor,\n    labelColor,\n    labelWeight,\n    labelVariant = 'b2',\n  } = props\n\n  const { styles } = useThemedStyles(props, createLabelStyles, {\n    pick: p => [p.labelColor, p.labelWeight, p.labelVariant, p.requiredColor],\n    override: props.styles,\n    applyCommonProps: true,\n  })\n\n  return (\n    <label htmlFor={htmlFor} style={styles.label}>\n      <Typography\n        variant={labelVariant}\n        styles={{\n          text: {\n            minWidth: 'fit-content',\n            color: labelColor,\n            fontWeight: labelWeight,\n          },\n        }}\n      >\n        {label}\n\n        {required ? (\n          <Typography\n            as=\"span\"\n            variant=\"b2\"\n            styles={{ text: { color: requiredColor, marginLeft: '0.125rem' } }}\n          >\n            *\n          </Typography>\n        ) : null}\n      </Typography>\n    </label>\n  )\n}\n"],"mappings":";;;;;AAOA,MAAMA,iBAAgD;CACpD,IAAI;EACF,UAAU;EACV,YAAY;EACb;CACD,IAAI;EACF,UAAU;EACV,YAAY;EACb;CACD,IAAI;EACF,UAAU;EACV,YAAY;EACb;CACF;AAED,SAAgB,kBAAkB,OAA6B;CAC7D,MAAM,EAAE,YAAY,aAAa,eAAe,MAAM,kBAAkB;AAExE,QAAO,OAAO;EACZ,OAAO;GACL,SAAS;GACT,YAAY;GACZ,KAAK;GACL,YAAY;GAEZ,GAAI,eAAe,iBAAiB,EAAE;GAEtC,GAAI,aAAa,EAAE,OAAO,YAAY,GAAG,EAAE;GAC5C;EAED,UAAU;GACR,OAAO;GACP,YAAY;GACZ,UAAU;GACV,YAAY;GACb;EACF,CAAC;;;;;AC/BJ,MAAa,SAAS,UAAsB;CAC1C,MAAM,EACJ,SACA,OACA,UACA,eACA,YACA,aACA,eAAe,SACb;CAEJ,MAAM,EAAE,WAAW,gBAAgB,OAAO,mBAAmB;EAC3D,OAAM,MAAK;GAAC,EAAE;GAAY,EAAE;GAAa,EAAE;GAAc,EAAE;GAAc;EACzE,UAAU,MAAM;EAChB,kBAAkB;EACnB,CAAC;AAEF,QACE,oBAAC;EAAe;EAAS,OAAO,OAAO;YACrC,qBAAC;GACC,SAAS;GACT,QAAQ,EACN,MAAM;IACJ,UAAU;IACV,OAAO;IACP,YAAY;IACb,EACF;cAEA,OAEA,WACC,oBAAC;IACC,IAAG;IACH,SAAQ;IACR,QAAQ,EAAE,MAAM;KAAE,OAAO;KAAe,YAAY;KAAY,EAAE;cACnE;KAEY,GACX;IACO;GACP"}

package/dist/TabSwitch-De30bFX2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TabSwitch-De30bFX2.js","names":[],"sources":["../src/components/toolkit/TabSwitch/components/TabSwitchItem/styles.ts","../src/components/toolkit/TabSwitch/components/TabSwitchItem/index.tsx","../src/components/toolkit/TabSwitch/styles.ts","../src/components/toolkit/TabSwitch/index.tsx"],"sourcesContent":["// External Libraries\nimport { styled, type StyleMap } 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): StyleMap {\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/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      <Typography variant=\"b1\" fontWeight=\"bold\">\n        {option.label}\n      </Typography>\n    </button>\n  )\n}\n","// Types\nimport type { TabSwitchProps } from './types'\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createTabSwitchStyles<T>(props: TabSwitchProps<T>): StyleMap {\n  const { fitContent } = props\n\n  return styled({\n    container: {\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'center',\n      color: 'var(--px-text-primary, #4b5563)',\n      width: fitContent ? 'fit-content' : '100%',\n      borderBottom: '1px solid var(--px-border-primaryder, #e5e7eb)',\n      gap: 0,\n      __rules: { '& svg': { zIndex: 1 } }\n    }\n  })\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 * 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,iBACmB;CACnB,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;GAEJ,oBAAC;IAAW,SAAQ;IAAK,YAAW;cACjC,OAAO;KACG;;GACN;;;;;ACzDb,SAAgB,sBAAyB,OAAoC;CAC3E,MAAM,EAAE,eAAe;AAEvB,QAAO,OAAO,EACZ,WAAW;EACT,SAAS;EACT,eAAe;EACf,YAAY;EACZ,OAAO;EACP,OAAO,aAAa,gBAAgB;EACpC,cAAc;EACd,KAAK;EACL,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE;EACpC,EACF,CAAC;;;;;ACJJ,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-CpIx36BV.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"TextArea-CpIx36BV.js","names":[],"sources":["../src/components/commons/inputs/TextArea/styles.ts","../src/components/commons/inputs/TextArea/index.tsx"],"sourcesContent":["// Types\nimport { styled, type StyleMap } from '@hooks/useThemedStyles/types'\nimport type { TextAreaProps } from './types'\n\nexport function createTextAreaStyles(props: TextAreaProps): StyleMap {\n  const { height = '8rem', readOnly, startIcon } = props\n\n  const focusRingColor = props.focusedRingColor || 'var(--px-color-info)'\n  const placeHolderColor =\n    props.placeholderColor || 'var(--px-text-placeholder)'\n\n  return styled({\n    iconContainer: {\n      position: 'absolute',\n      left: '0.75rem',\n      top: '1.375rem',\n      transform: 'translateY(-50%)'\n    },\n    textArea: {\n      height,\n      width: '100%',\n      paddingBlock: '0.75rem',\n      paddingInline: '0.875rem',\n      borderRadius: '0.5rem',\n      resize: 'none',\n\n      fontWeight: '400',\n      fontSize: '1rem',\n      color: 'var(--px-text-primary)',\n\n      border: '1px solid red',\n      outlineOffset: '-1px',\n\n      cursor: readOnly ? 'default' : undefined,\n      paddingLeft: startIcon ? '2.5rem' : undefined,\n\n      __rules: {\n        '&::placeholder': {\n          color: `${placeHolderColor}`\n        },\n        '&:focus': readOnly\n          ? { outline: 'none' }\n          : { outline: `2px solid ${focusRingColor}` }\n      }\n    }\n  })\n}\n","// External Libraries\nimport { useId } from 'react'\n\n// Types\nimport type { TextAreaProps } from './types'\n\n// Components\nimport { Label } from '@components/commons/Label'\nimport { Icon } from '@components/toolkit/Icon'\nimport { Typography } from '@components/toolkit/Typography'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createTextAreaStyles } from './styles'\n\nexport const TextArea = (props: TextAreaProps) => {\n  const {\n    value,\n    disabled,\n    readOnly,\n    maxLength,\n    hideMaxLength,\n    textMaxLength,\n    placeholder,\n\n    label,\n    required,\n    requiredColor,\n    labelColor,\n    labelWeight,\n    labelVariant,\n\n    startIcon,\n    iconColor\n  } = props\n\n  // Hooks\n  const inputId = useId()\n\n  const { styles, classes } = useThemedStyles(props, createTextAreaStyles, {\n    pick: p => [\n      p.height,\n      p.readOnly,\n      p.startIcon,\n      p.placeholderColor,\n      p.focusedRingColor\n    ],\n    override: props.styles,\n    applyCommonProps: true\n  })\n\n  // Functions\n  function handleChange(e: React.ChangeEvent<HTMLTextAreaElement>) {\n    if (disabled || readOnly) return\n    props.onChange?.(e.target.value)\n  }\n\n  function renderLabel() {\n    if (!label) return null\n\n    return (\n      <div className=\"flex items-center gap-3\">\n        <Label\n          htmlFor={inputId}\n          label={label}\n          required={required}\n          requiredColor={requiredColor}\n          labelColor={labelColor}\n          labelWeight={labelWeight}\n          labelVariant={labelVariant}\n        />\n      </div>\n    )\n  }\n\n  return (\n    <div>\n      {renderLabel()}\n\n      <div style={{ position: 'relative' }}>\n        {startIcon && (\n          <div style={styles.iconContainer}>\n            <Icon\n              name={startIcon}\n              color={iconColor ? iconColor : 'var(--px-text-primary)'}\n            />\n          </div>\n        )}\n\n        <textarea\n          value={value}\n          disabled={disabled}\n          readOnly={readOnly}\n          maxLength={maxLength}\n          placeholder={placeholder}\n          style={styles.textArea}\n          className={classes.textArea}\n          onChange={handleChange}\n        />\n      </div>\n\n      {maxLength && !hideMaxLength ? (\n        <Typography variant=\"b2\" styles={{ text: { marginLeft: 'auto' } }}>\n          {value.length}/{maxLength} {textMaxLength}\n        </Typography>\n      ) : null}\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;AAIA,SAAgB,qBAAqB,OAAgC;CACnE,MAAM,EAAE,SAAS,QAAQ,UAAU,cAAc;CAEjD,MAAM,iBAAiB,MAAM,oBAAoB;CACjD,MAAM,mBACJ,MAAM,oBAAoB;AAE5B,QAAO,OAAO;EACZ,eAAe;GACb,UAAU;GACV,MAAM;GACN,KAAK;GACL,WAAW;GACZ;EACD,UAAU;GACR;GACA,OAAO;GACP,cAAc;GACd,eAAe;GACf,cAAc;GACd,QAAQ;GAER,YAAY;GACZ,UAAU;GACV,OAAO;GAEP,QAAQ;GACR,eAAe;GAEf,QAAQ,WAAW,YAAY;GAC/B,aAAa,YAAY,WAAW;GAEpC,SAAS;IACP,kBAAkB,EAChB,OAAO,GAAG,oBACX;IACD,WAAW,WACP,EAAE,SAAS,QAAQ,GACnB,EAAE,SAAS,aAAa,kBAAkB;IAC/C;GACF;EACF,CAAC;;;;;AC5BJ,MAAa,YAAY,UAAyB;CAChD,MAAM,EACJ,OACA,UACA,UACA,WACA,eACA,eACA,aAEA,OACA,UACA,eACA,YACA,aACA,cAEA,WACA,cACE;CAGJ,MAAM,UAAU,OAAO;CAEvB,MAAM,EAAE,QAAQ,YAAY,gBAAgB,OAAO,sBAAsB;EACvE,OAAM,MAAK;GACT,EAAE;GACF,EAAE;GACF,EAAE;GACF,EAAE;GACF,EAAE;GACH;EACD,UAAU,MAAM;EAChB,kBAAkB;EACnB,CAAC;CAGF,SAAS,aAAa,GAA2C;AAC/D,MAAI,YAAY,SAAU;AAC1B,QAAM,WAAW,EAAE,OAAO,MAAM;;CAGlC,SAAS,cAAc;AACrB,MAAI,CAAC,MAAO,QAAO;AAEnB,SACE,oBAAC;GAAI,WAAU;aACb,oBAAC;IACC,SAAS;IACF;IACG;IACK;IACH;IACC;IACC;KACd;IACE;;AAIV,QACE,qBAAC;EACE,aAAa;EAEd,qBAAC;GAAI,OAAO,EAAE,UAAU,YAAY;cACjC,aACC,oBAAC;IAAI,OAAO,OAAO;cACjB,oBAAC;KACC,MAAM;KACN,OAAO,YAAY,YAAY;MAC/B;KACE,EAGR,oBAAC;IACQ;IACG;IACA;IACC;IACE;IACb,OAAO,OAAO;IACd,WAAW,QAAQ;IACnB,UAAU;KACV;IACE;EAEL,aAAa,CAAC,gBACb,qBAAC;GAAW,SAAQ;GAAK,QAAQ,EAAE,MAAM,EAAE,YAAY,QAAQ,EAAE;;IAC9D,MAAM;IAAO;IAAE;IAAU;IAAE;;IACjB,GACX;KACA"}

package/dist/ThemeContext-Dro_peJg.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ThemeContext-Dro_peJg.js","names":["result: any","out: any","defaultThemes: ThemeRegistry","ThemeProvider: React.FC<ThemeProviderProps>"],"sources":["../src/utils/functions/deepMerge.ts","../src/contexts/ThemeContext/constants.ts","../src/contexts/ThemeContext/utils/general.ts","../src/contexts/ThemeContext/utils/themeToCSSVars.ts","../src/contexts/ThemeContext/index.tsx"],"sourcesContent":["/** biome-ignore-all lint/suspicious/noExplicitAny: <Not needed> */\nexport type DeepPartial<T> = {\n  [P in keyof T]?: T[P] extends Array<infer U>\n    ? Array<DeepPartial<U>>\n    : T[P] extends object\n      ? DeepPartial<T[P]>\n      : T[P]\n}\n\nexport function deepMerge<T>(base: T, override?: DeepPartial<T>): T {\n  if (override === undefined) return clone(base)\n\n  if (!isPlainObject(base) || !isPlainObject(override)) {\n    return clone(override as T)\n  }\n\n  const result: any = Array.isArray(base) ? [] : {}\n\n  const baseKeys = Object.keys(base as any) as (keyof T)[]\n  const overrideKeys = Object.keys(override as any) as (keyof T)[]\n\n  const allKeys = Array.from(new Set([...baseKeys, ...overrideKeys]))\n\n  for (const k of allKeys) {\n    const baseVal = (base as any)[k]\n    const overrideVal = (override as any)[k]\n\n    if (overrideVal === undefined) {\n      result[k] = clone(baseVal)\n      continue\n    }\n\n    if (isPlainObject(baseVal) && isPlainObject(overrideVal)) {\n      result[k] = deepMerge(baseVal, overrideVal)\n      continue\n    }\n\n    result[k] = clone(overrideVal)\n  }\n\n  return result as T\n}\n\nfunction isPlainObject(x: any): x is Record<string, any> {\n  return !!x && typeof x === 'object' && !Array.isArray(x)\n}\n\nfunction clone<T>(v: T): T {\n  if (v === undefined || v === null) return v\n  if (Array.isArray(v)) return v.map(item => clone(item)) as unknown as T\n  if (isPlainObject(v)) {\n    const out: any = {}\n    for (const k of Object.keys(v)) out[k] = clone((v as any)[k])\n    return out\n  }\n  return v\n}\n","// theme/defaultThemes.ts\nimport type { ThemeRegistry } from './types'\n\nconst COMMON_MAP = {\n  spacing: {\n    xs: '0.25rem', // 4px\n    sm: '0.5rem', // 8px\n    md: '1rem', // 16px\n    lg: '1.5rem', // 24px\n    xl: '2rem', // 32px\n    '2xl': '3rem' // 48px\n  },\n  borderRadius: {\n    none: '0rem', // 0px\n    sm: '0.25rem', // 4px\n    md: '0.375rem', // 6px\n    lg: '0.5rem', // 8px\n    full: '9999rem' // \"infinite\" radius equivalent\n  },\n  fontSize: {\n    xs: '0.75rem', // 12px\n    sm: '0.875rem', // 14px\n    md: '1rem', // 16px\n    lg: '1.125rem', // 18px\n    xl: '1.25rem', // 20px\n    '2xl': '1.5rem' // 24px\n  },\n  fontWeight: { normal: 400, medium: 500, semibold: 600, bold: 700 }\n} as const\n\nexport const defaultThemes: ThemeRegistry = {\n  light: {\n    colors: {\n      scrollbar: '#0000001a',\n      disabled: '#D5D7DA',\n\n      primary: '#0EB24C',\n      secondary: '#6C6C6C',\n      success: '#0EB24C',\n      warning: '#f59e0b',\n      error: '#ef4444',\n      invalid: '#f87171',\n      info: '#06b6d4',\n\n      background: {\n        primary: '#FFFFFF',\n        card: {\n          primary: '#F4F4F4',\n          secondary: '#F3F6F9'\n        }\n      },\n      button: {\n        filled: {\n          label: '#FFFFFF',\n          background: '#0EB24C'\n        },\n\n        outlined: {\n          label: '#222222',\n          borderColor: '#DDDDDD'\n        },\n\n        ghost: {\n          label: '#6C6C6C'\n        }\n      },\n\n      surface: '#FBFBFB',\n      border: {\n        primary: '#E8E8E9',\n        secondary: '#E8E8E9'\n      },\n\n      text: {\n        primary: '#222222',\n        secondary: '#6C6C6C',\n        disabled: '#A0A0A0',\n        inverse: '#FFFFFF'\n      }\n    },\n\n    ...COMMON_MAP,\n\n    shadows: {\n      sm: '0 1px 2px 0 rgba(0, 0, 0, 0.05)',\n      md: '0 4px 6px -1px rgba(0, 0, 0, 0.10)',\n      lg: '0 10px 15px -3px rgba(0, 0, 0, 0.10)',\n      xl: '0 20px 25px -5px rgba(0, 0, 0, 0.10)'\n    }\n  },\n\n  dark: {\n    colors: {\n      scrollbar: '#858585',\n      disabled: '#D5D7DA',\n\n      primary: '#0EB24C', // brand se mantém (ou pode clarear depois)\n      secondary: '#C7CFD8',\n      success: '#0EB24C',\n      warning: '#f59e0b',\n      error: '#ef4444',\n      invalid: '#f87171',\n      info: '#06b6d4',\n\n      background: {\n        primary: '#090909',\n        card: {\n          primary: '#F4F4F4',\n          secondary: '#202020'\n        }\n      },\n      button: {\n        filled: {\n          label: '#FFFFFF',\n          background: '#0EB24C'\n        },\n\n        outlined: {\n          label: '#ECECEC',\n          borderColor: '#DDDDDD'\n        },\n\n        ghost: {\n          label: '#6C6C6C'\n        }\n      },\n\n      surface: '#090909',\n\n      border: {\n        primary: '#27282D',\n        secondary: '#27282D'\n      },\n\n      text: {\n        primary: '#ECECEC',\n        secondary: '#C7CFD8',\n        disabled: '#8B93A0',\n        inverse: '#090909'\n      }\n    },\n\n    ...COMMON_MAP,\n\n    shadows: {\n      sm: '0 1px 2px 0 rgba(0, 0, 0, 0.35)',\n      md: '0 4px 6px -1px rgba(0, 0, 0, 0.45)',\n      lg: '0 10px 15px -3px rgba(0, 0, 0, 0.50)',\n      xl: '0 20px 25px -5px rgba(0, 0, 0, 0.55)'\n    }\n  }\n}\n","// Utils\n/** biome-ignore-all lint/suspicious/noExplicitAny: <Not needed> */\nimport { deepMerge } from '@utils/functions'\nimport { defaultThemes } from '../constants'\n\n// Types\nimport type { ThemeMode, ThemeRegistry, ThemeTokens } from '../types'\n\n/**\n * Theme Utilities\n * ===============\n * Small DOM utilities used by the ThemeProvider to:\n * - toggle dark mode class for Tailwind compatibility\n * - inject CSS variables (`--px-*`) into the document root\n * - read/watch the OS/browser theme preference (`prefers-color-scheme`)\n *\n * These helpers are:\n * - **client-safe** (guarded for SSR)\n * - **framework-agnostic** (only touch `documentElement`)\n * - **tiny** (no dependencies)\n */\n\n/**\n * CSSVarMap\n * ---------\n * A map of CSS custom properties to be applied on the document root.\n *\n * Notes:\n * - Keys must be valid CSS variable names (e.g. `\"--px-bg\"`, `\"--px-text-primary\"`).\n * - Values can be strings or numbers.\n *   - If you store numbers (e.g. 16), you decide at consumption time whether it means px.\n *\n * You can keep it generic:\n *   Record<`--${string}`, string | number>\n *\n * Or restrict to your library prefix:\n *   Record<`--px-${string}`, string | number>\n */\nexport type CSSVarMap = Partial<Record<`--${string}`, string | number>>\n\n/**\n * applyThemeClass(themeName)\n * -------------------------\n * Applies the light/dark mode class to the `<html>` element.\n *\n * Tailwind’s dark mode (in the common \"class\" strategy) typically relies on a\n * `.dark` class. This function toggles ONLY the `dark` class:\n *\n * - themeName `\"dark\"`  => adds `.dark`\n * - themeName `\"light\"` => removes `.dark`\n *\n * SSR:\n * - No-op on the server (when `document` is undefined).\n */\nexport function applyThemeClass(themeName: 'light' | 'dark') {\n  if (typeof document === 'undefined') return\n  const root = document.documentElement\n  root.classList.toggle('dark', themeName === 'dark')\n}\n\n/**\n * applyCssVars(vars)\n * ------------------\n * Injects CSS variables into the document root (`<html>`).\n *\n * This is how the library exposes theme tokens as CSS variables.\n * Components can then use `var(--px-...)` in styles.\n *\n * Example:\n * ```ts\n * applyCssVars({ '--px-bg': '#fff', '--px-text-primary': '#111' })\n * ```\n *\n * Behavior:\n * - Ignores `null` / `undefined` values.\n * - Converts all values to string before applying.\n *\n * SSR:\n * - No-op on the server (when `document` is undefined).\n */\nexport function applyCssVars(vars: CSSVarMap) {\n  if (typeof document === 'undefined') return\n  const root = document.documentElement\n\n  for (const [key, value] of Object.entries(vars)) {\n    if (value == null) continue\n    root.style.setProperty(key, String(value))\n  }\n}\n\n/**\n * getSystemThemeName()\n * --------------------\n * Returns the current OS/browser color scheme preference.\n *\n * It reads `prefers-color-scheme: dark` using `window.matchMedia`.\n *\n * Returns:\n * - `\"dark\"` if the user prefers dark mode\n * - `\"light\"` otherwise\n *\n * SSR:\n * - Returns `\"light\"` on the server (safe default).\n */\nexport function getSystemThemeName(): 'light' | 'dark' {\n  if (typeof window === 'undefined') return 'light'\n  const prefersDark =\n    window.matchMedia?.('(prefers-color-scheme: dark)').matches ?? false\n  return prefersDark ? 'dark' : 'light'\n}\n\n/**\n * watchSystemTheme(onChange)\n * --------------------------\n * Subscribes to changes in OS/browser theme preference.\n *\n * Use this when your selected mode is `\"system\"` so the app immediately reacts\n * when the user changes their OS theme.\n *\n * - Calls `onChange('light' | 'dark')` whenever the preference changes.\n * - Returns an `unsubscribe()` function.\n *\n * Implementation details:\n * - Uses `matchMedia('(prefers-color-scheme: dark)')`.\n * - Supports both modern `addEventListener('change', ...)` and legacy Safari\n *   `addListener(...)` APIs.\n *\n * SSR:\n * - Returns a no-op unsubscribe function on the server.\n */\nexport function watchSystemTheme(onChange: (name: 'light' | 'dark') => void) {\n  if (typeof window === 'undefined') return () => {}\n\n  const mq = window.matchMedia('(prefers-color-scheme: dark)')\n\n  const handler = () => onChange(mq.matches ? 'dark' : 'light')\n\n  handler()\n\n  if (mq.addEventListener) {\n    mq.addEventListener('change', handler)\n    return () => mq.removeEventListener('change', handler)\n  }\n\n  mq.addListener(handler as any)\n  return () => mq.removeListener(handler as any)\n}\n\n/**\n * Resolves an effective theme name from a mode.\n */\nexport function resolveName(mode: ThemeMode): string {\n  if (mode !== 'system') return mode\n  return getSystemThemeName()\n}\n\n/**\n * Builds a registry of user theme patches.\n */\nexport function buildRegistry(\n  userThemes?: Partial<ThemeRegistry>\n): ThemeRegistry {\n  return {\n    light: {},\n    dark: {},\n    ...(userThemes ?? {})\n  } as ThemeRegistry\n}\n\n/**\n * Builds the final resolved theme tokens.\n */\nexport function buildTheme(\n  registry: ThemeRegistry,\n  resolvedName: string,\n  override?: Partial<ThemeTokens>\n): ThemeTokens {\n  const base: ThemeTokens =\n    resolvedName === 'dark'\n      ? (defaultThemes.dark as ThemeTokens)\n      : (defaultThemes.light as ThemeTokens)\n\n  const selectedPatch = (registry[resolvedName] ?? registry.light) as any\n\n  const merged = deepMerge(base, selectedPatch)\n  return deepMerge(merged, override)\n}\n\nexport function isThemeMode(value: unknown): value is ThemeMode {\n  return typeof value === 'string' && value.length > 0\n}\n\nexport function getLocalStorageSafe(): Storage | null {\n  if (typeof window === 'undefined') return null\n  try {\n    return window.localStorage\n  } catch {\n    return null\n  }\n}\n","// Types\nimport type { CSSVarMap } from './general'\nimport type { ThemeTokens } from '../types'\n\n/**\n * themeToCssVars(theme)\n * ---------------------\n * Converts a resolved `ThemeTokens` object into a CSS variable map (`CSSVarMap`).\n *\n * The ThemeProvider uses this function to inject `--px-*` variables into the\n * document root (`<html>`). Components can then rely on stable CSS variables,\n * making them framework-agnostic and compatible with Tailwind (via `.dark`).\n *\n * Why CSS variables?\n * - They are fast (native to the browser)\n * - They work across any styling strategy (inline styles, CSS modules, Tailwind, etc.)\n * - They enable dynamic theme switching without rerendering every component\n *\n * Requirements / Assumptions:\n * - The input `theme` must be **fully resolved** (i.e. complete `ThemeTokens`).\n *   The ThemeProvider is responsible for merging partial theme patches on top\n *   of a complete base theme (light/dark defaults).\n *\n * Variable naming:\n * - All variables are prefixed with `--px-` to avoid collisions.\n * - Tokens are grouped by category (colors, surfaces, borders, text, spacing, radius, typography, shadows).\n *\n * Notes:\n * - Spacing/radius/fontSize tokens are stored as numbers (e.g. `16`), which is valid\n *   for CSS variables. When consuming them, you can:\n *   - append `px` in JS (`${var}px`), or\n *   - store them as strings here (e.g. `\"16px\"`) if you prefer.\n *\n * Example usage (component styles):\n * ```ts\n * const styles = {\n *   background: 'var(--px-bg)',\n *   color: 'var(--px-text-primary)',\n *   borderColor: 'var(--px-border-primary)',\n * }\n * ```\n *\n * Example usage (Tailwind config / CSS):\n * ```css\n * .card {\n *   background: var(--px-surface);\n *   color: var(--px-text-primary);\n *   border: 1px solid var(--px-border-primary);\n * }\n * ```\n */\nexport function themeToCssVars(theme: ThemeTokens): CSSVarMap {\n  return {\n    /**\n     * Brand & intent colors\n     */\n    '--px-color-primary': theme.colors.primary,\n    '--px-color-secondary': theme.colors.secondary,\n    '--px-color-success': theme.colors.success,\n    '--px-color-warning': theme.colors.warning,\n    '--px-color-error': theme.colors.error,\n    '--px-color-invalid': theme.colors.invalid,\n    '--px-color-info': theme.colors.info,\n    '--px-color-disabled': theme.colors.disabled,\n\n    /**\n     * Scrollbar\n     */\n    '--px-scrollbar': theme.colors.scrollbar,\n\n    /**\n     * Surfaces / backgrounds\n     */\n    '--px-bg': theme.colors.background.primary,\n    '--px-surface': theme.colors.surface,\n    '--px-background-card-primary': theme.colors.background.card.primary,\n    '--px-background-card-secondary': theme.colors.background.card.secondary,\n\n    /**\n     * Borders\n     * -------\n     * Divider and outline colors.\n     */\n    '--px-border-primary': theme.colors.border.primary,\n    '--px-border-secondary': theme.colors.border.secondary,\n\n    /**\n     * Text\n     * ----\n     * Text colors for different emphasis levels.\n     */\n    '--px-text-primary': theme.colors.text.primary,\n    '--px-text-secondary': theme.colors.text.secondary,\n    '--px-text-disabled': theme.colors.text.disabled,\n    '--px-text-inverse': theme.colors.text.inverse,\n\n    /**\n     * Buttons – Filled\n     * ----------------\n     * Filled button colors\n     */\n    '--px-btn-filled-bg': theme.colors.button.filled.background,\n    '--px-btn-filled-label': theme.colors.button.filled.label,\n\n    /**\n     * Buttons – Outlined\n     * ------------------\n     * Outlined button colors\n     */\n    '--px-btn-outlined-border': theme.colors.button.outlined.borderColor,\n    '--px-btn-outlined-label': theme.colors.button.outlined.label,\n\n    /**\n     * Buttons – Ghost\n     * --------------\n     * Ghost button colors\n     */\n    '--px-btn-ghost-label': theme.colors.button.ghost.label,\n    /**\n     * Spacing\n     * -------------\n     * Numeric spacing tokens (commonly used as px).\n     */\n    '--px-space-xs': theme.spacing.xs,\n    '--px-space-sm': theme.spacing.sm,\n    '--px-space-md': theme.spacing.md,\n    '--px-space-lg': theme.spacing.lg,\n    '--px-space-xl': theme.spacing.xl,\n    '--px-space-2xl': theme.spacing['2xl'],\n\n    /**\n     * Border radius scale\n     * -------------------\n     * Numeric radius tokens (commonly used as px).\n     */\n    '--px-radius-none': theme.borderRadius.none,\n    '--px-radius-sm': theme.borderRadius.sm,\n    '--px-radius-md': theme.borderRadius.md,\n    '--px-radius-lg': theme.borderRadius.lg,\n    '--px-radius-full': theme.borderRadius.full,\n\n    /**\n     * Typography scale\n     * ----------------\n     * Font sizes and font weights.\n     */\n    '--px-fs-xs': theme.fontSize.xs,\n    '--px-fs-sm': theme.fontSize.sm,\n    '--px-fs-md': theme.fontSize.md,\n    '--px-fs-lg': theme.fontSize.lg,\n    '--px-fs-xl': theme.fontSize.xl,\n    '--px-fs-2xl': theme.fontSize['2xl'],\n\n    '--px-fw-normal': theme.fontWeight.normal,\n    '--px-fw-medium': theme.fontWeight.medium,\n    '--px-fw-semibold': theme.fontWeight.semibold,\n    '--px-fw-bold': theme.fontWeight.bold,\n\n    /**\n     * Shadows\n     * -------\n     * CSS shadow strings for elevation.\n     */\n    '--px-shadow-sm': theme.shadows.sm,\n    '--px-shadow-md': theme.shadows.md,\n    '--px-shadow-lg': theme.shadows.lg,\n    '--px-shadow-xl': theme.shadows.xl\n  }\n}\n","/** biome-ignore-all lint/suspicious/noExplicitAny: <Not needed> */\n\n'use client'\n\n// External Libraries\nimport {\n  useMemo,\n  useState,\n  useEffect,\n  useContext,\n  createContext,\n  useLayoutEffect\n} from 'react'\n\n// Utils\nimport {\n  buildTheme,\n  isThemeMode,\n  resolveName,\n  applyCssVars,\n  buildRegistry,\n  themeToCssVars,\n  applyThemeClass,\n  watchSystemTheme,\n  getLocalStorageSafe\n} from './utils'\n\n// Types\nimport type { ThemeMode, ThemeContextData, ThemeProviderProps } from './types'\n\nexport * from './types'\n\nconst ThemeContext = createContext<ThemeContextData | null>(null)\n\n/**\n * useIsomorphicLayoutEffect\n * - On client: runs before paint (layout effect)\n * - On server: falls back to useEffect (no warnings)\n */\nconst useIsomorphicLayoutEffect =\n  typeof window !== 'undefined' ? useLayoutEffect : useEffect\n\nexport const ThemeProvider: React.FC<ThemeProviderProps> = ({\n  themes,\n  children,\n  override,\n  persistence,\n  persist = false,\n  defaultMode = 'system',\n  storageKey = 'px-theme',\n  fallback = null\n}) => {\n  const registry = useMemo(() => buildRegistry(themes), [themes])\n\n  function makeInitialMode(): ThemeMode {\n    if (persistence) {\n      try {\n        const saved = persistence.get()\n        return (saved ?? defaultMode) as ThemeMode\n      } catch {\n        return defaultMode\n      }\n    }\n\n    const ls = getLocalStorageSafe()\n    if (!ls) return defaultMode\n    const raw = ls.getItem(storageKey)?.replaceAll('\"', '')\n    return isThemeMode(raw) ? raw : defaultMode\n  }\n\n  const [mode, setMode] = useState<ThemeMode>(makeInitialMode)\n\n  /**\n   * Gate: only render children after we applied class + vars at least once.\n   * This prevents \"unstyled flash\" for your components.\n   */\n  const [isReady, setReady] = useState(false)\n\n  const resolvedName = useMemo(() => {\n    if (typeof window === 'undefined') return mode === 'system' ? 'light' : mode\n    return resolveName(mode)\n  }, [mode])\n\n  const theme = useMemo(\n    () => buildTheme(registry, resolvedName, override),\n    [registry, resolvedName, override]\n  )\n\n  // keep in sync with OS when mode === \"system\"\n  useEffect(() => {\n    if (typeof window === 'undefined') return\n    if (mode !== 'system') return\n\n    return watchSystemTheme(() => {\n      setMode('system')\n    })\n  }, [mode])\n\n  /**\n   * Apply theme BEFORE paint (client) and then unlock rendering.\n   */\n  useIsomorphicLayoutEffect(() => {\n    if (typeof window === 'undefined') return\n\n    applyThemeClass(resolvedName === 'dark' ? 'dark' : 'light')\n    applyCssVars(themeToCssVars(theme))\n\n    // unlock after first successful application\n    setReady(true)\n  }, [resolvedName, theme])\n\n  /**\n   * Persist mode changes (optional).\n   */\n  useEffect(() => {\n    if (persistence) {\n      try {\n        persistence.set(mode)\n      } catch {}\n      return\n    }\n\n    if (!persist) return\n    const ls = getLocalStorageSafe()\n    if (!ls) return\n\n    try {\n      ls.setItem(storageKey, mode)\n    } catch {}\n  }, [mode, persist, storageKey, persistence])\n\n  function setTheme(next: ThemeMode) {\n    setMode(next)\n  }\n\n  function toggleTheme(a: string = 'light', b: string = 'dark') {\n    setMode(resolvedName === a ? b : a)\n  }\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: <Not needed>\n  const ctxValue = useMemo(\n    () => ({\n      mode,\n      resolvedName,\n      theme,\n      isLoading: !isReady,\n      setTheme,\n      toggleTheme\n    }),\n    [mode, resolvedName, theme, isReady]\n  )\n\n  return (\n    <ThemeContext.Provider value={ctxValue}>\n      {isReady ? children : fallback}\n    </ThemeContext.Provider>\n  )\n}\n\nexport function useTheme(): ThemeContextData {\n  const ctx = useContext(ThemeContext)\n  if (!ctx) throw new Error('useTheme must be used within a ThemeProvider')\n  return ctx\n}\n"],"mappings":"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"}

package/dist/Typography-BE-vQSfx.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Typography-BE-vQSfx.js","names":["typographyVariants: Record<TypographyVariant, SlotStyle>","variantToElement: Record<\n  TypographyVariant,\n  keyof JSX.IntrinsicElements\n>","alignText: Record<TextAlign, SlotStyle>"],"sources":["../src/components/toolkit/Typography/config.ts","../src/components/toolkit/Typography/style.ts","../src/components/toolkit/Typography/index.tsx"],"sourcesContent":["// External Libraries\nimport type { JSX } from 'react'\n\n// Types\nimport type { TextAlign, TypographyVariant } from './types'\nimport { type SlotStyle, WEIGHTS } from '@hooks/useThemedStyles/types'\n\nconst primaryColor = 'var(--px-text-primary)'\nconst secondaryColor = 'var(--px-text-secondary)'\n\nexport const typographyVariants: Record<TypographyVariant, SlotStyle> = {\n  h1: {\n    fontSize: '3rem',\n    fontWeight: '700',\n    lineHeight: WEIGHTS.bold,\n    color: primaryColor\n  },\n  h2: {\n    fontSize: '2.25rem',\n    fontWeight: WEIGHTS.bold,\n    lineHeight: 'calc(2.5 / 2.25)',\n    color: primaryColor\n  },\n  h3: {\n    fontSize: '1.875rem',\n    fontWeight: WEIGHTS.bold,\n    lineHeight: 'calc(2.25 / 1.875)',\n    color: primaryColor\n  },\n  h4: {\n    fontSize: '1.5rem',\n    fontWeight: WEIGHTS.bold,\n    lineHeight: 'calc(2 / 1.5)',\n    color: primaryColor\n  },\n  h5: {\n    fontSize: '1.25rem',\n    fontWeight: WEIGHTS.bold,\n    lineHeight: 'calc(1.75 / 1.25)',\n    color: primaryColor\n  },\n  b1: {\n    fontSize: '1rem',\n    fontWeight: WEIGHTS.medium,\n    lineHeight: '1.5',\n    color: primaryColor\n  },\n  b2: {\n    fontSize: '0.875rem',\n    fontWeight: WEIGHTS.medium,\n    lineHeight: 'calc(1.25 / 0.875)',\n    color: secondaryColor\n  },\n  b3: {\n    fontSize: '0.75rem',\n    fontWeight: WEIGHTS.medium,\n    lineHeight: 'calc(1 / 0.75)',\n    color: secondaryColor\n  },\n  caption: {\n    fontSize: '0.65rem',\n    fontWeight: WEIGHTS.regular,\n    lineHeight: 'calc(1 / 0.65)',\n    color: secondaryColor\n  },\n  legal: {\n    fontSize: '0.65rem',\n    lineHeight: 'calc(1 / 0.65)',\n    fontWeight: WEIGHTS.light,\n    textTransform: 'uppercase',\n    letterSpacing: '0.025em',\n    color: secondaryColor\n  }\n}\n\nexport const variantToElement: Record<\n  TypographyVariant,\n  keyof JSX.IntrinsicElements\n> = {\n  h1: 'h1',\n  h2: 'h2',\n  h3: 'h3',\n  h4: 'h4',\n  h5: 'h5',\n  b1: 'p',\n  b2: 'p',\n  b3: 'p',\n  caption: 'span',\n  legal: 'span'\n}\n\nexport const alignText: Record<TextAlign, SlotStyle> = {\n  left: { textAlign: 'left' },\n  center: { textAlign: 'center' },\n  right: { textAlign: 'right' },\n  justify: { textAlign: 'justify' }\n}\n","// Utils\nimport { alignText, typographyVariants } from './config'\n\n// Types\nimport type { TypographyProps } from './types'\nimport { type SlotStyle, styled } from '@hooks/useThemedStyles/types'\n\nexport function createTypographyStyles(props: TypographyProps) {\n  const { isLoading, variant, align = 'left', color } = props\n\n  return styled({\n    base: {\n      display: 'flex',\n      flexDirection: 'row',\n      alignItems: 'center',\n      borderBottom: '1px solid var(--pixel-border, #e5e7eb)',\n      gap: 0,\n      animation: isLoading ? 'animate-pulse 1.5s infinite' : undefined\n    },\n\n    loading: {\n      width: '50%',\n      height: '1em',\n      display: 'inline-block',\n      backgroundColor: 'var(--pixel-gray-300, #d1d5db)',\n      borderRadius: '0.25rem'\n    },\n\n    text: {\n      ...alignText[align],\n      ...typographyVariants[variant],\n      color: color ?? typographyVariants[variant].color\n    } as SlotStyle\n  })\n}\n","// Utils\nimport { variantToElement } from './config'\n\n// Types\nimport type { TypographyProps } from './types'\n\n// Hooks\nimport { useThemedStyles } from '@hooks/useThemedStyles'\n\n// Styles\nimport { createTypographyStyles } from './style'\n\nexport function Typography(props: TypographyProps) {\n  const {\n    id,\n    as,\n    href,\n    variant,\n    children,\n    className,\n    placeholder,\n    isLoading = false,\n    styles: styleTypography\n  } = props\n\n  const { styles } = useThemedStyles(props, createTypographyStyles, {\n    pick: p => [p.isLoading, p.variant, p.align],\n    commonSlot: 'text',\n    applyCommonProps: true,\n    override: styleTypography\n  })\n\n  const Component = as ?? variantToElement[variant]\n\n  if (isLoading) {\n    return (\n      <span\n        id={id}\n        aria-hidden=\"true\"\n        role=\"presentation\"\n        style={{ ...styles.text, ...styles.loading }}\n      />\n    )\n  }\n\n  const sharedProps = {\n    id,\n    style: styles.text,\n    'aria-label': placeholder,\n    className\n  }\n\n  if (href) {\n    return (\n      <a href={href} {...sharedProps}>\n        {children}\n      </a>\n    )\n  }\n\n  return <Component {...sharedProps}>{children}</Component>\n}\n"],"mappings":";;;;AAOA,MAAM,eAAe;AACrB,MAAM,iBAAiB;AAEvB,MAAaA,qBAA2D;CACtE,IAAI;EACF,UAAU;EACV,YAAY;EACZ,YAAY,QAAQ;EACpB,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY,QAAQ;EACpB,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY,QAAQ;EACpB,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY,QAAQ;EACpB,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY,QAAQ;EACpB,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY,QAAQ;EACpB,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY,QAAQ;EACpB,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY,QAAQ;EACpB,YAAY;EACZ,OAAO;EACR;CACD,SAAS;EACP,UAAU;EACV,YAAY,QAAQ;EACpB,YAAY;EACZ,OAAO;EACR;CACD,OAAO;EACL,UAAU;EACV,YAAY;EACZ,YAAY,QAAQ;EACpB,eAAe;EACf,eAAe;EACf,OAAO;EACR;CACF;AAED,MAAaC,mBAGT;CACF,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,SAAS;CACT,OAAO;CACR;AAED,MAAaC,YAA0C;CACrD,MAAM,EAAE,WAAW,QAAQ;CAC3B,QAAQ,EAAE,WAAW,UAAU;CAC/B,OAAO,EAAE,WAAW,SAAS;CAC7B,SAAS,EAAE,WAAW,WAAW;CAClC;;;;ACzFD,SAAgB,uBAAuB,OAAwB;CAC7D,MAAM,EAAE,WAAW,SAAS,QAAQ,QAAQ,UAAU;AAEtD,QAAO,OAAO;EACZ,MAAM;GACJ,SAAS;GACT,eAAe;GACf,YAAY;GACZ,cAAc;GACd,KAAK;GACL,WAAW,YAAY,gCAAgC;GACxD;EAED,SAAS;GACP,OAAO;GACP,QAAQ;GACR,SAAS;GACT,iBAAiB;GACjB,cAAc;GACf;EAED,MAAM;GACJ,GAAG,UAAU;GACb,GAAG,mBAAmB;GACtB,OAAO,SAAS,mBAAmB,SAAS;GAC7C;EACF,CAAC;;;;;ACrBJ,SAAgB,WAAW,OAAwB;CACjD,MAAM,EACJ,IACA,IACA,MACA,SACA,UACA,WACA,aACA,YAAY,OACZ,QAAQ,oBACN;CAEJ,MAAM,EAAE,WAAW,gBAAgB,OAAO,wBAAwB;EAChE,OAAM,MAAK;GAAC,EAAE;GAAW,EAAE;GAAS,EAAE;GAAM;EAC5C,YAAY;EACZ,kBAAkB;EAClB,UAAU;EACX,CAAC;CAEF,MAAM,YAAY,MAAM,iBAAiB;AAEzC,KAAI,UACF,QACE,oBAAC;EACK;EACJ,eAAY;EACZ,MAAK;EACL,OAAO;GAAE,GAAG,OAAO;GAAM,GAAG,OAAO;GAAS;GAC5C;CAIN,MAAM,cAAc;EAClB;EACA,OAAO,OAAO;EACd,cAAc;EACd;EACD;AAED,KAAI,KACF,QACE,oBAAC;EAAQ;EAAM,GAAI;EAChB;GACC;AAIR,QAAO,oBAAC;EAAU,GAAI;EAAc;GAAqB"}