npm - @atom-learning/components - Versions diffs - 6.0.0-beta.12 → 6.0.0-beta.14 - Mend

@atom-learning/components 6.0.0-beta.12 → 6.0.0-beta.14

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

Files changed (255) hide show

package/dist/components/tile-interactive/TileInteractive.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import React from 'react';
 import { NavigatorActions } from '../../types';
-declare const StyledTileInteractive: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+declare const StyledTileInteractive: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "border" | "borderRadius" | "diffused"> & {
     borderRadius?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
@@ -8,11 +8,11 @@ declare const StyledTileInteractive: React.ForwardRefExoticComponent<Omit<Omit<O
     diffused?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & {
+} & {
     colorScheme?: import("../..").TcolorScheme;
 }, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 type TTileInteractiveProps = React.ComponentProps<typeof StyledTileInteractive> & React.ButtonHTMLAttributes<HTMLButtonElement> & NavigatorActions;
 export declare const TileInteractive: React.ForwardRefExoticComponent<Omit<TTileInteractiveProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/components/tile-toggle-group/TileToggleGroupItem.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import * as ToggleGroup from '@radix-ui/react-toggle-group';
 import * as React from 'react';
-declare const StyledTileToggleGroupItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+declare const StyledTileToggleGroupItem: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "border" | "borderRadius" | "diffused"> & {
     borderRadius?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
@@ -8,13 +8,13 @@ declare const StyledTileToggleGroupItem: React.ForwardRefExoticComponent<Omit<Om
     diffused?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & {
+} & {
     colorScheme?: import("../..").TcolorScheme;
 }, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & React.ButtonHTMLAttributes<HTMLButtonElement> & import("../../types").NavigatorActions, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
+} & React.ButtonHTMLAttributes<HTMLButtonElement> & import("../../types").NavigatorActions, "ref"> & React.RefAttributes<HTMLDivElement>, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 type TTileToggleGroupItem = React.ComponentProps<typeof ToggleGroup.Item> & React.ComponentProps<typeof StyledTileToggleGroupItem>;
 export declare const TileToggleGroupItem: ({ children, ...rest }: TTileToggleGroupItem) => React.JSX.Element;
 export {};

package/dist/components/tile-toggle-group/TileToggleGroupRoot.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as React from 'react';
-export declare const TileToggleGroupRoot: React.ForwardRefExoticComponent<(Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const TileToggleGroupRoot: React.ForwardRefExoticComponent<(Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "direction" | "align" | "wrap" | "justify" | "gap"> & {
     direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
@@ -9,9 +9,9 @@ export declare const TileToggleGroupRoot: React.ForwardRefExoticComponent<(Omit<
     gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
+} & Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
-}, "ref">, "ref"> | Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+}, "ref"> & React.RefAttributes<HTMLDivElement>, "ref"> | Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "direction" | "align" | "wrap" | "justify" | "gap"> & {
     direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
@@ -21,6 +21,6 @@ export declare const TileToggleGroupRoot: React.ForwardRefExoticComponent<(Omit<
     gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement> & {
+} & Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
-}, "ref">, "ref">) & React.RefAttributes<HTMLDivElement>>;
+}, "ref"> & React.RefAttributes<HTMLDivElement>, "ref">) & React.RefAttributes<HTMLDivElement>>;

package/dist/components/toast/Toast.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as React from 'react';
-export declare const StyledToast: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+export declare const StyledToast: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "direction" | "align" | "wrap" | "justify" | "gap"> & {
     direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
@@ -9,11 +9,11 @@ export declare const StyledToast: React.ForwardRefExoticComponent<Omit<Omit<Omit
     gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>, "type"> & {
-    type?: ("loading" | "error" | "success" | "blank" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "loading" | "error" | "success" | "blank">>) | undefined;
+}, "type"> & {
+    type?: "loading" | "error" | "success" | "blank" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 export declare const Toast: {
     (props: React.ComponentProps<typeof StyledToast>): React.JSX.Element;
     Icon: (props: React.ComponentProps<typeof import("..").Icon>) => JSX.Element;

package/dist/components/toggle-group/ToggleGroupButton.d.ts CHANGED Viewed

@@ -1,23 +1,23 @@
 import * as React from 'react';
-export declare const StyledButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "theme"> & {
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+export declare const StyledButton: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "theme"> & {
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>, "theme" | "size" | "isIconOnly"> & {
+}, "theme" | "size" | "isIconOnly"> & {
     size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
     isIconOnly?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
     theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>>;
-export declare const ToggleGroupButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "theme"> & {
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+}>;
+export declare const ToggleGroupButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>, "theme"> & {
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>, "theme" | "size" | "isIconOnly"> & {
+}, "theme" | "size" | "isIconOnly"> & {
     size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
     isIconOnly?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
     theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+}, "ref"> & React.RefAttributes<HTMLButtonElement>>;

package/dist/components/toggle-group/ToggleGroupButton.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as n from"react";import{styled as y}from"../../styled.js";import{Icon as i}from"../icon/Icon.js";import{ToggleGroupItem as f}from"./ToggleGroupItem.js";const l=y(f,{base:["grow","flex","items-center","justify-center","font-semibold","leading-[1]","py-1"],variants:{size:{sm:["*:not-last:mr-2","min-h-8","px-4","text-sm"],md:["*:not-last:mr-3","min-h-10","px-8","text-md"],lg:["*:not-last:mr-3","min-h-12","px-8","text-lg"]},isIconOnly:{true:[]},theme:{standard:[],modern:[]}},compoundVariants:[{isIconOnly:!0,size:"sm",class:["min-w-8","p-0"]},{isIconOnly:!0,size:"md",class:["min-w-10","p-0"]},{isIconOnly:!0,size:"lg",class:["min-w-12","p-0"]},{isIconOnly:!0,size:"sm",theme:"modern",class:["min-w-10","p-0"]},{isIconOnly:!0,size:"md",theme:"modern",class:["min-w-12","p-0"]},{isIconOnly:!0,size:"lg",theme:"modern",class:["min-w-15","p-0"]}]}),g=n.forwardRef(({size:s="md",theme:r="standard",children:a,...p},d)=>{var m;const t=n.Children.toArray(a),o=t.length<=1,c=o&&n.isValidElement(t[0])&&((m=t[0])==null?void 0:m.type)===i;return n.createElement(l,{ref:d,size:s,isIconOnly:c,theme:r,...p},t.map(e=>!o&&(typeof e=="string"||typeof e=="number")?n.createElement("span",{key:e},e):n.isValidElement(e)&&(e==null?void 0:e.type)===i?n.cloneElement(e,{...e.props,size:s}):e))});export{l as StyledButton,g as ToggleGroupButton};
+import*as n from"react";import{styled as y}from"../../styled.js";import{Icon as i}from"../icon/Icon.js";import{ToggleGroupItem as f}from"./ToggleGroupItem.js";const l=y(f,{base:["grow","flex","items-center","justify-center","font-semibold","leading-none","py-1"],variants:{size:{sm:["*:not-last:mr-2","min-h-8","px-4","text-sm"],md:["*:not-last:mr-3","min-h-10","px-8","text-md"],lg:["*:not-last:mr-3","min-h-12","px-8","text-lg"]},isIconOnly:{true:[]},theme:{standard:[],modern:[]}},compoundVariants:[{isIconOnly:!0,size:"sm",class:["min-w-8","p-0"]},{isIconOnly:!0,size:"md",class:["min-w-10","p-0"]},{isIconOnly:!0,size:"lg",class:["min-w-12","p-0"]},{isIconOnly:!0,size:"sm",theme:"modern",class:["min-w-10","p-0"]},{isIconOnly:!0,size:"md",theme:"modern",class:["min-w-12","p-0"]},{isIconOnly:!0,size:"lg",theme:"modern",class:["min-w-15","p-0"]}]},{enabledResponsiveVariants:!0}),g=n.forwardRef(({size:s="md",theme:r="standard",children:a,...p},d)=>{var m;const t=n.Children.toArray(a),o=t.length<=1,c=o&&n.isValidElement(t[0])&&((m=t[0])==null?void 0:m.type)===i;return n.createElement(l,{ref:d,size:s,isIconOnly:c,theme:r,...p},t.map(e=>!o&&(typeof e=="string"||typeof e=="number")?n.createElement("span",{key:e},e):n.isValidElement(e)&&(e==null?void 0:e.type)===i?n.cloneElement(e,{...e.props,size:s}):e))});export{l as StyledButton,g as ToggleGroupButton};
 //# sourceMappingURL=ToggleGroupButton.js.map

package/dist/components/toggle-group/ToggleGroupButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToggleGroupButton.js","sources":["../../../src/components/toggle-group/ToggleGroupButton.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Icon } from '../icon'\nimport { ToggleGroupItem } from './ToggleGroupItem'\n\nexport const StyledButton = styled(ToggleGroupItem, {\n base: [\n 'grow',\n 'flex',\n 'items-center',\n 'justify-center',\n 'font-semibold',\n 'leading-~~[1]~~',\n 'py-1'\n ],\n variants: {\n size: {\n sm: [':not-last:mr-2', 'min-h-8', 'px-4', 'text-sm'],\n md: [':not-last:mr-3', 'min-h-10', 'px-8', 'text-md'],\n lg: ['*:not-last:mr-3', 'min-h-12', 'px-8', 'text-lg']\n },\n isIconOnly: {\n true: []\n },\n theme: {\n standard: [],\n modern: []\n }\n },\n compoundVariants: [\n {\n isIconOnly: true,\n size: 'sm',\n class: ['min-w-8', 'p-0']\n },\n {\n isIconOnly: true,\n size: 'md',\n class: ['min-w-10', 'p-0']\n },\n {\n isIconOnly: true,\n size: 'lg',\n class: ['min-w-12', 'p-0']\n },\n {\n isIconOnly: true,\n size: 'sm',\n theme: 'modern',\n class: ['min-w-10', 'p-0']\n },\n {\n isIconOnly: true,\n size: 'md',\n theme: 'modern',\n class: ['min-w-12', 'p-0']\n },\n {\n isIconOnly: true,\n size: 'lg',\n theme: 'modern',\n class: ['min-w-15', 'p-0']\n }\n ]\n})\n\nexport const ToggleGroupButton = React.forwardRef<\n HTMLButtonElement,\n React.ComponentProps<typeof StyledButton>\n>(({ size = 'md', theme = 'standard', children, ...rest }, ref) => {\n const childrenArray = React.Children.toArray(children)\n const isSingleChild = childrenArray.length <= 1\n const isIconOnly =\n isSingleChild &&\n React.isValidElement(childrenArray[0]) &&\n childrenArray[0]?.type === Icon\n\n return (\n <StyledButton\n ref={ref}\n size={size}\n isIconOnly={isIconOnly}\n theme={theme}\n {...rest}\n >\n {\n childrenArray.map((child) => {\n if (\n !isSingleChild &&\n (typeof child === 'string' \|\| typeof child === 'number')\n )\n return <span key={child}>{child}</span>\n if (React.isValidElement(child)) {\n if (child?.type === Icon)\n return React.cloneElement(child, { ...child.props, size })\n }\n return child\n }) as React.ReactElement[]\n }\n </StyledButton>\n )\n})\n"],"names":["StyledButton","styled","ToggleGroupItem","ToggleGroupButton","React","size","theme","children","rest","ref","_a","childrenArray","isSingleChild","isIconOnly","Icon","child"],"mappings":"+~~JAOO~~,~~MAAMA~~,EAAeC,~~EAAOC~~,~~EAAiB~~,~~CAClD~~,KAAM,CACJ,OACA,OACA,eACA,iBACA,gBACA,~~cACA~~,MACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,kBAAmB,UAAW,OAAQ,SAAS,EACpD,GAAI,CAAC,kBAAmB,WAAY,OAAQ,SAAS,EACrD,GAAI,CAAC,kBAAmB,WAAY,OAAQ,SAAS,CACvD,EACA,WAAY,CACV,KAAM,CAAA,~~CACR,~~EACA,MAAO,CACL,SAAU,~~CAAA~~,~~EACV~~,OAAQ,CACV,~~CAAA,~~CACF,EACA,iBAAkB,CAChB,CACE,WAAY,GACZ,KAAM,KACN,MAAO,CAAC,UAAW,KAAK,CAC1B,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,CAAC,WAAY,KAAK,CAC3B,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,CAAC,WAAY,KAAK,CAC3B,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,SACP,MAAO,CAAC,WAAY,KAAK,CAC3B,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,SACP,MAAO,CAAC,WAAY,KAAK,CAC3B,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,SACP,MAAO,CAAC,WAAY,KAAK,CAC3B,CACF,CACF,~~CAAC~~,~~EAEYC~~,EAAoBC,EAAM,WAGrC,CAAC,CAAE,KAAAC,EAAO,KAAM,MAAAC,EAAQ,WAAY,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAAQ,~~CAvEnE~~,IAAAC,~~EAwEE~~,MAAMC,EAAgBP,EAAM,SAAS,QAAQG,CAAQ,EAC/CK,EAAgBD,EAAc,QAAU,EACxCE,EACJD,GACAR,EAAM,eAAeO,EAAc,CAAC,CAAC,KACrCD,EAAAC,EAAc,CAAC,IAAf,~~KAAA~~,~~OAAAD~~,EAAkB,QAASI,EAE7B,OACEV,EAAA,cAACJ,~~EACC~~,~~CAAA~~,IAAKS,EACL,KAAMJ,EACN,WAAYQ,EACZ,MAAOP,EACN,GAAGE,~~CAGFG~~,~~EAAAA~~,EAAc,IAAKI,GAEf,CAACH,IACA,OAAOG,GAAU,UAAY,OAAOA,GAAU,UAExCX,EAAA,cAAC,~~OAAK~~,~~CAAA~~,IAAKW,~~CAAQA~~,~~EAAAA~~,CAAM,EAC9BX,EAAM,eAAeW,CAAK,IACxBA,GAAA,~~KAAAA~~,OAAAA,EAAO,QAASD,EACXV,EAAM,aAAaW,EAAO,CAAE,GAAGA,EAAM,MAAO,KAAAV,CAAK,CAAC,EAEtDU,CACR,CAEL,CAEJ,CAAC"}
1	+ {"version":3,"file":"ToggleGroupButton.js","sources":["../../../src/components/toggle-group/ToggleGroupButton.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Icon } from '../icon'\nimport { ToggleGroupItem } from './ToggleGroupItem'\n\nexport const StyledButton = styled(\n ToggleGroupItem,\n {\n base: [\n 'grow',\n 'flex',\n 'items-center',\n 'justify-center',\n 'font-semibold',\n 'leading-none',\n 'py-1'\n ],\n variants: {\n size: {\n sm: [':not-last:mr-2', 'min-h-8', 'px-4', 'text-sm'],\n md: [':not-last:mr-3', 'min-h-10', 'px-8', 'text-md'],\n lg: ['*:not-last:mr-3', 'min-h-12', 'px-8', 'text-lg']\n },\n isIconOnly: {\n true: []\n },\n theme: {\n standard: [],\n modern: []\n }\n },\n compoundVariants: [\n {\n isIconOnly: true,\n size: 'sm',\n class: ['min-w-8', 'p-0']\n },\n {\n isIconOnly: true,\n size: 'md',\n class: ['min-w-10', 'p-0']\n },\n {\n isIconOnly: true,\n size: 'lg',\n class: ['min-w-12', 'p-0']\n },\n {\n isIconOnly: true,\n size: 'sm',\n theme: 'modern',\n class: ['min-w-10', 'p-0']\n },\n {\n isIconOnly: true,\n size: 'md',\n theme: 'modern',\n class: ['min-w-12', 'p-0']\n },\n {\n isIconOnly: true,\n size: 'lg',\n theme: 'modern',\n class: ['min-w-15', 'p-0']\n }\n ]\n },\n { enabledResponsiveVariants: true }\n)\n\nexport const ToggleGroupButton = React.forwardRef<\n HTMLButtonElement,\n React.ComponentProps<typeof StyledButton>\n>(({ size = 'md', theme = 'standard', children, ...rest }, ref) => {\n const childrenArray = React.Children.toArray(children)\n const isSingleChild = childrenArray.length <= 1\n const isIconOnly =\n isSingleChild &&\n React.isValidElement(childrenArray[0]) &&\n childrenArray[0]?.type === Icon\n\n return (\n <StyledButton\n ref={ref}\n size={size}\n isIconOnly={isIconOnly}\n theme={theme}\n {...rest}\n >\n {\n childrenArray.map((child) => {\n if (\n !isSingleChild &&\n (typeof child === 'string' \|\| typeof child === 'number')\n )\n return <span key={child}>{child}</span>\n if (React.isValidElement(child)) {\n if (child?.type === Icon)\n return React.cloneElement(child, { ...child.props, size })\n }\n return child\n }) as React.ReactElement[]\n }\n </StyledButton>\n )\n})\n"],"names":["StyledButton","styled","ToggleGroupItem","ToggleGroupButton","React","size","theme","children","rest","ref","_a","childrenArray","isSingleChild","isIconOnly","Icon","child"],"mappings":"+JAOa,MAAAA,EAAeC,EAC1BC,EACA,CACE,KAAM,CACJ,OACA,OACA,eACA,iBACA,gBACA,eACA,MACF,EACA,SAAU,CACR,KAAM,CACJ,GAAI,CAAC,kBAAmB,UAAW,OAAQ,SAAS,EACpD,GAAI,CAAC,kBAAmB,WAAY,OAAQ,SAAS,EACrD,GAAI,CAAC,kBAAmB,WAAY,OAAQ,SAAS,CACvD,EACA,WAAY,CACV,KAAM,CACR,CAAA,EACA,MAAO,CACL,SAAU,CAAC,EACX,OAAQ,CAAA,CACV,CACF,EACA,iBAAkB,CAChB,CACE,WAAY,GACZ,KAAM,KACN,MAAO,CAAC,UAAW,KAAK,CAC1B,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,CAAC,WAAY,KAAK,CAC3B,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,CAAC,WAAY,KAAK,CAC3B,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,SACP,MAAO,CAAC,WAAY,KAAK,CAC3B,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,SACP,MAAO,CAAC,WAAY,KAAK,CAC3B,EACA,CACE,WAAY,GACZ,KAAM,KACN,MAAO,SACP,MAAO,CAAC,WAAY,KAAK,CAC3B,CACF,CACF,EACA,CAAE,0BAA2B,EAAK,CACpC,EAEaC,EAAoBC,EAAM,WAGrC,CAAC,CAAE,KAAAC,EAAO,KAAM,MAAAC,EAAQ,WAAY,SAAAC,EAAU,GAAGC,CAAK,EAAGC,IAAQ,CA3EnE,IAAAC,EA4EE,MAAMC,EAAgBP,EAAM,SAAS,QAAQG,CAAQ,EAC/CK,EAAgBD,EAAc,QAAU,EACxCE,EACJD,GACAR,EAAM,eAAeO,EAAc,CAAC,CAAC,KACrCD,EAAAC,EAAc,CAAC,IAAf,KAAAD,OAAAA,EAAkB,QAASI,EAE7B,OACEV,EAAA,cAACJ,EAAA,CACC,IAAKS,EACL,KAAMJ,EACN,WAAYQ,EACZ,MAAOP,EACN,GAAGE,CAAAA,EAGFG,EAAc,IAAKI,GAEf,CAACH,IACA,OAAOG,GAAU,UAAY,OAAOA,GAAU,UAExCX,EAAA,cAAC,OAAA,CAAK,IAAKW,CAAAA,EAAQA,CAAM,EAC9BX,EAAM,eAAeW,CAAK,IACxBA,GAAA,KAAA,OAAAA,EAAO,QAASD,EACXV,EAAM,aAAaW,EAAO,CAAE,GAAGA,EAAM,MAAO,KAAAV,CAAK,CAAC,EAEtDU,CACR,CAEL,CAEJ,CAAC"}

package/dist/components/toggle-group/ToggleGroupItem.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import * as ToggleGroup from '@radix-ui/react-toggle-group';
-export declare const ToggleGroupItem: import("react").ForwardRefExoticComponent<Omit<Omit<ToggleGroup.ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+export declare const ToggleGroupItem: import("react").ForwardRefExoticComponent<Omit<ToggleGroup.ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: import("react").ElementType;
-}, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+}>;

package/dist/components/toggle-group/ToggleGroupRoot.d.ts CHANGED Viewed

@@ -3,19 +3,19 @@ type RootType = {
     orientation?: 'horizontal' | 'vertical';
     isFullWidth?: boolean;
 };
-export declare const StyledRoot: React.ForwardRefExoticComponent<Omit<Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
+export declare const StyledRoot: React.ForwardRefExoticComponent<Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
 }, "ref"> | Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
 }, "ref">) & React.RefAttributes<HTMLDivElement>, "theme" | "direction" | "isFullWidth" | "hasGap"> & {
-    isFullWidth?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    hasGap?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    direction?: ("row" | "column" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "column">>) | undefined;
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+    isFullWidth?: boolean | undefined;
+    hasGap?: boolean | undefined;
+    direction?: "row" | "column" | undefined;
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
-export declare const ToggleGroupRoot: React.ForwardRefExoticComponent<Omit<Pick<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+}>;
+export declare const ToggleGroupRoot: React.ForwardRefExoticComponent<Omit<Pick<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "direction" | "align" | "wrap" | "justify" | "gap"> & {
     direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
@@ -25,16 +25,16 @@ export declare const ToggleGroupRoot: React.ForwardRefExoticComponent<Omit<Pick<
     gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>, "wrap" | "gap"> & Omit<Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
+}, "wrap" | "gap"> & Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
 }, "ref"> | Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & React.RefAttributes<HTMLDivElement> & {
     disableDeselect?: boolean;
 }, "ref">) & React.RefAttributes<HTMLDivElement>, "theme" | "direction" | "isFullWidth" | "hasGap"> & {
-    isFullWidth?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    hasGap?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    direction?: ("row" | "column" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "column">>) | undefined;
-    theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+    isFullWidth?: boolean | undefined;
+    hasGap?: boolean | undefined;
+    direction?: "row" | "column" | undefined;
+    theme?: "standard" | "modern" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement> & RootType, "ref"> & React.RefAttributes<HTMLDivElement>>;
+} & RootType, "ref"> & React.RefAttributes<HTMLDivElement>>;
 export {};

package/dist/components/toggle-group/index.d.ts CHANGED Viewed

@@ -1,21 +1,21 @@
 export declare const ToggleGroup: {
-    Item: import("react").ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
-        theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+    Item: import("react").ForwardRefExoticComponent<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
+        theme?: "standard" | "modern" | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-    Button: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
-        theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+    }>;
+    Button: import("react").ForwardRefExoticComponent<Omit<Omit<Omit<import("@radix-ui/react-toggle-group").ToggleGroupItemProps & import("react").RefAttributes<HTMLButtonElement>, "theme"> & {
+        theme?: "standard" | "modern" | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>, "theme" | "size" | "isIconOnly"> & {
+    }, "theme" | "size" | "isIconOnly"> & {
         size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
         isIconOnly?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
         theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
-    Root: import("react").ForwardRefExoticComponent<Omit<Pick<Omit<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    }, "ref"> & import("react").RefAttributes<HTMLButtonElement>>;
+    Root: import("react").ForwardRefExoticComponent<Omit<Pick<Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
         ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
     }, "direction" | "align" | "wrap" | "justify" | "gap"> & {
         direction?: ("row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "row-reverse" | "column" | "column-reverse" | "inherit" | "initial" | "revert" | "revert-layer" | "unset">>) | undefined;
@@ -25,18 +25,18 @@ export declare const ToggleGroup: {
         gap?: (0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24 | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", 0 | 1 | 2 | "0" | 3 | 4 | 5 | 6 | 7 | 8 | 9 | "1" | "2" | "3" | "4" | "24" | "5" | "6" | "7" | "8" | "9" | 24>>) | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLDivElement>, "wrap" | "gap"> & Omit<Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & import("react").RefAttributes<HTMLDivElement> & {
+    }, "wrap" | "gap"> & Omit<(Omit<import("@radix-ui/react-toggle-group").ToggleGroupSingleProps & import("react").RefAttributes<HTMLDivElement> & {
         disableDeselect?: boolean;
     }, "ref"> | Omit<import("@radix-ui/react-toggle-group").ToggleGroupMultipleProps & import("react").RefAttributes<HTMLDivElement> & {
         disableDeselect?: boolean;
     }, "ref">) & import("react").RefAttributes<HTMLDivElement>, "theme" | "direction" | "isFullWidth" | "hasGap"> & {
-        isFullWidth?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-        hasGap?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-        direction?: ("row" | "column" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "row" | "column">>) | undefined;
-        theme?: ("standard" | "modern" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "modern">>) | undefined;
+        isFullWidth?: boolean | undefined;
+        hasGap?: boolean | undefined;
+        direction?: "row" | "column" | undefined;
+        theme?: "standard" | "modern" | undefined;
     } & {
         as?: import("react").ElementType;
-    }, "ref"> & import("react").RefAttributes<HTMLDivElement> & {
+    } & {
         orientation?: "horizontal" | "vertical";
         isFullWidth?: boolean;
     }, "ref"> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/components/tooltip/Tooltip.d.ts CHANGED Viewed

@@ -5,11 +5,11 @@ export declare const Tooltip: {
     ({ children, delayDuration, ...remainingProps }: TooltipProps): React.JSX.Element;
     displayName: string;
 } & {
-    Content: ({ children, side, sideOffset, size, ...remainingProps }: Omit<Omit<import("@radix-ui/react-tooltip").TooltipContentProps & React.RefAttributes<HTMLDivElement>, "size"> & {
-        size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+    Content: ({ children, side, sideOffset, size, ...remainingProps }: Omit<import("@radix-ui/react-tooltip").TooltipContentProps & React.RefAttributes<HTMLDivElement>, "size"> & {
+        size?: "sm" | "md" | "lg" | undefined;
     } & {
         as?: React.ElementType;
-    }, "ref"> & React.RefAttributes<HTMLDivElement> & import("@radix-ui/react-tooltip").TooltipContentProps) => React.JSX.Element;
+    } & import("@radix-ui/react-tooltip").TooltipContentProps & React.RefAttributes<HTMLDivElement>) => React.JSX.Element;
     Trigger: React.ForwardRefExoticComponent<import("@radix-ui/react-tooltip").TooltipTriggerProps & React.RefAttributes<HTMLButtonElement>>;
     Portal: React.FC<import("@radix-ui/react-tooltip").TooltipPortalProps>;
     Provider: React.FC<import("@radix-ui/react-tooltip").TooltipProviderProps>;

package/dist/components/tooltip/TooltipContent.d.ts CHANGED Viewed

@@ -1,10 +1,10 @@
 import { Content } from '@radix-ui/react-tooltip';
 import * as React from 'react';
-declare const StyledContent: React.ForwardRefExoticComponent<Omit<Omit<import("@radix-ui/react-tooltip").TooltipContentProps & React.RefAttributes<HTMLDivElement>, "size"> & {
-    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+declare const StyledContent: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-tooltip").TooltipContentProps & React.RefAttributes<HTMLDivElement>, "size"> & {
+    size?: "sm" | "md" | "lg" | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 type TooltipContentProps = React.ComponentProps<typeof StyledContent> & React.ComponentProps<typeof Content>;
 export declare const TooltipContent: ({ children, side, sideOffset, size, ...remainingProps }: TooltipContentProps) => React.JSX.Element;
 export {};

package/dist/components/top-bar/TopBar.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Theme } from '../../styled';
-declare const StyledRoot: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+declare const StyledRoot: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
 }, "size" | "appearance" | "diffused" | "hasScrolled"> & {
     hasScrolled?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
@@ -9,24 +9,22 @@ declare const StyledRoot: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.D
     appearance?: ("standard" | "rounded" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "standard" | "rounded">>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLDivElement>>;
+}>;
 type StyledRootProps = React.ComponentProps<typeof StyledRoot>;
-type TopBarProps = StyledRootProps & {
-    className?: string;
-} & React.ComponentProps<typeof Theme>;
+type TopBarProps = StyledRootProps & React.ComponentProps<typeof Theme>;
 export declare const TopBar: {
-    ({ size, diffused, theme, className, appearance, ...props }: React.PropsWithChildren<TopBarProps>): React.JSX.Element;
+    ({ size, diffused, theme, appearance, ...props }: React.PropsWithChildren<TopBarProps>): React.JSX.Element;
     displayName: string;
 } & {
-    Brand: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+    Brand: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
         ref?: ((instance: HTMLAnchorElement | null) => void) | React.RefObject<HTMLAnchorElement> | null | undefined;
     }, never> & {
         as?: React.ElementType;
-    }, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+    }>;
     BrandLogo: ({ src, alt, className }: Pick<React.ComponentProps<typeof import("..").Image>, "src" | "alt"> & {
         className?: string;
     }) => JSX.Element;
-    BrandName: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
+    BrandName: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
         ref?: ((instance: HTMLParagraphElement | null) => void) | React.RefObject<HTMLParagraphElement> | null | undefined;
     }, "size" | "weight" | "family" | "noCapsize"> & {
         weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "normal">>) | undefined;
@@ -35,12 +33,12 @@ export declare const TopBar: {
         noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
     } & {
         as?: React.ElementType;
-    }, "ref"> & React.RefAttributes<HTMLParagraphElement>, "as"> & {
+    }, "as"> & {
         as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
     }, "ref"> & React.RefAttributes<HTMLParagraphElement>, never> & {
         as?: React.ElementType;
-    }, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
-    ActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+    }>;
+    ActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
         ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
     }, "theme" | "size" | "appearance" | "isRounded"> & {
         theme?: ("warning" | "success" | "neutral" | "primary" | "white" | "primaryDark" | "danger" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "warning" | "success" | "neutral" | "primary" | "white" | "primaryDark" | "danger">>) | undefined;
@@ -49,7 +47,7 @@ export declare const TopBar: {
         isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
     } & {
         as?: React.ElementType;
-    }, "ref"> & React.RefAttributes<HTMLButtonElement>, "children" | "label" | keyof import("../../types").NavigatorActions | "hasTooltip" | "tooltipSide"> & {
+    }, "children" | "label" | keyof import("../../types").NavigatorActions | "hasTooltip" | "tooltipSide"> & {
         children: React.ReactNode;
         label: string;
     } & Omit<import("../../utilities/optional-tooltip-wrapper").TOptionalTooltipWrapperProps, "label"> & import("../../types").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "children" | "size"> & {

package/dist/components/top-bar/TopBar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import*as e from"react";import{styled as r,Theme as p}from"../../styled.js";import{useWindowScrollPosition as c}from"../../utilities/hooks/useWindowScrollPosition.js";import{Divider as l}from"../divider/Divider.js";import{Flex as b}from"../flex/Flex.js";import{colorSchemes as u}from"./TopBar.colorscheme.config.js";import{TopBarActionIcon as f}from"./TopBarActionIcon.js";import{TopBarBrand as h,TopBarBrandLogo as x,TopBarBrandName as B}from"./TopBarBrand.js";const g=()=>e.createElement(l,{orientation:"vertical",className:"bg-divider h-6"}),w=r("div",{base:["bg-(--background)","sticky","flex","items-center","z-1","transition-shadow","duration-200","ease-out"],variants:{hasScrolled:{true:["shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]"]},size:{md:["h-16"],lg:["h-24"]},diffused:{true:["supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]","supports-color-mix:backdrop-blur-sm"]},appearance:{standard:["w-screen","max-w-full","top-0","border-b","border-b-(--border-bottom)"],rounded:["w-full","top-2","p-2","border","border-white","rounded-round"]}}}),T=r(b,{base:["items-center","h-10","mx-4","w-full","md:mx-8"]}),o=({size:a="md",diffused:t,theme:s,className:d,appearance:i="standard",...m})=>{const{y:n}=c();return e.createElement(p,{theme:s||u.light},e.createElement(w,{className:d,hasScrolled:!!n,diffused:t,appearance:i,size:a},e.createElement(T,{...m})))},v=Object.assign(o,{Brand:h,BrandLogo:x,BrandName:B,ActionIcon:f,Divider:g});o.displayName="TopBar";export{v as TopBar};
+import*as e from"react";import{styled as r,Theme as m}from"../../styled.js";import{useWindowScrollPosition as p}from"../../utilities/hooks/useWindowScrollPosition.js";import{Divider as l}from"../divider/Divider.js";import{Flex as c}from"../flex/Flex.js";import{colorSchemes as b}from"./TopBar.colorscheme.config.js";import{TopBarActionIcon as f}from"./TopBarActionIcon.js";import{TopBarBrand as u,TopBarBrandLogo as h,TopBarBrandName as x}from"./TopBarBrand.js";const B=()=>e.createElement(l,{orientation:"vertical",className:"bg-divider h-6"}),g=r("div",{base:["bg-(--background)","sticky","flex","items-center","z-1","transition-shadow","duration-200","ease-out"],variants:{hasScrolled:{true:["shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]"]},size:{md:["h-16"],lg:["h-24"]},diffused:{true:["supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]","supports-color-mix:backdrop-blur-sm"]},appearance:{standard:["w-screen","max-w-full","top-0","border-b","border-b-(--border-bottom)"],rounded:["w-full","top-2","p-2","border","border-white","rounded-full"]}}},{enabledResponsiveVariants:!0}),w=r(c,{base:["items-center","h-10","mx-4","w-full","md:mx-8"]}),o=({size:a="md",diffused:t,theme:i,appearance:s="standard",...d})=>{const{y:n}=p();return e.createElement(m,{theme:i||b.light},e.createElement(g,{hasScrolled:!!n,diffused:t,appearance:s,size:a},e.createElement(w,{...d})))},T=Object.assign(o,{Brand:u,BrandLogo:h,BrandName:x,ActionIcon:f,Divider:B});o.displayName="TopBar";export{T as TopBar};
 //# sourceMappingURL=TopBar.js.map

package/dist/components/top-bar/TopBar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TopBar.js","sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled, Theme } from '~/styled'\nimport { useWindowScrollPosition } from '~/utilities/hooks/useWindowScrollPosition'\n\nimport { Divider } from '../divider'\nimport { Flex } from '../flex'\nimport { colorSchemes as topBarColorSchemes } from './TopBar.colorscheme.config'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\nconst TopBarDivider = () => (\n <Divider orientation=\"vertical\" className=\"bg-divider h-6\" />\n)\n\nconst StyledRoot = styled('div', {\n base: [\n 'bg-(--background)',\n 'sticky',\n 'flex',\n 'items-center',\n 'z-1',\n 'transition-shadow',\n 'duration-200',\n 'ease-out'\n ],\n variants: {\n hasScrolled: {\n true: ['shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]']\n },\n size: {\n md: ['h-16'],\n lg: ['h-24']\n },\n diffused: {\n true: [\n 'supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]',\n 'supports-color-mix:backdrop-blur-sm'\n ]\n },\n appearance: {\n standard: [\n 'w-screen',\n 'max-w-full',\n 'top-0',\n 'border-b',\n 'border-b-(--border-bottom)'\n ],\n rounded: [\n 'w-full',\n 'top-2',\n 'p-2',\n 'border',\n 'border-white',\n 'rounded-~~round~~'\n ]\n }\n }\n})\n\nconst Container = styled(Flex, {\n base: ['items-center', 'h-10', 'mx-4', 'w-full', 'md:mx-8']\n})\n\ntype StyledRootProps = React.ComponentProps<typeof StyledRoot>\n\ntype TopBarProps = StyledRootProps & ~~{\n className?: string\n} &~~ React.ComponentProps<typeof Theme>\n\nconst TopBarComponent = ({\n size = 'md',\n diffused,\n theme,\n ~~className,\n~~ appearance = 'standard',\n ...props\n}: React.PropsWithChildren<TopBarProps>) => {\n const { y: scrollPositionY } = useWindowScrollPosition()\n\n return (\n <Theme theme={theme \|\| topBarColorSchemes['light']}>\n <StyledRoot\n ~~className={className}\n~~ hasScrolled={!!scrollPositionY}\n diffused={diffused}\n appearance={appearance}\n size={size}\n >\n <Container {...props} />\n </StyledRoot>\n </Theme>\n )\n}\n\nexport const TopBar = Object.assign(TopBarComponent, {\n Brand: TopBarBrand,\n BrandLogo: TopBarBrandLogo,\n BrandName: TopBarBrandName,\n ActionIcon: TopBarActionIcon,\n Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"names":["TopBarDivider","React","Divider","StyledRoot","styled","Container","Flex","TopBarComponent","size","diffused","theme","~~className","~~appearance","props","scrollPositionY","useWindowScrollPosition","Theme","topBarColorSchemes","TopBar","TopBarBrand","TopBarBrandLogo","TopBarBrandName","TopBarActionIcon"],"mappings":"8cAWA,MAAMA,EAAgB,IACpBC,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,UAAU,gBAAA,CAAiB,EAGvDC,EAAaC,~~EAAO~~,~~MAAO~~,~~CAC/B~~,KAAM,CACJ,oBACA,SACA,OACA,eACA,MACA,oBACA,eACA,UACF,EACA,SAAU,CACR,YAAa,CACX,KAAM,CAAC,8CAA8C,CACvD,EACA,KAAM,CACJ,GAAI,CAAC,MAAM,EACX,GAAI,CAAC,MAAM,CACb,EACA,SAAU,CACR,KAAM,CACJ,uEACA,qCACF,CACF,EACA,WAAY,CACV,SAAU,CACR,WACA,aACA,QACA,WACA,4BACF,EACA,QAAS,CACP,SACA,QACA,MACA,SACA,eACA,~~eACF~~,CACF,CACF,CACF,~~CAAC~~,~~EAEKC~~,EAAYD,EAAOE,EAAM,CAC7B,KAAM,CAAC,eAAgB,OAAQ,OAAQ,SAAU,SAAS,CAC5D,CAAC,~~EAQKC~~,EAAkB,CAAC,CACvB,KAAAC,EAAO,KACP,SAAAC,EACA,MAAAC,EACA,~~UAAAC,EACA,~~WAAAC,EAAa,WACb,GAAGC,CACL,IAA4C,CAC1C,KAAM,CAAE,EAAGC,CAAgB,EAAIC,EAE/B,EAAA,~~OACEd~~,EAAA,~~cAACe~~,EAAA,CAAM,~~MAAON~~,~~GAASO~~,EAAmB,~~KAAA~~,~~EACxChB~~,EAAA,cAACE,EAAA,CACC,~~UAAWQ,EACX,~~YAAa,CAAC,~~CAACG~~,EACf,~~SAAUL~~,EACV,~~WAAYG~~,EACZ,~~KAAMJ~~,CAAAA,EAENP,EAAA,cAACI,EAAA,CAAW,~~GAAGQ~~,CAAO,CAAA,CACxB,CACF,CAEJ,EAEaK,EAAS,OAAO,~~OAAOX~~,EAAiB,CACnD,~~MAAOY~~,EACP,UAAWC,EACX,UAAWC,EACX,WAAYC,EACZ,~~QAAStB~~,CACX,CAAC,EAEDO,EAAgB,YAAc"}
1	+ {"version":3,"file":"TopBar.js","sources":["../../../src/components/top-bar/TopBar.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled, Theme } from '~/styled'\nimport { useWindowScrollPosition } from '~/utilities/hooks/useWindowScrollPosition'\n\nimport { Divider } from '../divider'\nimport { Flex } from '../flex'\nimport { colorSchemes as topBarColorSchemes } from './TopBar.colorscheme.config'\nimport { TopBarActionIcon } from './TopBarActionIcon'\nimport { TopBarBrand, TopBarBrandLogo, TopBarBrandName } from './TopBarBrand'\n\nconst TopBarDivider = () => (\n <Divider orientation=\"vertical\" className=\"bg-divider h-6\" />\n)\n\nconst StyledRoot = styled(\n 'div',\n {\n base: [\n 'bg-(--background)',\n 'sticky',\n 'flex',\n 'items-center',\n 'z-1',\n 'transition-shadow',\n 'duration-200',\n 'ease-out'\n ],\n variants: {\n hasScrolled: {\n true: ['shadow-[0px_4px_4px_-2px_rgba(31,31,31,0.1)]']\n },\n size: {\n md: ['h-16'],\n lg: ['h-24']\n },\n diffused: {\n true: [\n 'supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]',\n 'supports-color-mix:backdrop-blur-sm'\n ]\n },\n appearance: {\n standard: [\n 'w-screen',\n 'max-w-full',\n 'top-0',\n 'border-b',\n 'border-b-(--border-bottom)'\n ],\n rounded: [\n 'w-full',\n 'top-2',\n 'p-2',\n 'border',\n 'border-white',\n 'rounded-full'\n ]\n }\n }\n },\n {\n enabledResponsiveVariants: true\n }\n)\n\nconst Container = styled(Flex, {\n base: ['items-center', 'h-10', 'mx-4', 'w-full', 'md:mx-8']\n})\n\ntype StyledRootProps = React.ComponentProps<typeof StyledRoot>\n\ntype TopBarProps = StyledRootProps & React.ComponentProps<typeof Theme>\n\nconst TopBarComponent = ({\n size = 'md',\n diffused,\n theme,\n appearance = 'standard',\n ...props\n}: React.PropsWithChildren<TopBarProps>) => {\n const { y: scrollPositionY } = useWindowScrollPosition()\n\n return (\n <Theme theme={theme \|\| topBarColorSchemes['light']}>\n <StyledRoot\n hasScrolled={!!scrollPositionY}\n diffused={diffused}\n appearance={appearance}\n size={size}\n >\n <Container {...props} />\n </StyledRoot>\n </Theme>\n )\n}\n\nexport const TopBar = Object.assign(TopBarComponent, {\n Brand: TopBarBrand,\n BrandLogo: TopBarBrandLogo,\n BrandName: TopBarBrandName,\n ActionIcon: TopBarActionIcon,\n Divider: TopBarDivider\n})\n\nTopBarComponent.displayName = 'TopBar'\n"],"names":["TopBarDivider","React","Divider","StyledRoot","styled","Container","Flex","TopBarComponent","size","diffused","theme","appearance","props","scrollPositionY","useWindowScrollPosition","Theme","topBarColorSchemes","TopBar","TopBarBrand","TopBarBrandLogo","TopBarBrandName","TopBarActionIcon"],"mappings":"8cAWA,MAAMA,EAAgB,IACpBC,EAAA,cAACC,EAAA,CAAQ,YAAY,WAAW,UAAU,gBAAA,CAAiB,EAGvDC,EAAaC,EACjB,MACA,CACE,KAAM,CACJ,oBACA,SACA,OACA,eACA,MACA,oBACA,eACA,UACF,EACA,SAAU,CACR,YAAa,CACX,KAAM,CAAC,8CAA8C,CACvD,EACA,KAAM,CACJ,GAAI,CAAC,MAAM,EACX,GAAI,CAAC,MAAM,CACb,EACA,SAAU,CACR,KAAM,CACJ,uEACA,qCACF,CACF,EACA,WAAY,CACV,SAAU,CACR,WACA,aACA,QACA,WACA,4BACF,EACA,QAAS,CACP,SACA,QACA,MACA,SACA,eACA,cACF,CACF,CACF,CACF,EACA,CACE,0BAA2B,EAC7B,CACF,EAEMC,EAAYD,EAAOE,EAAM,CAC7B,KAAM,CAAC,eAAgB,OAAQ,OAAQ,SAAU,SAAS,CAC5D,CAAC,EAMKC,EAAkB,CAAC,CACvB,KAAAC,EAAO,KACP,SAAAC,EACA,MAAAC,EACA,WAAAC,EAAa,WACb,GAAGC,CACL,IAA4C,CAC1C,KAAM,CAAE,EAAGC,CAAgB,EAAIC,EAE/B,EAAA,OACEb,EAAA,cAACc,EAAA,CAAM,MAAOL,GAASM,EAAmB,KACxCf,EAAAA,EAAA,cAACE,EAAA,CACC,YAAa,CAAC,CAACU,EACf,SAAUJ,EACV,WAAYE,EACZ,KAAMH,CAAAA,EAENP,EAAA,cAACI,EAAA,CAAW,GAAGO,CAAO,CAAA,CACxB,CACF,CAEJ,EAEaK,EAAS,OAAO,OAAOV,EAAiB,CACnD,MAAOW,EACP,UAAWC,EACX,UAAWC,EACX,WAAYC,EACZ,QAASrB,CACX,CAAC,EAEDO,EAAgB,YAAc"}

package/dist/components/top-bar/TopBarBrand.d.ts CHANGED Viewed

@@ -3,7 +3,7 @@ import { Image } from '../image';
 export declare const TopBarBrandLogo: ({ src, alt, className }: Pick<React.ComponentProps<typeof Image>, "src" | "alt"> & {
     className?: string;
 }) => JSX.Element;
-export declare const TopBarBrandName: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
+export declare const TopBarBrandName: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "ref"> & {
     ref?: ((instance: HTMLParagraphElement | null) => void) | React.RefObject<HTMLParagraphElement> | null | undefined;
 }, "size" | "weight" | "family" | "noCapsize"> & {
     weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "normal">>) | undefined;
@@ -12,13 +12,13 @@ export declare const TopBarBrandName: React.ForwardRefExoticComponent<Omit<Omit<
     noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLParagraphElement>, "as"> & {
+}, "as"> & {
     as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
 }, "ref"> & React.RefAttributes<HTMLParagraphElement>, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
-export declare const TopBarBrand: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
+}>;
+export declare const TopBarBrand: React.ForwardRefExoticComponent<Omit<Omit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, "ref"> & {
     ref?: ((instance: HTMLAnchorElement | null) => void) | React.RefObject<HTMLAnchorElement> | null | undefined;
 }, never> & {
     as?: React.ElementType;
-}, "ref"> & React.RefAttributes<HTMLAnchorElement>>;
+}>;