softable-pixels-web 1.0.7 → 1.1.0

package/dist/Typography-CKXLkfw7.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Typography-CKXLkfw7.js","names":["typographyVariants: Record<TypographyVariant, CSSProperties>","variantToElement: Record<\n  TypographyVariant,\n  keyof JSX.IntrinsicElements\n>","alignText: Record<TextAlign, CSSProperties>"],"sources":["../src/components/toolkit/Typography/config.ts","../src/components/toolkit/Typography/style.ts","../src/components/toolkit/Typography/index.tsx"],"sourcesContent":["// External Libraries\nimport type { CSSProperties, JSX } from 'react'\n\n// Types\nimport type { TextAlign, TypographyVariant } from './types'\n\nconst primaryColor = 'var(--px-text-primary)'\nconst secondaryColor = 'var(--px-text-secondary)'\n\nexport const typographyVariants: Record<TypographyVariant, CSSProperties> = {\n  h1: {\n    fontSize: '3rem',\n    fontWeight: '700',\n    lineHeight: '1.25',\n    color: primaryColor\n  },\n  h2: {\n    fontSize: '2.25rem',\n    fontWeight: '600',\n    lineHeight: '1.35',\n    color: primaryColor\n  },\n  h3: {\n    fontSize: '1.875rem',\n    fontWeight: '600',\n    color: primaryColor\n  },\n  h4: {\n    fontSize: '1.5rem',\n    fontWeight: '500',\n    color: primaryColor\n  },\n  h5: {\n    fontSize: '1.25rem',\n    fontWeight: '500',\n    color: primaryColor\n  },\n  b1: {\n    fontSize: '1rem',\n    fontWeight: '500',\n    color: primaryColor\n  },\n  b2: {\n    fontSize: '0.875rem',\n    color: secondaryColor\n  },\n  b3: {\n    fontSize: '0.75rem',\n    color: secondaryColor\n  },\n  caption: {\n    fontSize: '0.75rem',\n    color: secondaryColor\n  },\n  legal: {\n    fontSize: '0.65rem',\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, CSSProperties> = {\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 { styled, type StyleMap } from '@hooks/useThemedStyles/types'\n\nexport function createTypographyStyles(props: TypographyProps): StyleMap {\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    }\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    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  }\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":";;;;AAMA,MAAM,eAAe;AACrB,MAAM,iBAAiB;AAEvB,MAAaA,qBAA+D;CAC1E,IAAI;EACF,UAAU;EACV,YAAY;EACZ,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY;EACZ,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,YAAY;EACZ,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,OAAO;EACR;CACD,IAAI;EACF,UAAU;EACV,OAAO;EACR;CACD,SAAS;EACP,UAAU;EACV,OAAO;EACR;CACD,OAAO;EACL,UAAU;EACV,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,YAA8C;CACzD,MAAM,EAAE,WAAW,QAAQ;CAC3B,QAAQ,EAAE,WAAW,UAAU;CAC/B,OAAO,EAAE,WAAW,SAAS;CAC7B,SAAS,EAAE,WAAW,WAAW;CAClC;;;;AC5ED,SAAgB,uBAAuB,OAAkC;CACvE,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,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;EACf;AAED,KAAI,KACF,QACE,oBAAC;EAAQ;EAAM,GAAI;EAChB;GACC;AAIR,QAAO,oBAAC;EAAU,GAAI;EAAc;GAAqB"}

package/dist/button.d.ts

@@ -1,3 +1,3 @@
-import "./types-_ZbgGCjb.js";
-import { t as Button } from "./index-x_PYKZgv.js";
+import "./types-CdA3IIV2.js";
+import { t as Button } from "./index-R-Kb8ovB.js";
 export { Button };

package/dist/button.js

@@ -1,4 +1,5 @@
-import "./Typography-BaE9Y1O8.js";
-import { t as Button } from "./Button-B9tDbn4Q.js";
+import "./useThemedStyles-68D71Lua.js";
+import "./Typography-CKXLkfw7.js";
+import { t as Button } from "./Button-nrM-Dn6T.js";
 
 export { Button };

package/dist/check-item.d.ts

@@ -1,2 +1,2 @@
-import { t as CheckItem } from "./index-CADs9cEh.js";
+import { t as CheckItem } from "./index-akSk71wZ.js";
 export { CheckItem };

package/dist/check-item.js

@@ -1,5 +1,6 @@
-import "./Icon-BrLGgg0w.js";
-import "./Typography-BaE9Y1O8.js";
-import { t as CheckItem } from "./CheckItem-CBzbinCc.js";
+import "./Icon-7fQw74zg.js";
+import "./useThemedStyles-68D71Lua.js";
+import "./Typography-CKXLkfw7.js";
+import { t as CheckItem } from "./CheckItem-Cr8YZFKe.js";
 
 export { CheckItem };

package/dist/checkbox.d.ts

@@ -1,3 +1,3 @@
-import "./types-_ZbgGCjb.js";
-import { t as Checkbox } from "./index-CqAWI5LI.js";
+import "./types-CdA3IIV2.js";
+import { t as Checkbox } from "./index-Da42fqu3.js";
 export { Checkbox };

package/dist/checkbox.js

@@ -1,5 +1,6 @@
-import "./Icon-BrLGgg0w.js";
-import "./Typography-BaE9Y1O8.js";
-import { t as Checkbox } from "./Checkbox-l_SA4qUE.js";
+import "./Icon-7fQw74zg.js";
+import "./useThemedStyles-68D71Lua.js";
+import "./Typography-CKXLkfw7.js";
+import { t as Checkbox } from "./Checkbox-BRAE-Kg-.js";
 
 export { Checkbox };

package/dist/icon-button.d.ts

@@ -0,0 +1,2 @@
+import { t as IconButton } from "./index-BYZm15m2.js";
+export { IconButton };

package/dist/icon-button.js

@@ -0,0 +1,4 @@
+import "./useThemedStyles-68D71Lua.js";
+import { t as IconButton } from "./IconButton-B7-l2DTb.js";
+
+export { IconButton };

package/dist/index-BYZm15m2.d.ts

@@ -0,0 +1,26 @@
+import { t as StyleMap } from "./useThemedStyles-CXoofBTv.js";
+import { MouseEvent, ReactNode } from "react";
+
+//#region src/components/commons/buttons/IconButton/styles.d.ts
+declare function createIconButtonStyles(props: IconButtonProps): StyleMap;
+//#endregion
+//#region src/components/commons/buttons/IconButton/types.d.ts
+interface IconButtonProps {
+  icon: ReactNode;
+  size?: IconButtonSize;
+  isLoading?: boolean;
+  isDisabled?: boolean;
+  variant?: IconButtonVarriant;
+  backgroundColor?: string;
+  borderColor?: string;
+  styles?: Partial<ReturnType<typeof createIconButtonStyles>>;
+  onClick?: (event: MouseEvent<HTMLButtonElement>) => void;
+}
+type IconButtonSize = 'xs' | 'sm' | 'md' | 'lg';
+type IconButtonVarriant = 'filled' | 'outlined' | 'borderless';
+//#endregion
+//#region src/components/commons/buttons/IconButton/index.d.ts
+declare const IconButton: React.FC<IconButtonProps>;
+//#endregion
+export { IconButton as t };
+//# sourceMappingURL=index-BYZm15m2.d.ts.map

package/dist/{index-CXR_rnK-.d.ts → index-BrVPSHH2.d.ts}

@@ -1,16 +1,16 @@
-import { t as StyleMap } from "./useThemedStyles-_SsqjB7Q.js";
-import { n as TypographyVariant } from "./types-_ZbgGCjb.js";
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import { t as StyleMap } from "./useThemedStyles-CXoofBTv.js";
+import { n as TypographyVariant } from "./types-CdA3IIV2.js";
+import * as react_jsx_runtime2 from "react/jsx-runtime";
 
 //#region src/assets/icons/index.d.ts
 /** biome-ignore-all lint/suspicious/noShadowRestrictedNames: generated */
 declare const icons: {
-  'brands-facebook': react_jsx_runtime3.JSX.Element;
-  'brands-facebook-fit': react_jsx_runtime3.JSX.Element;
-  'brands-google': react_jsx_runtime3.JSX.Element;
-  'general-check': react_jsx_runtime3.JSX.Element;
-  'general-eye': react_jsx_runtime3.JSX.Element;
-  'general-eye-off': react_jsx_runtime3.JSX.Element;
+  'brands-facebook': react_jsx_runtime2.JSX.Element;
+  'brands-facebook-fit': react_jsx_runtime2.JSX.Element;
+  'brands-google': react_jsx_runtime2.JSX.Element;
+  'general-check': react_jsx_runtime2.JSX.Element;
+  'general-eye': react_jsx_runtime2.JSX.Element;
+  'general-eye-off': react_jsx_runtime2.JSX.Element;
 };
 type IconName = keyof typeof icons;
 //#endregion
@@ -42,7 +42,7 @@ interface TextAreaProps {
 }
 //#endregion
 //#region src/components/commons/inputs/TextArea/index.d.ts
-declare const TextArea: (props: TextAreaProps) => react_jsx_runtime3.JSX.Element;
+declare const TextArea: (props: TextAreaProps) => react_jsx_runtime2.JSX.Element;
 //#endregion
 export { TextArea as t };
-//# sourceMappingURL=index-CXR_rnK-.d.ts.map
+//# sourceMappingURL=index-BrVPSHH2.d.ts.map

package/dist/{index-Cbt7nYQB.d.ts → index-C181qAfZ.d.ts}

@@ -1,4 +1,5 @@
-import { n as CommonStyleProps, t as StyleMap } from "./useThemedStyles-_SsqjB7Q.js";
+import { t as CommonStyleProps } from "./styleProps-7WdaXgmQ.js";
+import { t as StyleMap } from "./useThemedStyles-CXoofBTv.js";
 import { ReactNode } from "react";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
 
@@ -29,4 +30,4 @@ interface TabSwitchProps<T> extends CommonStyleProps {
 declare const TabSwitch: <T>(props: TabSwitchProps<T>) => react_jsx_runtime0.JSX.Element;
 //#endregion
 export { SwitchOption as n, TabSwitchProps as r, TabSwitch as t };
-//# sourceMappingURL=index-Cbt7nYQB.d.ts.map
+//# sourceMappingURL=index-C181qAfZ.d.ts.map

package/dist/{index-H8VYQre4.d.ts → index-CIxyqe-m.d.ts}

@@ -74,6 +74,7 @@ interface ThemeTokens {
     error: string;
     invalid: string;
     info: string;
+    disabled: string;
     scrollbar: string;
     button: {
       filled: {
@@ -278,23 +279,13 @@ type ThemeProviderProps = PropsWithChildren & {
    * Allows persistence via cookies, server, indexedDB, etc.
    */
   persistence?: ThemePersistence;
+  /** * Optional fallback element while the theme is initializing. */
+  fallback?: React.ReactNode;
 };
 //#endregion
 //#region src/contexts/ThemeContext/index.d.ts
-/**
- * ThemeProvider
- * -------------
- * Provides theme state + resolved theme tokens to your app.
- */
 declare const ThemeProvider: React.FC<ThemeProviderProps>;
-/**
- * useTheme()
- *
- * Returns the current theme context.
- *
- * @throws If called outside of `<ThemeProvider />`.
- */
 declare function useTheme(): ThemeContextData;
 //#endregion
 export { ThemeName as a, ThemeRegistry as c, ThemeMode as i, ThemeTokens as l, useTheme as n, ThemePersistence as o, ThemeContextData as r, ThemeProviderProps as s, ThemeProvider as t };
-//# sourceMappingURL=index-H8VYQre4.d.ts.map
+//# sourceMappingURL=index-CIxyqe-m.d.ts.map

package/dist/{index-CqAWI5LI.d.ts → index-Da42fqu3.d.ts}

@@ -1,4 +1,4 @@
-import { n as TypographyVariant } from "./types-_ZbgGCjb.js";
+import { n as TypographyVariant } from "./types-CdA3IIV2.js";
 import React$1 from "react";
 import { ChecklistAlertResponse } from "@api/checklist/alerts/dtos";
 
@@ -28,4 +28,4 @@ interface CheckboxProps {
 declare const Checkbox: React$1.FC<CheckboxProps>;
 //#endregion
 export { Checkbox as t };
-//# sourceMappingURL=index-CqAWI5LI.d.ts.map
+//# sourceMappingURL=index-Da42fqu3.d.ts.map

package/dist/{index-x_PYKZgv.d.ts → index-R-Kb8ovB.d.ts}

@@ -1,7 +1,49 @@
-import { r as PaddingProps } from "./useThemedStyles-_SsqjB7Q.js";
-import { n as TypographyVariant } from "./types-_ZbgGCjb.js";
+import { i as PaddingProps } from "./styleProps-7WdaXgmQ.js";
+import { n as TypeStyles } from "./useThemedStyles-CXoofBTv.js";
+import { n as TypographyVariant } from "./types-CdA3IIV2.js";
 import React, { ReactNode } from "react";
 
+//#region src/components/commons/buttons/Button/styles.d.ts
+declare function createButtonStyles({
+  color,
+  variant,
+  disabled,
+  fullWidth,
+  textAlign,
+  outlineColor
+}: ButtonProps): {
+  container: {
+    minHeight: string;
+    height: string;
+    width: string;
+    position: "relative";
+    display: "flex";
+    justifyContent: Align;
+    padding: string;
+    gap: string;
+    borderRadius: string;
+    cursor: "not-allowed" | "pointer";
+    opacity: number;
+    transition: "background-color 0.5s";
+    border: string;
+    backgroundColor: string;
+    __rules: {
+      '&:hover': {
+        opacity: "0.85 !important";
+      };
+    };
+  };
+  content: {
+    display: "flex";
+    flexDirection: "row";
+    alignItems: "center";
+    padding: string;
+    borderRadius: string;
+    whiteSpace: "nowrap";
+    columnGap: string;
+  };
+};
+//#endregion
 //#region src/components/commons/buttons/Button/types.d.ts
 type Align = 'center' | 'left' | 'right';
 type ButtonType = 'button' | 'submit' | 'reset';
@@ -13,6 +55,7 @@ interface ButtonProps extends PaddingProps {
   labelVariant?: TypographyVariant;
   /** Icon displayed before the label */
   startIcon?: ReactNode;
+  styles?: TypeStyles<typeof createButtonStyles>;
   /** Icon displayed after the label */
   endIcon?: ReactNode;
   /**
@@ -25,6 +68,8 @@ interface ButtonProps extends PaddingProps {
   loading?: boolean;
   /** Text color of the button label */
   labelColor?: string;
+  /** Outline color for outlined variant */
+  outlineColor?: string;
   /** Aligns the button text content */
   textAlign?: Align;
   /**
@@ -62,4 +107,4 @@ interface ButtonProps extends PaddingProps {
 declare const Button: React.FC<ButtonProps>;
 //#endregion
 export { Button as t };
-//# sourceMappingURL=index-x_PYKZgv.d.ts.map
+//# sourceMappingURL=index-R-Kb8ovB.d.ts.map

package/dist/{index-CADs9cEh.d.ts → index-akSk71wZ.d.ts}

@@ -10,4 +10,4 @@ interface CheckItemProps {
 declare const CheckItem: React.FC<CheckItemProps>;
 //#endregion
 export { CheckItem as t };
-//# sourceMappingURL=index-CADs9cEh.d.ts.map
+//# sourceMappingURL=index-akSk71wZ.d.ts.map

package/dist/{index-BvkboQOE.d.ts → index-v4w-T_f6.d.ts}

@@ -1,7 +1,7 @@
-import { t as StyleMap } from "./useThemedStyles-_SsqjB7Q.js";
-import { n as TypographyVariant } from "./types-_ZbgGCjb.js";
-import { InputHTMLAttributes, ReactNode } from "react";
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import { i as PaddingProps, n as LayoutProps } from "./styleProps-7WdaXgmQ.js";
+import { t as StyleMap } from "./useThemedStyles-CXoofBTv.js";
+import { n as TypographyVariant } from "./types-CdA3IIV2.js";
+import React, { ReactNode } from "react";
 
 //#region src/components/commons/inputs/Input/styles.d.ts
 
@@ -13,12 +13,17 @@ type InputSize = 'sm' | 'md' | 'lg';
 type InputRadius = 'none' | 'sm' | 'md' | 'lg' | 'full';
 type InputType = 'text' | 'email' | 'url' | 'password' | 'tel' | 'search';
 type InputWidth = 'auto' | 'full' | 'md' | 'lg' | 'xl' | '2xl';
-interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'value' | 'defaultValue' | 'onChange'> {
+interface InputProps extends LayoutProps, PaddingProps {
+  id?: string;
+  label?: string;
+  value?: string;
   size?: InputSize;
   type?: InputType;
+  minLength?: number;
+  maxLength?: number;
   width?: InputWidth;
-  label?: string;
-  value?: string;
+  required?: boolean;
+  placeholder?: string;
   radius?: InputRadius;
   variant?: InputVariant;
   isInvalid?: boolean;
@@ -38,7 +43,7 @@ interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'
 }
 //#endregion
 //#region src/components/commons/inputs/Input/index.d.ts
-declare const Input: (props: InputProps) => react_jsx_runtime1.JSX.Element;
+declare const Input: React.FC<InputProps>;
 //#endregion
 export { Input as t };
-//# sourceMappingURL=index-BvkboQOE.d.ts.map
+//# sourceMappingURL=index-v4w-T_f6.d.ts.map

package/dist/index.d.ts

@@ -1,11 +1,12 @@
-import "./types-_ZbgGCjb.js";
-import { t as Button } from "./index-x_PYKZgv.js";
-import { t as Input } from "./index-BvkboQOE.js";
-import { t as TextArea } from "./index-CXR_rnK-.js";
-import { t as CheckItem } from "./index-CADs9cEh.js";
-import { t as Checkbox } from "./index-CqAWI5LI.js";
+import "./types-CdA3IIV2.js";
+import { t as Button } from "./index-R-Kb8ovB.js";
+import { t as IconButton } from "./index-BYZm15m2.js";
+import { t as Input } from "./index-v4w-T_f6.js";
+import { t as TextArea } from "./index-BrVPSHH2.js";
+import { t as CheckItem } from "./index-akSk71wZ.js";
+import { t as Checkbox } from "./index-Da42fqu3.js";
 import { InfoSummary, InfoSummaryItem, InfoSummaryProps } from "./info-summary.js";
-import { n as SwitchOption, r as TabSwitchProps, t as TabSwitch } from "./index-Cbt7nYQB.js";
+import { n as SwitchOption, r as TabSwitchProps, t as TabSwitch } from "./index-C181qAfZ.js";
 import { Typography } from "./typography.js";
-import { a as ThemeName, c as ThemeRegistry, i as ThemeMode, l as ThemeTokens, n as useTheme, o as ThemePersistence, r as ThemeContextData, s as ThemeProviderProps, t as ThemeProvider } from "./index-H8VYQre4.js";
-export { Button, CheckItem, Checkbox, InfoSummary, InfoSummaryItem, InfoSummaryProps, Input, SwitchOption, TabSwitch, TabSwitchProps, TextArea, ThemeContextData, ThemeMode, ThemeName, ThemePersistence, ThemeProvider, ThemeProviderProps, ThemeRegistry, ThemeTokens, Typography, useTheme };
+import { a as ThemeName, c as ThemeRegistry, i as ThemeMode, l as ThemeTokens, n as useTheme, o as ThemePersistence, r as ThemeContextData, s as ThemeProviderProps, t as ThemeProvider } from "./index-CIxyqe-m.js";
+export { Button, CheckItem, Checkbox, IconButton, InfoSummary, InfoSummaryItem, InfoSummaryProps, Input, SwitchOption, TabSwitch, TabSwitchProps, TextArea, ThemeContextData, ThemeMode, ThemeName, ThemePersistence, ThemeProvider, ThemeProviderProps, ThemeRegistry, ThemeTokens, Typography, useTheme };

package/dist/index.js

@@ -1,13 +1,15 @@
-import "./Icon-BrLGgg0w.js";
-import { t as Typography } from "./Typography-BaE9Y1O8.js";
-import { t as Checkbox } from "./Checkbox-l_SA4qUE.js";
-import { n as useTheme, t as ThemeProvider } from "./ThemeContext-BQQnMo5F.js";
-import { t as TabSwitch } from "./TabSwitch-DRs6-76U.js";
-import { t as InfoSummary } from "./InfoSummary-CHRfCc3v.js";
-import { t as CheckItem } from "./CheckItem-CBzbinCc.js";
-import { t as Button } from "./Button-B9tDbn4Q.js";
-import "./Label-BVteAeiK.js";
-import { t as Input } from "./Input-CUZNjGoG.js";
-import { t as TextArea } from "./TextArea-ZKDCCx4I.js";
+import "./Icon-7fQw74zg.js";
+import "./useThemedStyles-68D71Lua.js";
+import { t as Typography } from "./Typography-CKXLkfw7.js";
+import { t as Checkbox } from "./Checkbox-BRAE-Kg-.js";
+import { n as useTheme, t as ThemeProvider } from "./ThemeContext-BsU2ZyE5.js";
+import { t as TabSwitch } from "./TabSwitch-Ce-uQvRp.js";
+import { t as InfoSummary } from "./InfoSummary-D2ER39sF.js";
+import { t as CheckItem } from "./CheckItem-Cr8YZFKe.js";
+import { t as Button } from "./Button-nrM-Dn6T.js";
+import { t as IconButton } from "./IconButton-B7-l2DTb.js";
+import "./Label-1Gh2DlKl.js";
+import { t as Input } from "./Input-BR3ZaetX.js";
+import { t as TextArea } from "./TextArea-BsErpaMx.js";
 
-export { Button, CheckItem, Checkbox, InfoSummary, Input, TabSwitch, TextArea, ThemeProvider, Typography, useTheme };
+export { Button, CheckItem, Checkbox, IconButton, InfoSummary, Input, TabSwitch, TextArea, ThemeProvider, Typography, useTheme };

package/dist/info-summary.js

@@ -1,4 +1,5 @@
-import "./Typography-BaE9Y1O8.js";
-import { t as InfoSummary } from "./InfoSummary-CHRfCc3v.js";
+import "./useThemedStyles-68D71Lua.js";
+import "./Typography-CKXLkfw7.js";
+import { t as InfoSummary } from "./InfoSummary-D2ER39sF.js";
 
 export { InfoSummary };

package/dist/input.d.ts

@@ -1,3 +1,3 @@
-import "./types-_ZbgGCjb.js";
-import { t as Input } from "./index-BvkboQOE.js";
+import "./types-CdA3IIV2.js";
+import { t as Input } from "./index-v4w-T_f6.js";
 export { Input };

package/dist/input.js

@@ -1,6 +1,7 @@
-import "./Icon-BrLGgg0w.js";
-import "./Typography-BaE9Y1O8.js";
-import "./Label-BVteAeiK.js";
-import { t as Input } from "./Input-CUZNjGoG.js";
+import "./Icon-7fQw74zg.js";
+import "./useThemedStyles-68D71Lua.js";
+import "./Typography-CKXLkfw7.js";
+import "./Label-1Gh2DlKl.js";
+import { t as Input } from "./Input-BR3ZaetX.js";
 
 export { Input };

package/dist/styleProps-7WdaXgmQ.d.ts

@@ -0,0 +1,39 @@
+//#region src/hooks/useThemedStyles/types/styleProps.d.ts
+type Space = number | string;
+type Size = number | string;
+interface MarginProps {
+  m?: Space;
+  mx?: Space;
+  my?: Space;
+  mt?: Space;
+  mr?: Space;
+  mb?: Space;
+  ml?: Space;
+}
+interface PaddingProps {
+  p?: Space;
+  px?: Space;
+  py?: Space;
+  pt?: Space;
+  pr?: Space;
+  pb?: Space;
+  pl?: Space;
+}
+interface TextProps {
+  fontSize?: number | string;
+  fontWeight?: React.CSSProperties['fontWeight'];
+  lineHeight?: number | string;
+  textAlign?: React.CSSProperties['textAlign'];
+}
+interface LayoutProps {
+  w?: Size;
+  h?: Size;
+  minW?: Size;
+  maxW?: Size;
+  minH?: Size;
+  maxH?: Size;
+}
+type CommonStyleProps = MarginProps & PaddingProps & TextProps & LayoutProps;
+//#endregion
+export { TextProps as a, PaddingProps as i, LayoutProps as n, MarginProps as r, CommonStyleProps as t };
+//# sourceMappingURL=styleProps-7WdaXgmQ.d.ts.map

package/dist/tab-switch.d.ts

@@ -1,2 +1,2 @@
-import { n as SwitchOption, r as TabSwitchProps, t as TabSwitch } from "./index-Cbt7nYQB.js";
+import { n as SwitchOption, r as TabSwitchProps, t as TabSwitch } from "./index-C181qAfZ.js";
 export { SwitchOption, TabSwitch, TabSwitchProps };

package/dist/tab-switch.js

@@ -1,4 +1,5 @@
-import "./Typography-BaE9Y1O8.js";
-import { t as TabSwitch } from "./TabSwitch-DRs6-76U.js";
+import "./useThemedStyles-68D71Lua.js";
+import "./Typography-CKXLkfw7.js";
+import { t as TabSwitch } from "./TabSwitch-Ce-uQvRp.js";
 
 export { TabSwitch };

package/dist/text-area.d.ts

@@ -1,3 +1,3 @@
-import "./types-_ZbgGCjb.js";
-import { t as TextArea } from "./index-CXR_rnK-.js";
+import "./types-CdA3IIV2.js";
+import { t as TextArea } from "./index-BrVPSHH2.js";
 export { TextArea };

package/dist/text-area.js

@@ -1,6 +1,7 @@
-import "./Icon-BrLGgg0w.js";
-import "./Typography-BaE9Y1O8.js";
-import "./Label-BVteAeiK.js";
-import { t as TextArea } from "./TextArea-ZKDCCx4I.js";
+import "./Icon-7fQw74zg.js";
+import "./useThemedStyles-68D71Lua.js";
+import "./Typography-CKXLkfw7.js";
+import "./Label-1Gh2DlKl.js";
+import { t as TextArea } from "./TextArea-BsErpaMx.js";
 
 export { TextArea };

package/dist/theme-context.d.ts

@@ -1,2 +1,2 @@
-import { a as ThemeName, c as ThemeRegistry, i as ThemeMode, l as ThemeTokens, n as useTheme, o as ThemePersistence, r as ThemeContextData, s as ThemeProviderProps, t as ThemeProvider } from "./index-H8VYQre4.js";
+import { a as ThemeName, c as ThemeRegistry, i as ThemeMode, l as ThemeTokens, n as useTheme, o as ThemePersistence, r as ThemeContextData, s as ThemeProviderProps, t as ThemeProvider } from "./index-CIxyqe-m.js";
 export { ThemeContextData, ThemeMode, ThemeName, ThemePersistence, ThemeProvider, ThemeProviderProps, ThemeRegistry, ThemeTokens, useTheme };

package/dist/theme-context.js

@@ -1,3 +1,5 @@
-import { n as useTheme, t as ThemeProvider } from "./ThemeContext-BQQnMo5F.js";
+'use client';
+
+import { n as useTheme, t as ThemeProvider } from "./ThemeContext-BsU2ZyE5.js";
 
 export { ThemeProvider, useTheme };

package/dist/{types-_ZbgGCjb.d.ts → types-CdA3IIV2.d.ts}

@@ -1,11 +1,12 @@
-import { i as TextProps, t as StyleMap } from "./useThemedStyles-_SsqjB7Q.js";
+import { a as TextProps, r as MarginProps } from "./styleProps-7WdaXgmQ.js";
+import { t as StyleMap } from "./useThemedStyles-CXoofBTv.js";
 import { ElementType, ReactNode } from "react";
 
 //#region src/components/toolkit/Typography/style.d.ts
 declare function createTypographyStyles(props: TypographyProps): StyleMap;
 //#endregion
 //#region src/components/toolkit/Typography/types.d.ts
-interface TypographyProps extends TextProps {
+interface TypographyProps extends TextProps, MarginProps {
   variant: TypographyVariant;
   id?: string;
   href?: string;
@@ -21,4 +22,4 @@ type TextAlign = 'left' | 'center' | 'right' | 'justify';
 type TypographyVariant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'b1' | 'b2' | 'b3' | 'caption' | 'legal';
 //#endregion
 export { TypographyVariant as n, TypographyProps as t };
-//# sourceMappingURL=types-_ZbgGCjb.d.ts.map
+//# sourceMappingURL=types-CdA3IIV2.d.ts.map

package/dist/typography.d.ts

@@ -1,4 +1,4 @@
-import { t as TypographyProps } from "./types-_ZbgGCjb.js";
+import { t as TypographyProps } from "./types-CdA3IIV2.js";
 import * as react_jsx_runtime0 from "react/jsx-runtime";
 
 //#region src/components/toolkit/Typography/index.d.ts

package/dist/typography.js

@@ -1,3 +1,4 @@
-import { t as Typography } from "./Typography-BaE9Y1O8.js";
+import "./useThemedStyles-68D71Lua.js";
+import { t as Typography } from "./Typography-CKXLkfw7.js";
 
 export { Typography };