npm - @atom-learning/components - Versions diffs - 8.0.3 → 8.1.1 - Mend

@atom-learning/components 8.0.3 → 8.1.1

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 (833) hide show

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationMenuVerticalAccordionContent.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalAccordionContent.tsx"],"sourcesContent":["import { Content } from '@radix-ui/react-collapsible'\nimport React from 'react'\n\nimport { NavigationMenuVerticalAccordionContext } from './NavigationMenuVerticalAccordion'\nimport { NavigationMenuVerticalList } from './NavigationMenuVerticalList'\n\nconst StyledNavigationMenuVerticalAccordionContent = Content\n\ntype ~~TNavigationMenuVerticalAccordionContentProps~~ = React.ComponentProps<\n typeof StyledNavigationMenuVerticalAccordionContent\n> &\n React.ComponentProps<typeof NavigationMenuVerticalList>\n\nexport const NavigationMenuVerticalAccordionContent = ({\n children,\n ...rest\n}: ~~TNavigationMenuVerticalAccordionContentProps~~): ~~React.JSX.Element~~ => {\n const { triggerRef } = React.useContext(\n NavigationMenuVerticalAccordionContext\n )\n\n const handleOnKeydown = (e) => {\n if (!triggerRef?.current) return\n if (e.key === 'Escape') {\n e.stopPropagation()\n e.preventDefault()\n triggerRef.current.focus()\n triggerRef.current.click()\n }\n }\n\n return (\n <StyledNavigationMenuVerticalAccordionContent\n onKeyDown={handleOnKeydown}\n {...rest}\n >\n <NavigationMenuVerticalList>{children}</NavigationMenuVerticalList>\n </StyledNavigationMenuVerticalAccordionContent>\n )\n}\n"],"mappings":";;;;;;AAMA,IAAM,+CAA+C;AAOrD,IAAa,0CAA0C,EACrD,UACA,GAAG,~~WACkE~~;~~CACrE~~,MAAM,EAAE,eAAe,~~MAAM~~,WAC3B,~~uCACD~~;~~CAED~~,MAAM,mBAAmB,MAAM;~~AAC7B~~,~~MAAI~~,CAAC,YAAY,~~QAAS~~;~~AAC1B~~,~~MAAI~~,EAAE,QAAQ,UAAU;~~AACtB~~,~~KAAE~~,~~iBAAiB~~;~~AACnB~~,~~KAAE~~,~~gBAAgB~~;~~AAClB~~,~~cAAW~~,QAAQ,~~OAAO~~;~~AAC1B~~,~~cAAW~~,QAAQ,~~OAAO;;;AAI9B~~,~~QACE~~,oBAAC,8CAAD;EACE,WAAW;EACX,GAAI;YAEJ,oBAAC,4BAAD,EAA6B,~~UAAsC~~,CAAA;~~EACtB~~,CAAA"}
1	+ {"version":3,"file":"NavigationMenuVerticalAccordionContent.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalAccordionContent.tsx"],"sourcesContent":["import { Content } from '@radix-ui/react-collapsible'\nimport * as React from 'react'\n\nimport { NavigationMenuVerticalAccordionContext } from './NavigationMenuVerticalAccordion'\nimport { NavigationMenuVerticalList } from './NavigationMenuVerticalList'\n\nconst StyledNavigationMenuVerticalAccordionContent = Content\n\ntype NavigationMenuVerticalAccordionContentProps = React.ComponentProps<\n typeof StyledNavigationMenuVerticalAccordionContent\n> &\n React.ComponentProps<typeof NavigationMenuVerticalList>\n\nexport const NavigationMenuVerticalAccordionContent = ({\n children,\n ...rest\n}: NavigationMenuVerticalAccordionContentProps) => {\n const { triggerRef } = React.useContext(\n NavigationMenuVerticalAccordionContext\n )\n\n const handleOnKeydown = (e) => {\n if (!triggerRef?.current) return\n if (e.key === 'Escape') {\n e.stopPropagation()\n e.preventDefault()\n triggerRef.current.focus()\n triggerRef.current.click()\n }\n }\n\n return (\n <StyledNavigationMenuVerticalAccordionContent\n onKeyDown={handleOnKeydown}\n {...rest}\n >\n <NavigationMenuVerticalList>{children}</NavigationMenuVerticalList>\n </StyledNavigationMenuVerticalAccordionContent>\n )\n}\n"],"mappings":";;;;;;AAMA,IAAM,+CAA+C;AAOrD,IAAa,0CAA0C,EACrD,UACA,GAAG,WAC8C;CACjD,MAAM,EAAE,eAAe,QAAM,WAC3B,sCACF;CAEA,MAAM,mBAAmB,MAAM;EAC7B,IAAI,CAAC,YAAY,SAAS;EAC1B,IAAI,EAAE,QAAQ,UAAU;GACtB,EAAE,gBAAgB;GAClB,EAAE,eAAe;GACjB,WAAW,QAAQ,MAAM;GACzB,WAAW,QAAQ,MAAM;EAC3B;CACF;CAEA,OACE,oBAAC,8CAAD;EACE,WAAW;EACX,GAAI;YAEJ,oBAAC,4BAAD,EAA6B,SAAqC,CAAA;CACtB,CAAA;AAElD"}

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionTrigger.d.ts CHANGED Viewed

@@ -1,9 +1,9 @@
-import React from 'react';
+import * as React from 'react';
 declare const StyledNavigationMenuVerticalAccordionTrigger: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-collapsible").CollapsibleTriggerProps & React.RefAttributes<HTMLButtonElement>, "size"> & {
-    size?: "md" | "lg" | undefined;
+    size?: "lg" | "md" | undefined;
 } & {
     as?: React.ElementType;
 }>;
-type TNavigationMenuAccordionTriggerProps = React.ComponentProps<typeof StyledNavigationMenuVerticalAccordionTrigger>;
-export declare const NavigationMenuVerticalAccordionTrigger: ({ children, ...rest }: TNavigationMenuAccordionTriggerProps) => React.JSX.Element;
+type NavigationMenuAccordionTriggerProps = React.ComponentProps<typeof StyledNavigationMenuVerticalAccordionTrigger>;
+export declare const NavigationMenuVerticalAccordionTrigger: ({ children, ...rest }: NavigationMenuAccordionTriggerProps) => React.JSX.Element;
 export {};

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionTrigger.js CHANGED Viewed

@@ -3,7 +3,7 @@ import { Icon } from "../icon/Icon.js";
 import { NavigationMenuVerticalAccordionContext } from "./NavigationMenuVerticalAccordion.js";
 import { navigationMenuVerticalItemStyles } from "./NavigationMenuVertical.styles.js";
 import { NavigationMenuVerticalItemContent } from "./NavigationMenuVerticalItemContent.js";
-import React from "react";
+import * as React$1 from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ChevronDown } from "@atom-learning/icons";
 import { Trigger } from "@radix-ui/react-collapsible";
@@ -22,7 +22,7 @@ var StyledIcon = styled(Icon, { base: [
 	"[[data-state=open]>&]:rotate-180"
 ] });
 var NavigationMenuVerticalAccordionTrigger = ({ children, ...rest }) => {
-	const { setTriggerRef } = React.useContext(NavigationMenuVerticalAccordionContext);
+	const { setTriggerRef } = React$1.useContext(NavigationMenuVerticalAccordionContext);
 	return /* @__PURE__ */ jsx(Link, {
 		asChild: true,
 		children: /* @__PURE__ */ jsx(StyledNavigationMenuVerticalAccordionTrigger, {

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalAccordionTrigger.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationMenuVerticalAccordionTrigger.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalAccordionTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport { Trigger } from '@radix-ui/react-collapsible'\nimport { Link } from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { ~~Icon~~ } from '~~~/components/icon/Icon~~'\nimport { ~~styled~~ } from '~~~/styled~~'\n\nimport { navigationMenuVerticalItemStyles } from './NavigationMenuVertical.styles'\nimport { NavigationMenuVerticalAccordionContext } from './NavigationMenuVerticalAccordion'\nimport { NavigationMenuVerticalItemContent } from './NavigationMenuVerticalItemContent'\n\nconst StyledNavigationMenuVerticalAccordionTrigger = styled(Trigger, {\n base: navigationMenuVerticalItemStyles,\n variants: {\n size: {\n md: ['min-h-10'],\n lg: ['min-h-12']\n }\n }\n})\n\nconst StyledIcon = styled(Icon, {\n base: [\n 'transition-transform',\n 'duration-300',\n '[[data-state=open]>&]:rotate-180'\n ]\n})\n\ntype ~~TNavigationMenuAccordionTriggerProps~~ = React.ComponentProps<\n typeof StyledNavigationMenuVerticalAccordionTrigger\n>\n\nexport const NavigationMenuVerticalAccordionTrigger = ({\n children,\n ...rest\n}: ~~TNavigationMenuAccordionTriggerProps~~) => {\n const { setTriggerRef } = React.useContext(\n NavigationMenuVerticalAccordionContext\n )\n\n return (\n <Link asChild>\n <StyledNavigationMenuVerticalAccordionTrigger size=\"lg\" {...rest} asChild>\n <button\n type=\"button\"\n className=\"flex items-center justify-between gap-3\"\n ref={setTriggerRef}\n >\n <NavigationMenuVerticalItemContent>\n {children}\n </NavigationMenuVerticalItemContent>\n <StyledIcon size=\"sm\" is={ChevronDown} />\n </button>\n </StyledNavigationMenuVerticalAccordionTrigger>\n </Link>\n )\n}\n"],"mappings":";;;;;;;;;;;~~AAYA~~,IAAM,+CAA+C,OAAO,SAAS;CACnE,MAAM;CACN,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,~~WAAW~~;~~EAChB~~,IAAI,CAAC,~~WAAW~~;~~EACjB~~,EACF;~~CACF~~,CAAC;~~AAEF~~,IAAM,aAAa,OAAO,MAAM,EAC9B,MAAM;CACJ;CACA;CACA;~~CACD~~,EACF,CAAC;~~AAMF~~,IAAa,0CAA0C,EACrD,UACA,GAAG,~~WACuC~~;~~CAC1C~~,MAAM,EAAE,kBAAkB,~~MAAM~~,WAC9B,~~uCACD~~;~~AAED~~,~~QACE~~,oBAAC,MAAD;EAAM,SAAA;YACJ,oBAAC,8CAAD;GAA8C,MAAK;GAAK,GAAI;GAAM,SAAA;aAChE,qBAAC,UAAD;IACE,MAAK;IACL,WAAU;IACV,KAAK;cAHP,CAKE,oBAAC,mCAAD,EACG,~~UACiC~~,CAAA,~~EACpC~~,oBAAC,YAAD;KAAY,MAAK;KAAK,IAAI;~~KAAe~~,CAAA,CAClC;;~~GACoC~~,CAAA;~~EAC1C~~,CAAA"}
1	+ {"version":3,"file":"NavigationMenuVerticalAccordionTrigger.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalAccordionTrigger.tsx"],"sourcesContent":["import { ChevronDown } from '@atom-learning/icons'\nimport { Trigger } from '@radix-ui/react-collapsible'\nimport { Link } from '@radix-ui/react-navigation-menu'\nimport * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Icon } from '../icon/Icon'\nimport { navigationMenuVerticalItemStyles } from './NavigationMenuVertical.styles'\nimport { NavigationMenuVerticalAccordionContext } from './NavigationMenuVerticalAccordion'\nimport { NavigationMenuVerticalItemContent } from './NavigationMenuVerticalItemContent'\n\nconst StyledNavigationMenuVerticalAccordionTrigger = styled(Trigger, {\n base: navigationMenuVerticalItemStyles,\n variants: {\n size: {\n md: ['min-h-10'],\n lg: ['min-h-12']\n }\n }\n})\n\nconst StyledIcon = styled(Icon, {\n base: [\n 'transition-transform',\n 'duration-300',\n '[[data-state=open]>&]:rotate-180'\n ]\n})\n\ntype NavigationMenuAccordionTriggerProps = React.ComponentProps<\n typeof StyledNavigationMenuVerticalAccordionTrigger\n>\n\nexport const NavigationMenuVerticalAccordionTrigger = ({\n children,\n ...rest\n}: NavigationMenuAccordionTriggerProps) => {\n const { setTriggerRef } = React.useContext(\n NavigationMenuVerticalAccordionContext\n )\n\n return (\n <Link asChild>\n <StyledNavigationMenuVerticalAccordionTrigger size=\"lg\" {...rest} asChild>\n <button\n type=\"button\"\n className=\"flex items-center justify-between gap-3\"\n ref={setTriggerRef}\n >\n <NavigationMenuVerticalItemContent>\n {children}\n </NavigationMenuVerticalItemContent>\n <StyledIcon size=\"sm\" is={ChevronDown} />\n </button>\n </StyledNavigationMenuVerticalAccordionTrigger>\n </Link>\n )\n}\n"],"mappings":";;;;;;;;;;;AAWA,IAAM,+CAA+C,OAAO,SAAS;CACnE,MAAM;CACN,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;CACjB,EACF;AACF,CAAC;AAED,IAAM,aAAa,OAAO,MAAM,EAC9B,MAAM;CACJ;CACA;CACA;AACF,EACF,CAAC;AAMD,IAAa,0CAA0C,EACrD,UACA,GAAG,WACsC;CACzC,MAAM,EAAE,kBAAkB,QAAM,WAC9B,sCACF;CAEA,OACE,oBAAC,MAAD;EAAM,SAAA;YACJ,oBAAC,8CAAD;GAA8C,MAAK;GAAK,GAAI;GAAM,SAAA;aAChE,qBAAC,UAAD;IACE,MAAK;IACL,WAAU;IACV,KAAK;cAHP,CAKE,oBAAC,mCAAD,EACG,SACgC,CAAA,GACnC,oBAAC,YAAD;KAAY,MAAK;KAAK,IAAI;IAAc,CAAA,CAClC;;EACoC,CAAA;CAC1C,CAAA;AAEV"}

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalIcon.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import * as React from 'react';
 declare const StyledNavigationMenuVerticalIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.SVGProps<SVGSVGElement>, "size"> & {
-    size?: ("sm" | "md" | "lg" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg">>) | undefined;
+    size?: ("lg" | "md" | "sm" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm">>) | undefined;
 } & {
     as?: React.ElementType;
 }, "as" | "is"> & {

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalIcon.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationMenuVerticalIcon.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalIcon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { ~~Icon~~ } from '~~~/components/icon/Icon~~'\nimport { ~~styled~~ } from '~~~/styled~~'\n\nconst StyledNavigationMenuVerticalIcon = styled(Icon, {\n base: ['self-start']\n})\n\nexport const NavigationMenuVerticalIcon = (\n props: React.ComponentProps<typeof StyledNavigationMenuVerticalIcon>\n): ~~React.JSX.Element~~ => ~~(\n~~ <StyledNavigationMenuVerticalIcon size=\"md\" {...props} />\n~~)\n~~"],"mappings":";;;;;AAKA,IAAM,mCAAmC,OAAO,MAAM,EACpD,MAAM,CAAC,~~aAAa~~,EACrB,CAAC;~~AAEF~~,IAAa,8BACX,~~UAEA~~,oBAAC,kCAAD;CAAkC,MAAK;CAAK,GAAI;~~CAAS~~,CAAA"}
1	+ {"version":3,"file":"NavigationMenuVerticalIcon.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalIcon.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Icon } from '../icon/Icon'\n\nconst StyledNavigationMenuVerticalIcon = styled(Icon, {\n base: ['self-start']\n})\n\nexport const NavigationMenuVerticalIcon = (\n props: React.ComponentProps<typeof StyledNavigationMenuVerticalIcon>\n) => <StyledNavigationMenuVerticalIcon size=\"md\" {...props} />\n"],"mappings":";;;;;AAKA,IAAM,mCAAmC,OAAO,MAAM,EACpD,MAAM,CAAC,YAAY,EACrB,CAAC;AAED,IAAa,8BACX,UACG,oBAAC,kCAAD;CAAkC,MAAK;CAAK,GAAI;AAAQ,CAAA"}

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalItem.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import { Item } from '@radix-ui/react-navigation-menu';
-import React from 'react';
-type TNavigationMenuVerticalItemProps = Omit<React.ComponentProps<typeof Item>, 'value'>;
-export declare const NavigationMenuVerticalItem: (props: TNavigationMenuVerticalItemProps) => React.JSX.Element;
+import * as React from 'react';
+type NavigationMenuVerticalItemProps = Omit<React.ComponentProps<typeof Item>, 'value'>;
+export declare const NavigationMenuVerticalItem: (props: NavigationMenuVerticalItemProps) => React.JSX.Element;
 export {};

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationMenuVerticalItem.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalItem.tsx"],"sourcesContent":["import { Item } from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { cn } from '~/styled'\n\n/\n (!)\n * NavigationMenu vertical behaviour was buggy so had to build the\n * opening/closing nested Content(Accordion) based on `Collapsible` instead.\n * This means that the `value` prop does nothing, so removing it from typescript\n */\ntype ~~TNavigationMenuVerticalItemProps~~ = Omit<\n React.ComponentProps<typeof Item>,\n 'value'\n>\n\nexport const NavigationMenuVerticalItem = (\n props: ~~TNavigationMenuVerticalItemProps~~\n): ~~React.JSX.Element~~ => (\n <Item\n className={cn(\n '[ul_li_&]:[--navigation-menu-vertical-item-pl:--spacing(8)]',\n '[ul_li_&_&]:[--navigation-menu-vertical-item-pl:--spacing(12)]',\n '[ul_li_&_&_&]:[--navigation-menu-vertical-item-pl:--spacing(16)]'\n )}\n {...props}\n />\n)\n"],"mappings":";;;;;AAgBA,IAAa,8BACX,UAEA,oBAAC,MAAD;CACE,WAAW,GACT,+DACA,kEACA,~~mEACD~~;~~CACD~~,GAAI;~~CACJ~~,CAAA"}
1	+ {"version":3,"file":"NavigationMenuVerticalItem.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalItem.tsx"],"sourcesContent":["import { Item } from '@radix-ui/react-navigation-menu'\nimport * as React from 'react'\n\nimport { cn } from '../../styled'\n\n/\n (!)\n * NavigationMenu vertical behaviour was buggy so had to build the\n * opening/closing nested Content(Accordion) based on `Collapsible` instead.\n * This means that the `value` prop does nothing, so removing it from typescript\n */\ntype NavigationMenuVerticalItemProps = Omit<\n React.ComponentProps<typeof Item>,\n 'value'\n>\n\nexport const NavigationMenuVerticalItem = (\n props: NavigationMenuVerticalItemProps\n) => (\n <Item\n className={cn(\n '[ul_li_&]:[--navigation-menu-vertical-item-pl:--spacing(8)]',\n '[ul_li_&_&]:[--navigation-menu-vertical-item-pl:--spacing(12)]',\n '[ul_li_&_&_&]:[--navigation-menu-vertical-item-pl:--spacing(16)]'\n )}\n {...props}\n />\n)\n"],"mappings":";;;;;AAgBA,IAAa,8BACX,UAEA,oBAAC,MAAD;CACE,WAAW,GACT,+DACA,kEACA,kEACF;CACA,GAAI;AACL,CAAA"}

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalItemContent.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
 import * as React from 'react';
-type TNavigationMenuVerticalItemContentProps = React.ComponentProps<'div'>;
-export declare const NavigationMenuVerticalItemContent: ({ children, className, ...rest }: TNavigationMenuVerticalItemContentProps) => React.JSX.Element;
+type NavigationMenuVerticalItemContentProps = React.ComponentProps<'div'>;
+export declare const NavigationMenuVerticalItemContent: ({ children, className, ...rest }: NavigationMenuVerticalItemContentProps) => React.JSX.Element;
 export {};

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalItemContent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationMenuVerticalItemContent.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalItemContent.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { ~~Icon~~ } from '~~~/components/icon/Icon~~'\nimport { cn } from '~~~/styled~~'\n\nimport { NavigationMenuVerticalIcon } from './NavigationMenuVerticalIcon'\nimport { NavigationMenuVerticalText } from './NavigationMenuVerticalText'\n\ntype ~~TNavigationMenuVerticalItemContentProps~~ = React.ComponentProps<'div'>\n\nexport const NavigationMenuVerticalItemContent = ({\n children,\n className,\n ...rest\n}: ~~TNavigationMenuVerticalItemContentProps~~): ~~React.JSX.Element~~ => (\n <div className={cn('flex', 'gap-2', 'items-center', className)} {...rest}>\n {\n React.Children.map(children, (child) => {\n if (typeof child === 'string' \|\| typeof child === 'number') {\n return (\n <NavigationMenuVerticalText>{child}</NavigationMenuVerticalText>\n )\n }\n if (\n React.isValidElement<React.ComponentPropsWithoutRef<typeof Icon>>(\n child\n ) &&\n child.type === Icon\n ) {\n return <NavigationMenuVerticalIcon {...child.props} />\n }\n return child\n }) as React.ReactElement<unknown>[]\n }\n </div>\n)\n"],"mappings":";;;;;;;~~AAUA~~,IAAa,qCAAqC,EAChD,UACA,WACA,GAAG,WAEH,oBAAC,OAAD;CAAK,WAAW,GAAG,QAAQ,SAAS,gBAAgB,~~UAAU~~;~~CAAE~~,GAAI;WAEhE,QAAM,SAAS,IAAI,WAAW,UAAU;~~AACtC~~,~~MAAI~~,OAAO,UAAU,YAAY,OAAO,UAAU,~~SAChD~~,~~QACE~~,oBAAC,4BAAD,EAAA,UAA6B,~~OAAmC~~,CAAA;~~AAGpE~~,~~MACE~~,QAAM,eACJ,~~MACD~~,~~IACD~~,MAAM,SAAS,~~KAEf~~,~~QAAO~~,oBAAC,4BAAD,EAA4B,GAAI,MAAM,~~OAAS~~,CAAA;~~AAExD~~,~~SAAO~~;~~GACP~~;~~CAEA~~,CAAA"}
1	+ {"version":3,"file":"NavigationMenuVerticalItemContent.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalItemContent.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '../../styled'\nimport { Icon } from '../icon/Icon'\nimport { NavigationMenuVerticalIcon } from './NavigationMenuVerticalIcon'\nimport { NavigationMenuVerticalText } from './NavigationMenuVerticalText'\n\ntype NavigationMenuVerticalItemContentProps = React.ComponentProps<'div'>\n\nexport const NavigationMenuVerticalItemContent = ({\n children,\n className,\n ...rest\n}: NavigationMenuVerticalItemContentProps) => (\n <div className={cn('flex', 'gap-2', 'items-center', className)} {...rest}>\n {\n React.Children.map(children, (child) => {\n if (typeof child === 'string' \|\| typeof child === 'number') {\n return (\n <NavigationMenuVerticalText>{child}</NavigationMenuVerticalText>\n )\n }\n if (\n React.isValidElement<React.ComponentPropsWithoutRef<typeof Icon>>(\n child\n ) &&\n child.type === Icon\n ) {\n return <NavigationMenuVerticalIcon {...child.props} />\n }\n return child\n }) as React.ReactElement<unknown>[]\n }\n </div>\n)\n"],"mappings":";;;;;;;AASA,IAAa,qCAAqC,EAChD,UACA,WACA,GAAG,WAEH,oBAAC,OAAD;CAAK,WAAW,GAAG,QAAQ,SAAS,gBAAgB,SAAS;CAAG,GAAI;WAEhE,QAAM,SAAS,IAAI,WAAW,UAAU;EACtC,IAAI,OAAO,UAAU,YAAY,OAAO,UAAU,UAChD,OACE,oBAAC,4BAAD,EAAA,UAA6B,MAAkC,CAAA;EAGnE,IACE,QAAM,eACJ,KACF,KACA,MAAM,SAAS,MAEf,OAAO,oBAAC,4BAAD,EAA4B,GAAI,MAAM,MAAQ,CAAA;EAEvD,OAAO;CACT,CAAC;AAEA,CAAA"}

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
-import React from 'react';
+import * as React from 'react';
 declare const StyledNavigationMenuVerticalLink: React.ForwardRefExoticComponent<Omit<import("@radix-ui/react-navigation-menu").NavigationMenuLinkProps & React.RefAttributes<HTMLAnchorElement>, "size"> & {
-    size?: "md" | "lg" | undefined;
+    size?: "lg" | "md" | undefined;
 } & {
     as?: React.ElementType;
 }>;

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalLink.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationMenuVerticalLink.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalLink.tsx"],"sourcesContent":["import { Link } from '@radix-ui/react-navigation-menu'\nimport React from 'react'\n\nimport { styled } from '~/styled'\nimport { preventEvent } from '~/utilities/event/preventEvent'\nimport { getExternalAnchorProps } from '~/utilities/uri'\n\nimport { navigationMenuVerticalItemStyles } from './NavigationMenuVertical.styles'\nimport { NavigationMenuVerticalItem } from './NavigationMenuVerticalItem'\nimport { NavigationMenuVerticalItemContent } from './NavigationMenuVerticalItemContent'\n\nconst StyledNavigationMenuVerticalLink = styled(Link, {\n base: navigationMenuVerticalItemStyles,\n variants: {\n size: {\n md: ['min-h-10'],\n lg: ['min-h-12']\n }\n }\n})\n\ntype NavigationMenuVerticalItemProps = React.ComponentProps<\n typeof StyledNavigationMenuVerticalLink\n>\n\nexport const NavigationMenuVerticalLink = ({\n as,\n href,\n children,\n ...rest\n}: NavigationMenuVerticalItemProps) => {\n const Component = (as \|\| (href ? 'a' : 'button')) as React.ElementType\n const componentProps = as\n ? {}\n : href\n ? getExternalAnchorProps(href)\n : { type: 'button' }\n\n return (\n <NavigationMenuVerticalItem>\n <StyledNavigationMenuVerticalLink\n size=\"lg\"\n href={href}\n {...rest}\n {...componentProps}\n onSelect={preventEvent}\n asChild // ?: Can't use `as` for this as we lose `data-active` etc. attributes when we try to. Using `asChild` and `Component` as a workaround.\n >\n <Component>\n <NavigationMenuVerticalItemContent>\n {children}\n </NavigationMenuVerticalItemContent>\n </Component>\n </StyledNavigationMenuVerticalLink>\n </NavigationMenuVerticalItem>\n )\n}\n"],"mappings":";;;;;;;;;;~~AAWA~~,IAAM,mCAAmC,OAAO,MAAM;CACpD,MAAM;CACN,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,~~WAAW~~;~~EAChB~~,IAAI,CAAC,~~WAAW~~;~~EACjB~~,EACF;~~CACF~~,CAAC;~~AAMF~~,IAAa,8BAA8B,EACzC,IACA,MACA,UACA,GAAG,WACkC;CACrC,MAAM,YAAa,OAAO,OAAO,MAAM;CACvC,MAAM,iBAAiB,KACnB,~~EAAE~~,~~GACF~~,OACE,uBAAuB,~~KAAK~~,~~GAC5B~~,EAAE,MAAM,~~UAAU~~;~~AAExB~~,~~QACE~~,oBAAC,4BAAD,EAAA,UACE,oBAAC,kCAAD;EACE,MAAK;EACC;EACN,GAAI;EACJ,GAAI;EACJ,UAAU;EACV,SAAA;YAEA,oBAAC,WAAD,EAAA,UACE,oBAAC,mCAAD,EACG,~~UACiC~~,CAAA,EAC1B,CAAA;~~EACqB~~,CAAA,EACR,CAAA"}
1	+ {"version":3,"file":"NavigationMenuVerticalLink.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalLink.tsx"],"sourcesContent":["import { Link } from '@radix-ui/react-navigation-menu'\nimport * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { preventEvent } from '../../utilities/event/preventEvent'\nimport { getExternalAnchorProps } from '../../utilities/uri'\nimport { navigationMenuVerticalItemStyles } from './NavigationMenuVertical.styles'\nimport { NavigationMenuVerticalItem } from './NavigationMenuVerticalItem'\nimport { NavigationMenuVerticalItemContent } from './NavigationMenuVerticalItemContent'\n\nconst StyledNavigationMenuVerticalLink = styled(Link, {\n base: navigationMenuVerticalItemStyles,\n variants: {\n size: {\n md: ['min-h-10'],\n lg: ['min-h-12']\n }\n }\n})\n\ntype NavigationMenuVerticalItemProps = React.ComponentProps<\n typeof StyledNavigationMenuVerticalLink\n>\n\nexport const NavigationMenuVerticalLink = ({\n as,\n href,\n children,\n ...rest\n}: NavigationMenuVerticalItemProps) => {\n const Component = (as \|\| (href ? 'a' : 'button')) as React.ElementType\n const componentProps = as\n ? {}\n : href\n ? getExternalAnchorProps(href)\n : { type: 'button' }\n\n return (\n <NavigationMenuVerticalItem>\n <StyledNavigationMenuVerticalLink\n size=\"lg\"\n href={href}\n {...rest}\n {...componentProps}\n onSelect={preventEvent}\n asChild // ?: Can't use `as` for this as we lose `data-active` etc. attributes when we try to. Using `asChild` and `Component` as a workaround.\n >\n <Component>\n <NavigationMenuVerticalItemContent>\n {children}\n </NavigationMenuVerticalItemContent>\n </Component>\n </StyledNavigationMenuVerticalLink>\n </NavigationMenuVerticalItem>\n )\n}\n"],"mappings":";;;;;;;;;;AAUA,IAAM,mCAAmC,OAAO,MAAM;CACpD,MAAM;CACN,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,UAAU;EACf,IAAI,CAAC,UAAU;CACjB,EACF;AACF,CAAC;AAMD,IAAa,8BAA8B,EACzC,IACA,MACA,UACA,GAAG,WACkC;CACrC,MAAM,YAAa,OAAO,OAAO,MAAM;CACvC,MAAM,iBAAiB,KACnB,CAAC,IACD,OACE,uBAAuB,IAAI,IAC3B,EAAE,MAAM,SAAS;CAEvB,OACE,oBAAC,4BAAD,EAAA,UACE,oBAAC,kCAAD;EACE,MAAK;EACC;EACN,GAAI;EACJ,GAAI;EACJ,UAAU;EACV,SAAA;YAEA,oBAAC,WAAD,EAAA,UACE,oBAAC,mCAAD,EACG,SACgC,CAAA,EAC1B,CAAA;CACqB,CAAA,EACR,CAAA;AAEhC"}

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationMenuVerticalList.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalList.tsx"],"sourcesContent":["import { List } from '@radix-ui/react-navigation-menu'\n\nimport { styled } from '~/styled'\n\nconst StyledList = styled(List, {\n base: [\n '[--navigation-menu-vertical-item-pl:--spacing(4)]',\n '*:not-first:mt-0.5'\n ]\n})\n\nexport const NavigationMenuVerticalList = StyledList\n"],"mappings":";;AAWA,IAAa,6BAPM,OAAO,MAAM,EAC9B,MAAM,CACJ,qDACA,~~qBACD~~,EACF,~~CAAC~~"}
1	+ {"version":3,"file":"NavigationMenuVerticalList.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalList.tsx"],"sourcesContent":["import { List } from '@radix-ui/react-navigation-menu'\n\nimport { styled } from '../../styled'\n\nconst StyledList = styled(List, {\n base: [\n '[--navigation-menu-vertical-item-pl:--spacing(4)]',\n '*:not-first:mt-0.5'\n ]\n})\n\nexport const NavigationMenuVerticalList = StyledList\n"],"mappings":";;AAWA,IAAa,6BAPM,OAAO,MAAM,EAC9B,MAAM,CACJ,qDACA,oBACF,EACF,CAE0C"}

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalText.d.ts CHANGED Viewed

@@ -1,18 +1,18 @@
-import React from 'react';
-declare const StyledNavigationMenuVerticalText: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "size" | "noCapsize" | "weight" | "family"> & {
-    size?: ("sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs" | "xl" | "2xl" | "3xl" | "4xl">>) | undefined;
-    noCapsize?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
-    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "bold" | "normal">>) | undefined;
-    family?: ("display" | "body" | "mono" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "display" | "body" | "mono">>) | undefined;
+import * as React from 'react';
+declare const StyledNavigationMenuVerticalText: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, "family" | "noCapsize" | "size" | "weight"> & {
+    size?: ("2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "2xl" | "3xl" | "4xl" | "lg" | "md" | "sm" | "xl" | "xs">>) | undefined;
+    noCapsize?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
+    weight?: ("bold" | "normal" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "bold" | "normal">>) | undefined;
+    family?: ("body" | "display" | "mono" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "body" | "display" | "mono">>) | undefined;
 } & {
     as?: React.ElementType;
 }, "as"> & {
-    as?: "blockquote" | "caption" | "dd" | "dt" | "figcaption" | "li" | "p" | "span" | "legend" | React.ComponentType | React.ElementType;
+    as?: 'blockquote' | 'caption' | 'dd' | 'dt' | 'figcaption' | 'li' | 'p' | 'span' | 'legend' | React.ComponentType | React.ElementType;
 }, "ref"> & React.RefAttributes<HTMLParagraphElement>, "isExpanded"> & {
     isExpanded?: boolean | undefined;
 } & {
     as?: React.ElementType;
 }>;
-type TStyledNavigationMenuVerticalTextProps = React.ComponentProps<typeof StyledNavigationMenuVerticalText>;
-export declare const NavigationMenuVerticalText: (props: TStyledNavigationMenuVerticalTextProps) => React.JSX.Element;
+type StyledNavigationMenuVerticalTextProps = React.ComponentProps<typeof StyledNavigationMenuVerticalText>;
+export declare const NavigationMenuVerticalText: (props: StyledNavigationMenuVerticalTextProps) => React.JSX.Element;
 export {};

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalText.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { styled } from "../../styled.js";
 import { Text } from "../text/Text.js";
-import { useSidebarState } from "../side-bar/SideBarContext.js";
+import { useSidebarState } from "../side-bar/SideBar.context.js";
 import "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/navigation-menu-vertical/NavigationMenuVerticalText.tsx

package/dist/components/navigation-menu-vertical/NavigationMenuVerticalText.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NavigationMenuVerticalText.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalText.tsx"],"sourcesContent":["import React from 'react'\n\nimport { ~~Text~~ } from '~~~/components/text/Text~~'\nimport { ~~styled~~ } from '~~~/styled~~'\n\nimport { ~~useSidebarState~~ } from '../~~side-bar~~/~~SideBarContext~~'\n\nconst StyledNavigationMenuVerticalText = styled(Text, {\n base: [\n 'font-(--navigation-menu-vertical-item-font-weight)',\n 'w-max',\n 'max-w-40',\n 'text-left',\n 'motion-safe:duration-125',\n 'motion-safe:ease-out',\n 'motion-safe:transition-[opacity,translate]'\n ],\n variants: {\n isExpanded: {\n true: ['opacity-100', 'motion-safe:translate-0'],\n false: ['opacity-0', 'motion-safe:translate-x-2']\n }\n }\n})\n\ntype ~~TStyledNavigationMenuVerticalTextProps~~ = React.ComponentProps<\n typeof StyledNavigationMenuVerticalText\n>\n\nexport const NavigationMenuVerticalText = (\n props: ~~TStyledNavigationMenuVerticalTextProps~~\n): ~~React.JSX.Element~~ => {\n const { isExpanded } = useSidebarState()\n\n return (\n <StyledNavigationMenuVerticalText\n size=\"md\"\n as=\"span\"\n {...props}\n isExpanded={isExpanded}\n />\n )\n}\n"],"mappings":";;;;;;~~AAOA~~,IAAM,mCAAmC,OAAO,MAAM;CACpD,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;~~EACD~~;~~CACD~~,UAAU,EACR,YAAY;EACV,MAAM,CAAC,eAAe,~~0BAA0B~~;~~EAChD~~,OAAO,CAAC,aAAa,~~4BAA4B~~;~~EAClD~~,EACF;~~CACF~~,CAAC;~~AAMF~~,IAAa,8BACX,~~UACsB~~;~~CACtB~~,MAAM,EAAE,eAAe,~~iBAAiB~~;~~AAExC~~,~~QACE~~,oBAAC,kCAAD;EACE,MAAK;EACL,IAAG;EACH,GAAI;EACQ;~~EACZ~~,CAAA"}
1	+ {"version":3,"file":"NavigationMenuVerticalText.js","names":[],"sources":["../../../src/components/navigation-menu-vertical/NavigationMenuVerticalText.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { useSidebarState } from '../side-bar/SideBar.context'\nimport { Text } from '../text/Text'\n\nconst StyledNavigationMenuVerticalText = styled(Text, {\n base: [\n 'font-(--navigation-menu-vertical-item-font-weight)',\n 'w-max',\n 'max-w-40',\n 'text-left',\n 'motion-safe:duration-125',\n 'motion-safe:ease-out',\n 'motion-safe:transition-[opacity,translate]'\n ],\n variants: {\n isExpanded: {\n true: ['opacity-100', 'motion-safe:translate-0'],\n false: ['opacity-0', 'motion-safe:translate-x-2']\n }\n }\n})\n\ntype StyledNavigationMenuVerticalTextProps = React.ComponentProps<\n typeof StyledNavigationMenuVerticalText\n>\n\nexport const NavigationMenuVerticalText = (\n props: StyledNavigationMenuVerticalTextProps\n) => {\n const { isExpanded } = useSidebarState()\n\n return (\n <StyledNavigationMenuVerticalText\n size=\"md\"\n as=\"span\"\n {...props}\n isExpanded={isExpanded}\n />\n )\n}\n"],"mappings":";;;;;;AAMA,IAAM,mCAAmC,OAAO,MAAM;CACpD,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,UAAU,EACR,YAAY;EACV,MAAM,CAAC,eAAe,yBAAyB;EAC/C,OAAO,CAAC,aAAa,2BAA2B;CAClD,EACF;AACF,CAAC;AAMD,IAAa,8BACX,UACG;CACH,MAAM,EAAE,eAAe,gBAAgB;CAEvC,OACE,oBAAC,kCAAD;EACE,MAAK;EACL,IAAG;EACH,GAAI;EACQ;CACb,CAAA;AAEL"}

package/dist/components/notification-badge/NotificationBadge.d.ts CHANGED Viewed

@@ -1,4 +1,4 @@
-import React from 'react';
+import * as React from 'react';
 import { Badge } from '../badge/Badge';
 type BadgeProps = React.ComponentProps<typeof Badge>;
 type NotificationBadgeProps = {

package/dist/components/notification-badge/NotificationBadge.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NotificationBadge.js","names":[],"sources":["../../../src/components/notification-badge/NotificationBadge.tsx"],"sourcesContent":["import React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { Badge } from '../badge/Badge'\nimport { Icon } from '../icon/Icon'\n\nconst StyledBadge = styled(Badge, {\n base: [\n 'font-body',\n 'text-sm',\n 'flex-row',\n 'justify-center',\n 'absolute',\n 'top-0',\n 'right-0',\n 'translate-x-3',\n '-translate-y-1/2',\n 'rounded-full',\n 'h-6',\n 'min-w-6',\n 'text-center'\n ]\n})\n\ntype BadgeProps = React.ComponentProps<typeof Badge>\n\ntype NotificationBadgeProps = {\n value: number \| string\n emphasis?: BadgeProps['emphasis']\n theme?: BadgeProps['theme']\n icon?: React.FC<React.SVGProps<SVGSVGElement>>\n}\n\nexport const NotificationBadge = ({\n value,\n emphasis = 'bold',\n theme = 'primary',\n icon,\n children\n}: React.PropsWithChildren<NotificationBadgeProps>) => (\n <div className=\"relative\">\n {!!value && (\n <StyledBadge role=\"status\" emphasis={emphasis} theme={theme}>\n {icon && <Icon is={icon} role=\"img\" aria-hidden=\"false\" />}\n {value}\n </StyledBadge>\n )}\n {children}\n </div>\n)\n"],"mappings":";;;;;;~~AAOA~~,IAAM,cAAc,OAAO,OAAO,EAChC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;~~CACD~~,EACF,CAAC;~~AAWF~~,IAAa,qBAAqB,EAChC,OACA,WAAW,QACX,QAAQ,WACR,MACA,eAEA,qBAAC,OAAD;CAAK,WAAU;WAAf,CACG,CAAC,CAAC,SACD,qBAAC,aAAD;EAAa,MAAK;EAAmB;EAAiB;YAAtD,CACG,QAAQ,oBAAC,MAAD;GAAM,IAAI;GAAM,MAAK;GAAM,eAAY;~~GAAU~~,CAAA,~~EACzD~~,~~MACW~~;~~KAEf~~,~~SACG~~"}
1	+ {"version":3,"file":"NotificationBadge.js","names":[],"sources":["../../../src/components/notification-badge/NotificationBadge.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { Badge } from '../badge/Badge'\nimport { Icon } from '../icon/Icon'\n\nconst StyledBadge = styled(Badge, {\n base: [\n 'font-body',\n 'text-sm',\n 'flex-row',\n 'justify-center',\n 'absolute',\n 'top-0',\n 'right-0',\n 'translate-x-3',\n '-translate-y-1/2',\n 'rounded-full',\n 'h-6',\n 'min-w-6',\n 'text-center'\n ]\n})\n\ntype BadgeProps = React.ComponentProps<typeof Badge>\n\ntype NotificationBadgeProps = {\n value: number \| string\n emphasis?: BadgeProps['emphasis']\n theme?: BadgeProps['theme']\n icon?: React.FC<React.SVGProps<SVGSVGElement>>\n}\n\nexport const NotificationBadge = ({\n value,\n emphasis = 'bold',\n theme = 'primary',\n icon,\n children\n}: React.PropsWithChildren<NotificationBadgeProps>) => (\n <div className=\"relative\">\n {!!value && (\n <StyledBadge role=\"status\" emphasis={emphasis} theme={theme}>\n {icon && <Icon is={icon} role=\"img\" aria-hidden=\"false\" />}\n {value}\n </StyledBadge>\n )}\n {children}\n </div>\n)\n"],"mappings":";;;;;;AAMA,IAAM,cAAc,OAAO,OAAO,EAChC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;AACF,EACF,CAAC;AAWD,IAAa,qBAAqB,EAChC,OACA,WAAW,QACX,QAAQ,WACR,MACA,eAEA,qBAAC,OAAD;CAAK,WAAU;WAAf,CACG,CAAC,CAAC,SACD,qBAAC,aAAD;EAAa,MAAK;EAAmB;EAAiB;YAAtD,CACG,QAAQ,oBAAC,MAAD;GAAM,IAAI;GAAM,MAAK;GAAM,eAAY;EAAS,CAAA,GACxD,KACU;KAEd,QACE"}

package/dist/components/number-input/NumberInput.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { cn, styled } from "../../styled.js";
-import { Input } from "../input/Input.js";
 import { getFieldIconSize } from "../../utilities/style/get-icon-size.js";
+import { Input } from "../input/Input.js";
 import { NumberInputStepper } from "./NumberInputStepper.js";
 import * as React$1 from "react";
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/components/number-input/NumberInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NumberInput.js","names":[],"sources":["../../../src/components/number-input/NumberInput.tsx"],"sourcesContent":["import { Minus, Plus } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\nimport { cn } from '~/styled'\nimport { getFieldIconSize } from '~/utilities/style/get-icon-size'\n\nimport { Input } from '../input/Input'\nimport { NumberInputStepper } from './NumberInputStepper'\n\nexport interface NumberInputProps {\n name: string\n min?: number\n max?: number\n step?: number\n value?: number\n defaultValue?: number\n disabled?: boolean\n readonly?: boolean\n size?: 'sm' \| 'md' \| 'lg'\n appearance?: 'standard' \| 'modern'\n theme?: 'white' \| 'grey'\n emphasis?: 'bold'\n onValueChange?: (value: number) => void\n stepperButtonLabels?: { increment?: string; decrement?: string }\n disabledTooltipContent?: { increment?: string; decrement?: string }\n className?: string\n}\n\nconst NumberInputContainer = styled('div', {\n base: ['flex'],\n variants: {\n appearance: {\n standard: [],\n modern: ['gap-px']\n },\n emphasis: {\n bold: ['gap-0']\n }\n }\n})\n\nexport const NumberInput = React.forwardRef<HTMLInputElement, NumberInputProps>(\n (\n {\n value,\n defaultValue = 0,\n onValueChange,\n min = 0,\n max = Number.MAX_SAFE_INTEGER,\n step = 1,\n disabled: isDisabled = false,\n readonly: isReadOnly = false,\n size = 'md',\n stepperButtonLabels: stepperButtonLabelsProp,\n disabledTooltipContent: disabledTooltipContentProp,\n className,\n appearance = 'standard',\n theme,\n emphasis,\n ...rest\n },\n ref\n ): React.JSX.Element => {\n const [internalValue, setInternalValue] = React.useState<number>(\n value \|\| defaultValue\n )\n React.useEffect(() => {\n // Update the internal value to match what is passed in.\n if (typeof value !== 'undefined') setInternalValue(value)\n }, [value])\n\n const inputRef = React.useRef<HTMLInputElement \| null>(null)\n\n React.useImperativeHandle(ref, () => inputRef.current as HTMLInputElement)\n\n const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n const stepperButtonLabels = {\n increment: 'increment',\n decrement: 'decrement',\n ...stepperButtonLabelsProp\n }\n\n const disabledTooltipContent = {\n decrement: `Cannot enter values below ${min}`,\n increment: `Cannot enter values above ${max}`,\n ...disabledTooltipContentProp\n }\n\n const isAtMax = internalValue >= max\n const isAtMin = internalValue <= min\n\n const clamp = React.useCallback(\n (internalValue: number) => Math.min(Math.max(internalValue, min), max),\n [max, min]\n )\n\n const updateValue = React.useCallback(\n (newValue: number) => {\n onValueChange?.(newValue)\n setInternalValue(newValue)\n },\n [onValueChange]\n )\n\n const onInputChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const parsedValue = Number(event.target.value.replace(/\\D/g, ''))\n updateValue(parsedValue)\n },\n [updateValue]\n )\n\n const increment = React.useCallback(() => {\n if (isAtMax \|\| isReadOnly) return\n inputRef?.current?.focus()\n const newValue = Number(internalValue) + step\n updateValue(clamp(newValue))\n }, [clamp, isAtMax, isReadOnly, step, updateValue, internalValue])\n\n const decrement = React.useCallback(() => {\n if (isAtMin \|\| isReadOnly) return\n inputRef?.current?.focus()\n const newValue = Number(internalValue) - step\n updateValue(clamp(newValue))\n }, [clamp, isAtMin, isReadOnly, min, step, updateValue, internalValue])\n\n const onKeyDown = React.useCallback(\n (event: React.KeyboardEvent) => {\n if (event.nativeEvent.isComposing) return\n\n /*\n Keyboard Accessibility\n \n We want to increase or decrease the input's value\n * based on if the user the arrow keys.\n \n @see https://www.w3.org/TR/wai-aria-practices-1.1/#keyboard-interaction-17\n */\n const eventKey = event.key\n\n const keyMap: Record<string, React.KeyboardEventHandler> = {\n ArrowUp: increment,\n ArrowRight: increment,\n ArrowDown: decrement,\n ArrowLeft: decrement,\n Home: () => updateValue(min),\n End: () => updateValue(max)\n }\n\n const action = keyMap[eventKey]\n\n if (action) {\n event.preventDefault()\n action(event)\n }\n },\n [increment, decrement, updateValue, min, max]\n )\n\n const hasError = internalValue < min \|\| internalValue > max\n const {\n state: externalState,\n 'aria-invalid': externalAriaInvalid,\n ...restProps\n } = rest as { state?: 'error'; 'aria-invalid'?: boolean } & typeof rest\n\n const inputProps: React.ComponentProps<typeof Input> = {\n type: 'number',\n value: internalValue,\n ...restProps,\n onChange: onInputChange,\n onKeyDown,\n size,\n appearance,\n theme,\n state: externalState \|\| (hasError ? 'error' : undefined),\n 'aria-invalid': externalAriaInvalid \|\| hasError \|\| undefined,\n className: cn(\n 'rounded-none',\n 'w-16',\n '[&_>_input]:text-center',\n 'disabled:opacity-30',\n 'disabled:pointer-events-none',\n emphasis === 'bold' && [\n 'rounded-1',\n '[&_>_input[aria-invalid=true]]:text-danger',\n 'focus-within:[&_>_input]:text-grey-1000'\n ],\n emphasis === 'bold' &&\n appearance === 'standard' && [\n 'border-none',\n '[&:has([aria-invalid=true])]:border-2',\n '[&:has([aria-invalid=true])]:border-danger',\n 'focus-within:border-2',\n 'focus-within:border-blue-800'\n ]\n ),\n ref: inputRef,\n readOnly: isReadOnly,\n disabled: isDisabled,\n 'aria-valuemin': min,\n 'aria-valuemax': max,\n 'aria-valuenow': internalValue,\n role: 'spinbutton'\n }\n\n return (\n <NumberInputContainer\n appearance={appearance}\n emphasis={emphasis}\n className={className}\n >\n <NumberInputStepper\n onClick={decrement}\n icon={Minus}\n className={cn(\n emphasis !== 'bold' && ['border-r-none', 'rounded-r-none']\n )}\n size={iconSize}\n fieldAppearance={appearance}\n fieldTheme={theme}\n emphasis={emphasis}\n disabled={isAtMin \|\| isDisabled}\n showTooltip={isAtMin && !isDisabled}\n disabledTooltipContent={disabledTooltipContent.decrement}\n label={stepperButtonLabels.decrement}\n />\n <Input {...inputProps} />\n <NumberInputStepper\n onClick={increment}\n icon={Plus}\n className={cn(\n emphasis !== 'bold' && ['border-l-none', 'rounded-l-none']\n )}\n size={iconSize}\n fieldAppearance={appearance}\n fieldTheme={theme}\n emphasis={emphasis}\n disabled={isAtMax \|\| isDisabled}\n showTooltip={isAtMax && !isDisabled}\n disabledTooltipContent={disabledTooltipContent.increment}\n label={stepperButtonLabels.increment}\n />\n </NumberInputContainer>\n )\n }\n)\n\nNumberInput.displayName = 'NumberInput'\n"],"mappings":"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"}
1	+ {"version":3,"file":"NumberInput.js","names":[],"sources":["../../../src/components/number-input/NumberInput.tsx"],"sourcesContent":["import { Minus, Plus } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled, cn } from '../../styled'\nimport { getFieldIconSize } from '../../utilities/style/get-icon-size'\nimport { Input } from '../input/Input'\nimport { NumberInputStepper } from './NumberInputStepper'\n\nexport interface NumberInputProps {\n name: string\n min?: number\n max?: number\n step?: number\n value?: number\n defaultValue?: number\n disabled?: boolean\n readonly?: boolean\n size?: 'sm' \| 'md' \| 'lg'\n appearance?: 'standard' \| 'modern'\n theme?: 'white' \| 'grey'\n emphasis?: 'bold'\n onValueChange?: (value: number) => void\n stepperButtonLabels?: { increment?: string; decrement?: string }\n disabledTooltipContent?: { increment?: string; decrement?: string }\n className?: string\n}\n\nconst NumberInputContainer = styled('div', {\n base: ['flex'],\n variants: {\n appearance: {\n standard: [],\n modern: ['gap-px']\n },\n emphasis: {\n bold: ['gap-0']\n }\n }\n})\n\nexport const NumberInput = React.forwardRef<HTMLInputElement, NumberInputProps>(\n (\n {\n value,\n defaultValue = 0,\n onValueChange,\n min = 0,\n max = Number.MAX_SAFE_INTEGER,\n step = 1,\n disabled: isDisabled = false,\n readonly: isReadOnly = false,\n size = 'md',\n stepperButtonLabels: stepperButtonLabelsProp,\n disabledTooltipContent: disabledTooltipContentProp,\n className,\n appearance = 'standard',\n theme,\n emphasis,\n ...rest\n },\n ref\n ) => {\n const [internalValue, setInternalValue] = React.useState<number>(\n value \|\| defaultValue\n )\n React.useEffect(() => {\n // Update the internal value to match what is passed in.\n if (typeof value !== 'undefined') setInternalValue(value)\n }, [value])\n\n const inputRef = React.useRef<HTMLInputElement \| null>(null)\n\n React.useImperativeHandle(ref, () => inputRef.current as HTMLInputElement)\n\n const iconSize = React.useMemo(() => getFieldIconSize(size), [size])\n\n const stepperButtonLabels = {\n increment: 'increment',\n decrement: 'decrement',\n ...stepperButtonLabelsProp\n }\n\n const disabledTooltipContent = {\n decrement: `Cannot enter values below ${min}`,\n increment: `Cannot enter values above ${max}`,\n ...disabledTooltipContentProp\n }\n\n const isAtMax = internalValue >= max\n const isAtMin = internalValue <= min\n\n const clamp = React.useCallback(\n (internalValue: number) => Math.min(Math.max(internalValue, min), max),\n [max, min]\n )\n\n const updateValue = React.useCallback(\n (newValue: number) => {\n onValueChange?.(newValue)\n setInternalValue(newValue)\n },\n [onValueChange]\n )\n\n const onInputChange = React.useCallback(\n (event: React.ChangeEvent<HTMLInputElement>) => {\n const parsedValue = Number(event.target.value.replace(/\\D/g, ''))\n updateValue(parsedValue)\n },\n [updateValue]\n )\n\n const increment = React.useCallback(() => {\n if (isAtMax \|\| isReadOnly) return\n inputRef?.current?.focus()\n const newValue = Number(internalValue) + step\n updateValue(clamp(newValue))\n }, [clamp, isAtMax, isReadOnly, step, updateValue, internalValue])\n\n const decrement = React.useCallback(() => {\n if (isAtMin \|\| isReadOnly) return\n inputRef?.current?.focus()\n const newValue = Number(internalValue) - step\n updateValue(clamp(newValue))\n }, [clamp, isAtMin, isReadOnly, min, step, updateValue, internalValue])\n\n const onKeyDown = React.useCallback(\n (event: React.KeyboardEvent) => {\n if (event.nativeEvent.isComposing) return\n\n /*\n Keyboard Accessibility\n \n We want to increase or decrease the input's value\n * based on if the user the arrow keys.\n \n @see https://www.w3.org/TR/wai-aria-practices-1.1/#keyboard-interaction-17\n */\n const eventKey = event.key\n\n const keyMap: Record<string, React.KeyboardEventHandler> = {\n ArrowUp: increment,\n ArrowRight: increment,\n ArrowDown: decrement,\n ArrowLeft: decrement,\n Home: () => updateValue(min),\n End: () => updateValue(max)\n }\n\n const action = keyMap[eventKey]\n\n if (action) {\n event.preventDefault()\n action(event)\n }\n },\n [increment, decrement, updateValue, min, max]\n )\n\n const hasError = internalValue < min \|\| internalValue > max\n const {\n state: externalState,\n 'aria-invalid': externalAriaInvalid,\n ...restProps\n } = rest as { state?: 'error'; 'aria-invalid'?: boolean } & typeof rest\n\n const inputProps: React.ComponentProps<typeof Input> = {\n type: 'number',\n value: internalValue,\n ...restProps,\n onChange: onInputChange,\n onKeyDown,\n size,\n appearance,\n theme,\n state: externalState \|\| (hasError ? 'error' : undefined),\n 'aria-invalid': externalAriaInvalid \|\| hasError \|\| undefined,\n className: cn(\n 'rounded-none',\n 'w-16',\n '[&_>_input]:text-center',\n 'disabled:opacity-30',\n 'disabled:pointer-events-none',\n emphasis === 'bold' && [\n 'rounded-1',\n '[&_>_input[aria-invalid=true]]:text-danger',\n 'focus-within:[&_>_input]:text-grey-1000'\n ],\n emphasis === 'bold' &&\n appearance === 'standard' && [\n 'border-none',\n '[&:has([aria-invalid=true])]:border-2',\n '[&:has([aria-invalid=true])]:border-danger',\n 'focus-within:border-2',\n 'focus-within:border-blue-800'\n ]\n ),\n ref: inputRef,\n readOnly: isReadOnly,\n disabled: isDisabled,\n 'aria-valuemin': min,\n 'aria-valuemax': max,\n 'aria-valuenow': internalValue,\n role: 'spinbutton'\n }\n\n return (\n <NumberInputContainer\n appearance={appearance}\n emphasis={emphasis}\n className={className}\n >\n <NumberInputStepper\n onClick={decrement}\n icon={Minus}\n className={cn(\n emphasis !== 'bold' && ['border-r-none', 'rounded-r-none']\n )}\n size={iconSize}\n fieldAppearance={appearance}\n fieldTheme={theme}\n emphasis={emphasis}\n disabled={isAtMin \|\| isDisabled}\n showTooltip={isAtMin && !isDisabled}\n disabledTooltipContent={disabledTooltipContent.decrement}\n label={stepperButtonLabels.decrement}\n />\n <Input {...inputProps} />\n <NumberInputStepper\n onClick={increment}\n icon={Plus}\n className={cn(\n emphasis !== 'bold' && ['border-l-none', 'rounded-l-none']\n )}\n size={iconSize}\n fieldAppearance={appearance}\n fieldTheme={theme}\n emphasis={emphasis}\n disabled={isAtMax \|\| isDisabled}\n showTooltip={isAtMax && !isDisabled}\n disabledTooltipContent={disabledTooltipContent.increment}\n label={stepperButtonLabels.increment}\n />\n </NumberInputContainer>\n )\n }\n)\n\nNumberInput.displayName = 'NumberInput'\n"],"mappings":"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"}

package/dist/components/number-input/NumberInputStepper.d.ts CHANGED Viewed

@@ -1,17 +1,17 @@
 import * as React from 'react';
 import { ActionIcon } from '../action-icon/ActionIcon';
-declare const StyledStepperButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "appearance" | "size" | "theme" | "isRounded"> & {
-    theme?: ("primary" | "white" | "neutral" | "primaryDark" | "success" | "warning" | "danger" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "primary" | "white" | "neutral" | "primaryDark" | "success" | "warning" | "danger">>) | undefined;
-    appearance?: ("simple" | "outline" | "solid" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "simple" | "outline" | "solid">>) | undefined;
-    size?: ("sm" | "md" | "lg" | "xs" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs">>) | undefined;
-    isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+declare const StyledStepperButton: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "appearance" | "isRounded" | "size" | "theme"> & {
+    theme?: ("danger" | "neutral" | "primary" | "primaryDark" | "success" | "warning" | "white" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "danger" | "neutral" | "primary" | "primaryDark" | "success" | "warning" | "white">>) | undefined;
+    appearance?: ("outline" | "simple" | "solid" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "outline" | "simple" | "solid">>) | undefined;
+    size?: ("lg" | "md" | "sm" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm" | "xs">>) | undefined;
+    isRounded?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
+}, "children" | "hasTooltip" | "label" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
     children: React.ReactNode;
     label: string;
-} & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "emphasis" | "fieldAppearance" | "fieldTheme"> & {
-    fieldAppearance?: "standard" | "modern" | undefined;
+} & Omit<import("../..").OptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, "emphasis" | "fieldAppearance" | "fieldTheme"> & {
+    fieldAppearance?: "modern" | "standard" | undefined;
     fieldTheme?: "grey" | "white" | undefined;
     emphasis?: "bold" | undefined;
 } & {

package/dist/components/number-input/NumberInputStepper.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NumberInputStepper.js","names":[],"sources":["../../../src/components/number-input/NumberInputStepper.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\nimport { Tooltip } from '../tooltip/Tooltip'\n\nconst StyledStepperButton = styled(ActionIcon, {\n base: [\n 'rounded-md',\n 'z-1',\n 'h-full!',\n 'hover:[&_svg]:text-grey-800',\n 'hover:bg-grey-100',\n '[&_svg]:text-grey-700',\n 'active:[&_svg]:text-grey-900',\n 'active:bg-grey-200',\n 'disabled:opacity-30',\n 'disabled:pointer-events-none'\n ],\n variants: {\n fieldAppearance: {\n standard: ['bg-white', 'border-grey-800!'],\n modern: ['bg-grey-100', 'border-grey-100!', 'hover:bg-grey-200!']\n },\n fieldTheme: {\n white: [],\n grey: []\n },\n emphasis: {\n bold: [\n '[&_svg]:text-primary-700',\n 'hover:bg-primary-100!',\n 'hover:[&_svg]:text-primary-800!',\n 'active:bg-primary-200!',\n 'active:[&_svg]:text-primary-900!'\n ]\n }\n },\n compoundVariants: [\n {\n fieldAppearance: 'modern',\n fieldTheme: 'white',\n class: ['bg-white']\n },\n {\n fieldAppearance: 'standard',\n emphasis: 'bold',\n class: ['bg-white', 'border-primary-800!']\n },\n {\n fieldAppearance: 'modern',\n emphasis: 'bold',\n class: ['bg-white!', 'hover:bg-primary-100!']\n }\n ]\n})\n\ntype NumberInputStepperProps = Omit<\n React.ComponentProps<typeof ActionIcon>,\n 'children'\n> &\n Omit<React.ComponentProps<typeof StyledStepperButton>, 'children'> & {\n icon: React.FC<React.SVGProps<SVGSVGElement>>\n showTooltip?: boolean\n disabledTooltipContent?: string\n }\n\nexport const NumberInputStepper = React.forwardRef<\n HTMLButtonElement,\n NumberInputStepperProps\n>((props, forwardedRef) => {\n const {\n icon,\n disabledTooltipContent,\n showTooltip,\n fieldAppearance = 'standard',\n fieldTheme,\n ...rest\n } = props\n\n /*\n Focus has been removed from the button\n * as the increment and decrement buttons should be keyboard accessible via arrow keys.\n * see MDN docs https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role\n */\n return (\n <Tooltip>\n <Tooltip.Trigger asChild>\n <span className=\"z-1\" tabIndex={-1}>\n <StyledStepperButton\n hasTooltip={false}\n tabIndex={-1}\n appearance=\"outline\"\n fieldAppearance={fieldAppearance}\n fieldTheme={fieldTheme}\n ref={forwardedRef}\n {...rest}\n >\n <Icon is={icon} />\n </StyledStepperButton>\n </span>\n </Tooltip.Trigger>\n {showTooltip && (\n <Tooltip.Content>{disabledTooltipContent}</Tooltip.Content>\n )}\n </Tooltip>\n )\n})\n"],"mappings":";;;;;;;~~AAQA~~,IAAM,sBAAsB,OAAO,YAAY;CAC7C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;~~EACD~~;~~CACD~~,UAAU;EACR,iBAAiB;GACf,UAAU,CAAC,YAAY,~~mBAAmB~~;~~GAC1C~~,QAAQ;IAAC;IAAe;IAAoB;~~IAAqB~~;~~GAClE~~;~~EACD~~,YAAY;GACV,OAAO,~~EAAE~~;~~GACT~~,MAAM,~~EAAE~~;~~GACT~~;~~EACD~~,UAAU,EACR,MAAM;GACJ;GACA;GACA;GACA;GACA;~~GACD~~,EACF;~~EACF~~;~~CACD~~,kBAAkB;EAChB;GACE,iBAAiB;GACjB,YAAY;GACZ,OAAO,CAAC,~~WAAW~~;~~GACpB~~;~~EACD~~;GACE,iBAAiB;GACjB,UAAU;GACV,OAAO,CAAC,YAAY,~~sBAAsB~~;~~GAC3C~~;~~EACD~~;GACE,iBAAiB;GACjB,UAAU;GACV,OAAO,CAAC,aAAa,~~wBAAwB~~;~~GAC9C~~;~~EACF~~;~~CACF~~,CAAC;~~AAYF~~,IAAa,qBAAqB,QAAM,YAGrC,OAAO,iBAAiB;CACzB,MAAM,EACJ,MACA,wBACA,aACA,kBAAkB,YAClB,YACA,GAAG,SACD;;;;;;~~AAOJ~~,~~QACE~~,qBAAC,SAAD,EAAA,UAAA,CACE,oBAAC,QAAQ,SAAT;EAAiB,SAAA;YACf,oBAAC,QAAD;GAAM,WAAU;GAAM,UAAU;aAC9B,oBAAC,qBAAD;IACE,YAAY;IACZ,UAAU;IACV,YAAW;IACM;IACL;IACZ,KAAK;IACL,GAAI;cAEJ,oBAAC,MAAD,EAAM,IAAI,~~MAAQ~~,CAAA;~~IACE~~,CAAA;~~GACjB~~,CAAA;~~EACS~~,CAAA,~~EACjB~~,eACC,oBAAC,QAAQ,SAAT,EAAA,UAAkB,~~wBAAyC~~,CAAA,CAErD,EAAA,CAAA;~~EAEZ~~"}
1	+ {"version":3,"file":"NumberInputStepper.js","names":[],"sources":["../../../src/components/number-input/NumberInputStepper.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\nimport { Tooltip } from '../tooltip/Tooltip'\n\nconst StyledStepperButton = styled(ActionIcon, {\n base: [\n 'rounded-md',\n 'z-1',\n 'h-full!',\n 'hover:[&_svg]:text-grey-800',\n 'hover:bg-grey-100',\n '[&_svg]:text-grey-700',\n 'active:[&_svg]:text-grey-900',\n 'active:bg-grey-200',\n 'disabled:opacity-30',\n 'disabled:pointer-events-none'\n ],\n variants: {\n fieldAppearance: {\n standard: ['bg-white', 'border-grey-800!'],\n modern: ['bg-grey-100', 'border-grey-100!', 'hover:bg-grey-200!']\n },\n fieldTheme: {\n white: [],\n grey: []\n },\n emphasis: {\n bold: [\n '[&_svg]:text-primary-700',\n 'hover:bg-primary-100!',\n 'hover:[&_svg]:text-primary-800!',\n 'active:bg-primary-200!',\n 'active:[&_svg]:text-primary-900!'\n ]\n }\n },\n compoundVariants: [\n {\n fieldAppearance: 'modern',\n fieldTheme: 'white',\n class: ['bg-white']\n },\n {\n fieldAppearance: 'standard',\n emphasis: 'bold',\n class: ['bg-white', 'border-primary-800!']\n },\n {\n fieldAppearance: 'modern',\n emphasis: 'bold',\n class: ['bg-white!', 'hover:bg-primary-100!']\n }\n ]\n})\n\ntype NumberInputStepperProps = Omit<\n React.ComponentProps<typeof ActionIcon>,\n 'children'\n> &\n Omit<React.ComponentProps<typeof StyledStepperButton>, 'children'> & {\n icon: React.FC<React.SVGProps<SVGSVGElement>>\n showTooltip?: boolean\n disabledTooltipContent?: string\n }\n\nexport const NumberInputStepper = React.forwardRef<\n HTMLButtonElement,\n NumberInputStepperProps\n>((props, forwardedRef) => {\n const {\n icon,\n disabledTooltipContent,\n showTooltip,\n fieldAppearance = 'standard',\n fieldTheme,\n ...rest\n } = props\n\n /*\n Focus has been removed from the button\n * as the increment and decrement buttons should be keyboard accessible via arrow keys.\n * see MDN docs https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/spinbutton_role\n */\n return (\n <Tooltip>\n <Tooltip.Trigger asChild>\n <span className=\"z-1\" tabIndex={-1}>\n <StyledStepperButton\n hasTooltip={false}\n tabIndex={-1}\n appearance=\"outline\"\n fieldAppearance={fieldAppearance}\n fieldTheme={fieldTheme}\n ref={forwardedRef}\n {...rest}\n >\n <Icon is={icon} />\n </StyledStepperButton>\n </span>\n </Tooltip.Trigger>\n {showTooltip && (\n <Tooltip.Content>{disabledTooltipContent}</Tooltip.Content>\n )}\n </Tooltip>\n )\n})\n"],"mappings":";;;;;;;AAOA,IAAM,sBAAsB,OAAO,YAAY;CAC7C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,UAAU;EACR,iBAAiB;GACf,UAAU,CAAC,YAAY,kBAAkB;GACzC,QAAQ;IAAC;IAAe;IAAoB;GAAoB;EAClE;EACA,YAAY;GACV,OAAO,CAAC;GACR,MAAM,CAAC;EACT;EACA,UAAU,EACR,MAAM;GACJ;GACA;GACA;GACA;GACA;EACF,EACF;CACF;CACA,kBAAkB;EAChB;GACE,iBAAiB;GACjB,YAAY;GACZ,OAAO,CAAC,UAAU;EACpB;EACA;GACE,iBAAiB;GACjB,UAAU;GACV,OAAO,CAAC,YAAY,qBAAqB;EAC3C;EACA;GACE,iBAAiB;GACjB,UAAU;GACV,OAAO,CAAC,aAAa,uBAAuB;EAC9C;CACF;AACF,CAAC;AAYD,IAAa,qBAAqB,QAAM,YAGrC,OAAO,iBAAiB;CACzB,MAAM,EACJ,MACA,wBACA,aACA,kBAAkB,YAClB,YACA,GAAG,SACD;;;;;;CAOJ,OACE,qBAAC,SAAD,EAAA,UAAA,CACE,oBAAC,QAAQ,SAAT;EAAiB,SAAA;YACf,oBAAC,QAAD;GAAM,WAAU;GAAM,UAAU;aAC9B,oBAAC,qBAAD;IACE,YAAY;IACZ,UAAU;IACV,YAAW;IACM;IACL;IACZ,KAAK;IACL,GAAI;cAEJ,oBAAC,MAAD,EAAM,IAAI,KAAO,CAAA;GACE,CAAA;EACjB,CAAA;CACS,CAAA,GAChB,eACC,oBAAC,QAAQ,SAAT,EAAA,UAAkB,uBAAwC,CAAA,CAErD,EAAA,CAAA;AAEb,CAAC"}

package/dist/components/number-input-field/NumberInputField.d.ts CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { ValidationOptions } from '../../components/form/validation';
+import type { ValidationOptions } from '../form/validation';
 import type { NumberInputProps } from '../number-input/NumberInput';
 export interface NumberInputFieldProps extends NumberInputProps {
     className?: string;
@@ -13,7 +13,7 @@ export interface NumberInputFieldProps extends NumberInputProps {
     };
     validation?: ValidationOptions;
 }
-export declare const NumberInputField: {
-    ({ className, defaultValue, hideLabel, value, prompt, description, label, name, validation, onValueChange, appearance, theme, ...remainingProps }: NumberInputFieldProps): React.JSX.Element;
-    displayName: string;
-};
+export declare function NumberInputField({ className, defaultValue, hideLabel, value, prompt, description, label, name, validation, onValueChange, appearance, theme, ...rest }: NumberInputFieldProps): React.JSX.Element;
+export declare namespace NumberInputField {
+    var displayName: string;
+}

package/dist/components/number-input-field/NumberInputField.js CHANGED Viewed

@@ -6,7 +6,7 @@ import * as React$1 from "react";
 import { jsx } from "react/jsx-runtime";
 import { useController, useFormContext } from "react-hook-form";
 //#region src/components/number-input-field/NumberInputField.tsx
-var NumberInputField = ({ className, defaultValue = 0, hideLabel, value, prompt, description, label, name, validation, onValueChange, appearance, theme, ...remainingProps }) => {
+var NumberInputField = ({ className, defaultValue = 0, hideLabel, value, prompt, description, label, name, validation, onValueChange, appearance, theme, ...rest }) => {
 	const { control } = useFormContext();
 	const context = useFormCustomContext();
 	const { field: { ref, onChange, value: innerValue, name: innerName } } = useController({
@@ -47,7 +47,7 @@ var NumberInputField = ({ className, defaultValue = 0, hideLabel, value, prompt,
 			value: innerValue,
 			appearance: formAppearance,
 			theme: formTheme,
-			...remainingProps
+			...rest
 		})
 	});
 };

package/dist/components/number-input-field/NumberInputField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"NumberInputField.js","names":[],"sources":["../../../src/components/number-input-field/NumberInputField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { FieldWrapper } from '~~~/components/~~field-wrapper/FieldWrapper'\nimport { useFieldError } from '~~~/components/~~form/useFieldError'\nimport { useFormCustomContext } from '~~~/components/~~form/useFormCustomContext'\nimport { ValidationOptions } from '~~~/components/~~form/validation'\n\nimport type { NumberInputProps } from '../number-input/NumberInput'\nimport { NumberInput } from '../number-input/NumberInput'\n\nexport interface NumberInputFieldProps extends NumberInputProps {\n className?: string\n hideLabel?: boolean\n description?: string\n label: string\n name: string\n prompt?: { link: string; label: string }\n validation?: ValidationOptions\n}\n\nexport const NumberInputField = ({\n className,\n defaultValue = 0,\n hideLabel,\n value,\n prompt,\n description,\n label,\n name,\n validation,\n onValueChange,\n appearance,\n theme,\n ...~~remainingProps~~\n}: NumberInputFieldProps) => {\n const { control } = useFormContext()\n const context = useFormCustomContext()\n const {\n field: { ref, onChange, value: innerValue, name: innerName }\n } = useController({\n name,\n control,\n rules: validation,\n defaultValue\n })\n const { error } = useFieldError(name)\n\n const formAppearance = context?.appearance \|\| appearance\n const formTheme = context?.theme ?? theme\n\n React.useEffect(() => {\n // Update the react-hook-form inner value to match what is passed in.\n if (typeof value !== 'undefined') onChange(value)\n }, [value])\n\n return (\n <FieldWrapper\n className={className}\n description={description}\n error={error}\n fieldId={name}\n hideLabel={hideLabel}\n label={label}\n prompt={prompt}\n required={Boolean(validation?.required)}\n appearance={formAppearance}\n >\n <NumberInput\n id={name}\n name={innerName}\n ref={ref}\n {...(error && { state: 'error', 'aria-invalid': true })}\n defaultValue={defaultValue}\n onValueChange={(newValue) => {\n onChange(newValue)\n onValueChange?.(newValue)\n }}\n value={innerValue}\n appearance={formAppearance}\n theme={formTheme}\n {...~~remainingProps~~}\n />\n </FieldWrapper>\n )\n}\n\nNumberInputField.displayName = 'NumberInputField'\n"],"mappings":";;;;;;;;~~AAqBA~~,IAAa,oBAAoB,EAC/B,WACA,eAAe,GACf,WACA,OACA,QACA,aACA,OACA,MACA,YACA,eACA,YACA,OACA,GAAG,~~qBACwB~~;CAC3B,MAAM,EAAE,YAAY,~~gBAAgB~~;~~CACpC~~,MAAM,UAAU,~~sBAAsB~~;~~CACtC~~,MAAM,EACJ,OAAO,EAAE,KAAK,UAAU,OAAO,YAAY,MAAM,gBAC/C,cAAc;EAChB;EACA;EACA,OAAO;EACP;~~EACD~~,CAAC;~~CACF~~,MAAM,EAAE,UAAU,cAAc,~~KAAK~~;~~CAErC~~,MAAM,iBAAiB,SAAS,cAAc;CAC9C,MAAM,YAAY,SAAS,SAAS;~~AAEpC~~,~~SAAM~~,gBAAgB;~~AAEpB~~,~~MAAI~~,OAAO,UAAU,~~YAAa~~,~~UAAS~~,~~MAAM~~;~~IAChD~~,CAAC,~~MAAM~~,CAAC;~~AAEX~~,~~QACE~~,oBAAC,cAAD;EACa;EACE;EACN;EACP,SAAS;EACE;EACJ;EACC;EACR,UAAU,QAAQ,YAAY,~~SAAS~~;~~EACvC~~,YAAY;YAEZ,oBAAC,aAAD;GACE,IAAI;GACJ,MAAM;GACD;GACL,GAAK,SAAS;IAAE,OAAO;IAAS,gBAAgB;~~IAAM~~;~~GACxC~~;GACd,gBAAgB,aAAa;~~AAC3B~~,~~aAAS~~,~~SAAS~~;~~AAClB~~,~~oBAAgB~~,~~SAAS;;GAE3B~~,OAAO;GACP,YAAY;GACZ,OAAO;GACP,GAAI;~~GACJ~~,CAAA;~~EACW~~,CAAA~~;;AAInB~~,iBAAiB,cAAc"}
1	+ {"version":3,"file":"NumberInputField.js","names":[],"sources":["../../../src/components/number-input-field/NumberInputField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { FieldWrapper } from '../field-wrapper/FieldWrapper'\nimport { useFieldError } from '../form/useFieldError'\nimport { useFormCustomContext } from '../form/useFormCustomContext'\nimport type { ValidationOptions } from '../form/validation'\nimport type { NumberInputProps } from '../number-input/NumberInput'\nimport { NumberInput } from '../number-input/NumberInput'\n\nexport interface NumberInputFieldProps extends NumberInputProps {\n className?: string\n hideLabel?: boolean\n description?: string\n label: string\n name: string\n prompt?: { link: string; label: string }\n validation?: ValidationOptions\n}\n\nexport const NumberInputField = ({\n className,\n defaultValue = 0,\n hideLabel,\n value,\n prompt,\n description,\n label,\n name,\n validation,\n onValueChange,\n appearance,\n theme,\n ...rest\n}: NumberInputFieldProps) => {\n const { control } = useFormContext()\n const context = useFormCustomContext()\n const {\n field: { ref, onChange, value: innerValue, name: innerName }\n } = useController({\n name,\n control,\n rules: validation,\n defaultValue\n })\n const { error } = useFieldError(name)\n\n const formAppearance = context?.appearance \|\| appearance\n const formTheme = context?.theme ?? theme\n\n React.useEffect(() => {\n // Update the react-hook-form inner value to match what is passed in.\n if (typeof value !== 'undefined') onChange(value)\n }, [value])\n\n return (\n <FieldWrapper\n className={className}\n description={description}\n error={error}\n fieldId={name}\n hideLabel={hideLabel}\n label={label}\n prompt={prompt}\n required={Boolean(validation?.required)}\n appearance={formAppearance}\n >\n <NumberInput\n id={name}\n name={innerName}\n ref={ref}\n {...(error && { state: 'error', 'aria-invalid': true })}\n defaultValue={defaultValue}\n onValueChange={(newValue) => {\n onChange(newValue)\n onValueChange?.(newValue)\n }}\n value={innerValue}\n appearance={formAppearance}\n theme={formTheme}\n {...rest}\n />\n </FieldWrapper>\n )\n}\n\nNumberInputField.displayName = 'NumberInputField'\n"],"mappings":";;;;;;;;AAoBA,IAAa,oBAAoB,EAC/B,WACA,eAAe,GACf,WACA,OACA,QACA,aACA,OACA,MACA,YACA,eACA,YACA,OACA,GAAG,WACwB;CAC3B,MAAM,EAAE,YAAY,eAAe;CACnC,MAAM,UAAU,qBAAqB;CACrC,MAAM,EACJ,OAAO,EAAE,KAAK,UAAU,OAAO,YAAY,MAAM,gBAC/C,cAAc;EAChB;EACA;EACA,OAAO;EACP;CACF,CAAC;CACD,MAAM,EAAE,UAAU,cAAc,IAAI;CAEpC,MAAM,iBAAiB,SAAS,cAAc;CAC9C,MAAM,YAAY,SAAS,SAAS;CAEpC,QAAM,gBAAgB;EAEpB,IAAI,OAAO,UAAU,aAAa,SAAS,KAAK;CAClD,GAAG,CAAC,KAAK,CAAC;CAEV,OACE,oBAAC,cAAD;EACa;EACE;EACN;EACP,SAAS;EACE;EACJ;EACC;EACR,UAAU,QAAQ,YAAY,QAAQ;EACtC,YAAY;YAEZ,oBAAC,aAAD;GACE,IAAI;GACJ,MAAM;GACD;GACL,GAAK,SAAS;IAAE,OAAO;IAAS,gBAAgB;GAAK;GACvC;GACd,gBAAgB,aAAa;IAC3B,SAAS,QAAQ;IACjB,gBAAgB,QAAQ;GAC1B;GACA,OAAO;GACP,YAAY;GACZ,OAAO;GACP,GAAI;EACL,CAAA;CACW,CAAA;AAElB;AAEA,iBAAiB,cAAc"}

package/dist/components/pagination/{pagination-context/PaginationContext.d.ts → Pagination.context.d.ts} RENAMED Viewed

@@ -1,4 +1,4 @@
 import * as React from 'react';
-import type { PaginationContextValue, PaginationProviderProps } from '../types';
+import type { PaginationContextValue, PaginationProviderProps } from './types';
 export declare const PaginationContext: React.Context<PaginationContextValue>;
 export declare const PaginationProvider: ({ onSelectedPageChange, selectedPage, visibleElementsCount, pagesCount, indicatedPages, disabledPages, onItemHover, labels, children }: React.PropsWithChildren<PaginationProviderProps>) => React.JSX.Element;

package/dist/components/pagination/{pagination-context/PaginationContext.js → Pagination.context.js} RENAMED Viewed

@@ -1,8 +1,8 @@
-import { VisibleElementsAmount } from "../pagination.constants.js";
-import { findNextAvailablePage, findPreviousAvailablePage, getPaginationElementsToRender } from "../pagination.helper.js";
+import { VisibleElementsAmount } from "./pagination.constants.js";
+import { findNextAvailablePage, findPreviousAvailablePage, getPaginationElementsToRender } from "./pagination.helper.js";
 import * as React$1 from "react";
 import { jsx } from "react/jsx-runtime";
-//#region src/components/pagination/pagination-context/PaginationContext.tsx
+//#region src/components/pagination/Pagination.context.tsx
 var PaginationContext = React$1.createContext({
 	goToPage: () => null,
 	goToPreviousPage: () => null,
@@ -68,4 +68,4 @@ var PaginationProvider = ({ onSelectedPageChange, selectedPage, visibleElementsC
 //#endregion
 export { PaginationContext, PaginationProvider };
-//# sourceMappingURL=PaginationContext.js.map
+//# sourceMappingURL=Pagination.context.js.map

package/dist/components/pagination/Pagination.context.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"Pagination.context.js","names":[],"sources":["../../../src/components/pagination/Pagination.context.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { VisibleElementsAmount } from './pagination.constants'\nimport {\n findNextAvailablePage,\n findPreviousAvailablePage,\n getPaginationElementsToRender\n} from './pagination.helper'\nimport type { PaginationContextValue, PaginationProviderProps } from './types'\n\nexport const PaginationContext = React.createContext<PaginationContextValue>({\n goToPage: () => null,\n goToPreviousPage: () => null,\n goToNextPage: () => null,\n currentPage: 1,\n pagesCount: 0,\n onItemHover: () => null,\n paginationItems: [],\n labels: {},\n indicatedPages: [],\n disabledPages: []\n})\n\nexport const PaginationProvider = ({\n onSelectedPageChange,\n selectedPage,\n visibleElementsCount = VisibleElementsAmount.LESS,\n pagesCount,\n indicatedPages = [],\n disabledPages = [],\n onItemHover = () => null,\n labels = {},\n children\n}: React.PropsWithChildren<PaginationProviderProps>) => {\n const [internalCurrentPage, setInternalCurrentPage] = React.useState(1)\n\n const currentPage = selectedPage || internalCurrentPage\n\n const goToPage = React.useCallback(\n (pageNumber: number) => {\n setInternalCurrentPage(pageNumber)\n onSelectedPageChange?.(pageNumber)\n },\n [onSelectedPageChange]\n )\n\n const previousPage = currentPage - 1\n const previousAvailablePage = findPreviousAvailablePage(\n previousPage,\n disabledPages\n )\n\n const goToPreviousPage = React.useCallback(() => {\n if (previousAvailablePage) goToPage(previousAvailablePage)\n }, [goToPage, previousAvailablePage])\n\n const nextPage = currentPage + 1\n const nextAvailablePage = findNextAvailablePage(\n nextPage,\n disabledPages,\n pagesCount\n )\n const goToNextPage = React.useCallback(() => {\n if (nextAvailablePage) goToPage(nextAvailablePage)\n }, [goToPage, nextAvailablePage])\n\n const paginationItems = getPaginationElementsToRender(\n currentPage,\n pagesCount,\n visibleElementsCount\n )\n\n const value = React.useMemo(() => {\n return {\n goToNextPage,\n goToPreviousPage,\n goToPage,\n currentPage,\n paginationItems,\n indicatedPages,\n disabledPages,\n pagesCount,\n onItemHover,\n previousAvailablePage,\n nextAvailablePage,\n labels\n }\n }, [\n goToNextPage,\n goToPreviousPage,\n goToPage,\n currentPage,\n indicatedPages,\n paginationItems,\n disabledPages,\n pagesCount,\n onItemHover,\n previousAvailablePage,\n nextAvailablePage,\n labels\n ])\n\n return (\n <PaginationContext.Provider value={value}>\n {children}\n </PaginationContext.Provider>\n )\n}\n"],"mappings":";;;;;AAUA,IAAa,oBAAoB,QAAM,cAAsC;CAC3E,gBAAgB;CAChB,wBAAwB;CACxB,oBAAoB;CACpB,aAAa;CACb,YAAY;CACZ,mBAAmB;CACnB,iBAAiB,CAAC;CAClB,QAAQ,CAAC;CACT,gBAAgB,CAAC;CACjB,eAAe,CAAC;AAClB,CAAC;AAED,IAAa,sBAAsB,EACjC,sBACA,cACA,uBAAuB,sBAAsB,MAC7C,YACA,iBAAiB,CAAC,GAClB,gBAAgB,CAAC,GACjB,oBAAoB,MACpB,SAAS,CAAC,GACV,eACsD;CACtD,MAAM,CAAC,qBAAqB,0BAA0B,QAAM,SAAS,CAAC;CAEtE,MAAM,cAAc,gBAAgB;CAEpC,MAAM,WAAW,QAAM,aACpB,eAAuB;EACtB,uBAAuB,UAAU;EACjC,uBAAuB,UAAU;CACnC,GACA,CAAC,oBAAoB,CACvB;CAGA,MAAM,wBAAwB,0BADT,cAAc,GAGjC,aACF;CAEA,MAAM,mBAAmB,QAAM,kBAAkB;EAC/C,IAAI,uBAAuB,SAAS,qBAAqB;CAC3D,GAAG,CAAC,UAAU,qBAAqB,CAAC;CAGpC,MAAM,oBAAoB,sBADT,cAAc,GAG7B,eACA,UACF;CACA,MAAM,eAAe,QAAM,kBAAkB;EAC3C,IAAI,mBAAmB,SAAS,iBAAiB;CACnD,GAAG,CAAC,UAAU,iBAAiB,CAAC;CAEhC,MAAM,kBAAkB,8BACtB,aACA,YACA,oBACF;CAEA,MAAM,QAAQ,QAAM,cAAc;EAChC,OAAO;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;CACF,GAAG;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF,CAAC;CAED,OACE,oBAAC,kBAAkB,UAAnB;EAAmC;EAChC;CACyB,CAAA;AAEhC"}

package/dist/components/pagination/Pagination.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import { cn } from "../../styled.js";
 import { ColorScheme } from "../../experiments/color-scheme/ColorScheme.js";
 import { VisibleElementsAmount } from "./pagination.constants.js";
-import { PaginationProvider } from "./pagination-context/PaginationContext.js";
+import { PaginationProvider } from "./Pagination.context.js";
 import { PaginationPopover } from "./PaginationPopover.js";
 import { PaginationItems } from "./PaginationItems.js";
 import "react";

package/dist/components/pagination/Pagination.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Pagination.js","names":[],"sources":["../../../src/components/pagination/Pagination.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { cn } from '~~~/styled~~'\n\nimport { ~~ColorScheme~~ } from '../../~~experiments/color-scheme/ColorScheme~~'\nimport { ~~PaginationProvider~~ } from './pagination~~-context/PaginationContext~~'\nimport { ~~VisibleElementsAmount~~ } from './~~pagination~~.~~constants~~'\nimport { PaginationItems } from './PaginationItems'\nimport { PaginationPopover } from './PaginationPopover'\nimport type { PaginationProps, PaginationProviderProps } from './types'\n\nconst PaginationComponent = ({\n colorScheme,\n onSelectedPageChange,\n selectedPage,\n visibleElementsCount = VisibleElementsAmount.LESS,\n pagesCount,\n indicatedPages = [],\n disabledPages = [],\n onItemHover = () => null,\n labels = {},\n children,\n className,\n ...rest\n}: PaginationProps) => {\n if (!pagesCount) return null\n\n const paginationProviderProps: PaginationProviderProps = {\n onSelectedPageChange,\n selectedPage,\n visibleElementsCount,\n pagesCount,\n indicatedPages,\n disabledPages,\n onItemHover,\n labels\n }\n\n return (\n <PaginationProvider {...paginationProviderProps}>\n <ColorScheme base=\"grey1\" accent=\"primary1\" {...colorScheme} asChild>\n <div {...rest} className={cn('flex', 'gap-1', className)}>\n {children \|\| <PaginationItems />}\n </div>\n </ColorScheme>\n </PaginationProvider>\n )\n}\n\nexport const Pagination = Object.assign(PaginationComponent, {\n Popover: PaginationPopover\n})\n\nPaginationComponent.displayName = 'Pagination'\n"],"mappings":";;;;;;;;;~~AAWA~~,IAAM,uBAAuB,EAC3B,aACA,sBACA,cACA,uBAAuB,sBAAsB,MAC7C,YACA,iBAAiB,~~EAAE~~,~~EACnB~~,gBAAgB,~~EAAE~~,~~EAClB~~,oBAAoB,MACpB,SAAS,~~EAAE~~,~~EACX~~,UACA,WACA,GAAG,WACkB;~~AACrB~~,~~KAAI~~,CAAC,~~WAAY~~,~~QAAO~~;~~AAaxB~~,~~QACE~~,oBAAC,oBAAD;EAXA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;YAKE,oBAAC,aAAD;GAAa,MAAK;GAAQ,QAAO;GAAW,GAAI;GAAa,SAAA;aAC3D,oBAAC,OAAD;IAAK,GAAI;IAAM,WAAW,GAAG,QAAQ,SAAS,~~UAAU~~;~~cACrD~~,YAAY,oBAAC,iBAAD,~~EAAmB~~,CAAA;~~IAC5B~~,CAAA;~~GACM~~,CAAA;~~EACK~~,CAAA~~;;AAIzB~~,IAAa,aAAa,OAAO,OAAO,qBAAqB,EAC3D,SAAS,~~mBACV~~,CAAC;~~AAEF~~,oBAAoB,cAAc"}
1	+ {"version":3,"file":"Pagination.js","names":[],"sources":["../../../src/components/pagination/Pagination.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { ColorScheme } from '../../experiments/color-scheme/ColorScheme'\nimport { cn } from '../../styled'\nimport { VisibleElementsAmount } from './pagination.constants'\nimport { PaginationProvider } from './Pagination.context'\nimport { PaginationItems } from './PaginationItems'\nimport { PaginationPopover } from './PaginationPopover'\nimport type { PaginationProps, PaginationProviderProps } from './types'\n\nconst PaginationComponent = ({\n colorScheme,\n onSelectedPageChange,\n selectedPage,\n visibleElementsCount = VisibleElementsAmount.LESS,\n pagesCount,\n indicatedPages = [],\n disabledPages = [],\n onItemHover = () => null,\n labels = {},\n children,\n className,\n ...rest\n}: PaginationProps) => {\n if (!pagesCount) return null\n\n const paginationProviderProps: PaginationProviderProps = {\n onSelectedPageChange,\n selectedPage,\n visibleElementsCount,\n pagesCount,\n indicatedPages,\n disabledPages,\n onItemHover,\n labels\n }\n\n return (\n <PaginationProvider {...paginationProviderProps}>\n <ColorScheme base=\"grey1\" accent=\"primary1\" {...colorScheme} asChild>\n <div {...rest} className={cn('flex', 'gap-1', className)}>\n {children \|\| <PaginationItems />}\n </div>\n </ColorScheme>\n </PaginationProvider>\n )\n}\n\nexport const Pagination = Object.assign(PaginationComponent, {\n Popover: PaginationPopover\n})\n\nPaginationComponent.displayName = 'Pagination'\n"],"mappings":";;;;;;;;;AAUA,IAAM,uBAAuB,EAC3B,aACA,sBACA,cACA,uBAAuB,sBAAsB,MAC7C,YACA,iBAAiB,CAAC,GAClB,gBAAgB,CAAC,GACjB,oBAAoB,MACpB,SAAS,CAAC,GACV,UACA,WACA,GAAG,WACkB;CACrB,IAAI,CAAC,YAAY,OAAO;CAaxB,OACE,oBAAC,oBAAD;EAXA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;YAKE,oBAAC,aAAD;GAAa,MAAK;GAAQ,QAAO;GAAW,GAAI;GAAa,SAAA;aAC3D,oBAAC,OAAD;IAAK,GAAI;IAAM,WAAW,GAAG,QAAQ,SAAS,SAAS;cACpD,YAAY,oBAAC,iBAAD,CAAkB,CAAA;GAC5B,CAAA;EACM,CAAA;CACK,CAAA;AAExB;AAEA,IAAa,aAAa,OAAO,OAAO,qBAAqB,EAC3D,SAAS,kBACX,CAAC;AAED,oBAAoB,cAAc"}

package/dist/components/pagination/PaginationItems.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PaginationItems.js","names":[],"sources":["../../../src/components/pagination/PaginationItems.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {\n GO_TO_NEXT_PAGE,\n GO_TO_PREVIOUS_PAGE,\n VIEW_ALL_POPOVER\n} from './pagination.constants'\nimport { PaginationNextButton } from './PaginationNextButton'\nimport { PaginationPage } from './PaginationPage'\nimport { PaginationPopover } from './PaginationPopover'\nimport { PaginationPreviousButton } from './PaginationPreviousButton'\nimport { usePagination } from './usePagination'\n\nexport const PaginationItems = (): ~~React.JSX.Element~~ => {\n const { paginationItems } = usePagination()\n\n return (\n <>\n {paginationItems.map((paginationItem, i) => {\n switch (paginationItem) {\n case VIEW_ALL_POPOVER:\n return <PaginationPopover key={paginationItem + i} />\n case GO_TO_PREVIOUS_PAGE:\n return <PaginationPreviousButton key={paginationItem} />\n case GO_TO_NEXT_PAGE:\n return <PaginationNextButton key={paginationItem} />\n default:\n return (\n <PaginationPage\n key={paginationItem}\n pageNumber={paginationItem}\n />\n )\n }\n })}\n </>\n )\n}\n"],"mappings":";;;;;;;;;AAaA,IAAa,~~wBAA2C~~;~~CACtD~~,MAAM,EAAE,oBAAoB,~~eAAe~~;~~AAE3C~~,~~QACE~~,oBAAA,UAAA,EAAA,UACG,gBAAgB,KAAK,gBAAgB,MAAM;~~AAC1C~~,~~UAAQ~~,gBAAR;GACE,KAAK,~~iBACH~~,~~QAAO~~,oBAAC,mBAAD,~~EAA8C~~,~~EAAtB~~,iBAAiB,~~EAAK~~;~~GACvD~~,KAAK,~~oBACH~~,~~QAAO~~,oBAAC,0BAAD,~~EAAiD~~,~~EAAlB~~,~~eAAkB~~;~~GAC1D~~,KAAK,~~gBACH~~,~~QAAO~~,oBAAC,sBAAD,~~EAA6C~~,~~EAAlB~~,~~eAAkB~~;~~GACtD~~,~~QACE~~,~~QACE~~,oBAAC,gBAAD,EAEE,YAAY,~~gBACZ~~,~~EAFK~~,~~eAEL;;GAGR~~,EACD,CAAA"}
1	+ {"version":3,"file":"PaginationItems.js","names":[],"sources":["../../../src/components/pagination/PaginationItems.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport {\n GO_TO_NEXT_PAGE,\n GO_TO_PREVIOUS_PAGE,\n VIEW_ALL_POPOVER\n} from './pagination.constants'\nimport { PaginationNextButton } from './PaginationNextButton'\nimport { PaginationPage } from './PaginationPage'\nimport { PaginationPopover } from './PaginationPopover'\nimport { PaginationPreviousButton } from './PaginationPreviousButton'\nimport { usePagination } from './usePagination'\n\nexport const PaginationItems = () => {\n const { paginationItems } = usePagination()\n\n return (\n <>\n {paginationItems.map((paginationItem, i) => {\n switch (paginationItem) {\n case VIEW_ALL_POPOVER:\n return <PaginationPopover key={paginationItem + i} />\n case GO_TO_PREVIOUS_PAGE:\n return <PaginationPreviousButton key={paginationItem} />\n case GO_TO_NEXT_PAGE:\n return <PaginationNextButton key={paginationItem} />\n default:\n return (\n <PaginationPage\n key={paginationItem}\n pageNumber={paginationItem}\n />\n )\n }\n })}\n </>\n )\n}\n"],"mappings":";;;;;;;;;AAaA,IAAa,wBAAwB;CACnC,MAAM,EAAE,oBAAoB,cAAc;CAE1C,OACE,oBAAA,UAAA,EAAA,UACG,gBAAgB,KAAK,gBAAgB,MAAM;EAC1C,QAAQ,gBAAR;GACE,KAAK,kBACH,OAAO,oBAAC,mBAAD,CAA6C,GAArB,iBAAiB,CAAI;GACtD,KAAK,qBACH,OAAO,oBAAC,0BAAD,CAAgD,GAAjB,cAAiB;GACzD,KAAK,iBACH,OAAO,oBAAC,sBAAD,CAA4C,GAAjB,cAAiB;GACrD,SACE,OACE,oBAAC,gBAAD,EAEE,YAAY,eACb,GAFM,cAEN;EAEP;CACF,CAAC,EACD,CAAA;AAEN"}

package/dist/components/pagination/PaginationNextButton.d.ts CHANGED Viewed

@@ -1,15 +1,15 @@
 import * as React from 'react';
-declare const StyledActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "appearance" | "size" | "theme" | "isRounded"> & {
-    theme?: ("primary" | "white" | "neutral" | "primaryDark" | "success" | "warning" | "danger" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "primary" | "white" | "neutral" | "primaryDark" | "success" | "warning" | "danger">>) | undefined;
-    appearance?: ("simple" | "outline" | "solid" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "simple" | "outline" | "solid">>) | undefined;
-    size?: ("sm" | "md" | "lg" | "xs" | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", "sm" | "md" | "lg" | "xs">>) | undefined;
-    isRounded?: (boolean | Partial<Record<"@initial" | "@sm" | "@md" | "@lg" | "@xl", boolean>>) | undefined;
+declare const StyledActionIcon: React.ForwardRefExoticComponent<Omit<Omit<Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "appearance" | "isRounded" | "size" | "theme"> & {
+    theme?: ("danger" | "neutral" | "primary" | "primaryDark" | "success" | "warning" | "white" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "danger" | "neutral" | "primary" | "primaryDark" | "success" | "warning" | "white">>) | undefined;
+    appearance?: ("outline" | "simple" | "solid" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "outline" | "simple" | "solid">>) | undefined;
+    size?: ("lg" | "md" | "sm" | "xs" | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", "lg" | "md" | "sm" | "xs">>) | undefined;
+    isRounded?: (boolean | Partial<Record<"@initial" | "@lg" | "@md" | "@sm" | "@xl", boolean>>) | undefined;
 } & {
     as?: React.ElementType;
-}, "children" | "label" | "hasTooltip" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
+}, "children" | "hasTooltip" | "label" | "tooltipSide" | keyof import("../..").NavigatorActions> & {
     children: React.ReactNode;
     label: string;
-} & Omit<import("../..").TOptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, never> & {
+} & Omit<import("../..").OptionalTooltipWrapperProps, "label"> & import("../..").NavigatorActions, "ref"> & React.RefAttributes<HTMLButtonElement>, never> & {
     as?: React.ElementType;
 }>;
 export declare const PaginationNextButton: (props: Partial<React.ComponentProps<typeof StyledActionIcon>>) => React.JSX.Element;

package/dist/components/pagination/PaginationNextButton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PaginationNextButton.js","names":[],"sources":["../../../src/components/pagination/PaginationNextButton.tsx"],"sourcesContent":["import { ChevronRight } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\nimport { usePagination } from './usePagination'\n\nconst StyledActionIcon = styled(ActionIcon, {\n base: ['ml-1', 'disabled:opacity-30']\n})\n\nexport const PaginationNextButton = (\n props: Partial<React.ComponentProps<typeof StyledActionIcon>>\n) => {\n const { goToNextPage, labels, nextAvailablePage } = usePagination()\n\n const isDisabled = !nextAvailablePage\n\n return (\n <StyledActionIcon\n hasTooltip={false}\n size=\"md\"\n theme=\"neutral\"\n onClick={goToNextPage}\n disabled={isDisabled}\n {...props}\n label={labels?.nextPageButtonLabel \|\| 'Next page'}\n >\n <Icon is={ChevronRight} />\n </StyledActionIcon>\n )\n}\n"],"mappings":";;;;;;;;~~AASA~~,IAAM,mBAAmB,OAAO,YAAY,EAC1C,MAAM,CAAC,QAAQ,~~sBAAsB~~,EACtC,CAAC;~~AAEF~~,IAAa,wBACX,UACG;CACH,MAAM,EAAE,cAAc,QAAQ,sBAAsB,~~eAAe~~;~~AAInE~~,~~QACE~~,oBAAC,kBAAD;EACE,YAAY;EACZ,MAAK;EACL,OAAM;EACN,SAAS;EACT,~~UARe~~,~~CAAC~~;EAShB,GAAI;EACJ,OAAO,QAAQ,uBAAuB;YAEtC,oBAAC,MAAD,EAAM,IAAI,~~cAAgB~~,CAAA;~~EACT~~,CAAA"}
1	+ {"version":3,"file":"PaginationNextButton.js","names":[],"sources":["../../../src/components/pagination/PaginationNextButton.tsx"],"sourcesContent":["import { ChevronRight } from '@atom-learning/icons'\nimport * as React from 'react'\n\nimport { styled } from '../../styled'\nimport { ActionIcon } from '../action-icon/ActionIcon'\nimport { Icon } from '../icon/Icon'\nimport { usePagination } from './usePagination'\n\nconst StyledActionIcon = styled(ActionIcon, {\n base: ['ml-1', 'disabled:opacity-30']\n})\n\nexport const PaginationNextButton = (\n props: Partial<React.ComponentProps<typeof StyledActionIcon>>\n) => {\n const { goToNextPage, labels, nextAvailablePage } = usePagination()\n\n const isDisabled = !nextAvailablePage\n\n return (\n <StyledActionIcon\n hasTooltip={false}\n size=\"md\"\n theme=\"neutral\"\n onClick={goToNextPage}\n disabled={isDisabled}\n {...props}\n label={labels?.nextPageButtonLabel \|\| 'Next page'}\n >\n <Icon is={ChevronRight} />\n </StyledActionIcon>\n )\n}\n"],"mappings":";;;;;;;;AAQA,IAAM,mBAAmB,OAAO,YAAY,EAC1C,MAAM,CAAC,QAAQ,qBAAqB,EACtC,CAAC;AAED,IAAa,wBACX,UACG;CACH,MAAM,EAAE,cAAc,QAAQ,sBAAsB,cAAc;CAIlE,OACE,oBAAC,kBAAD;EACE,YAAY;EACZ,MAAK;EACL,OAAM;EACN,SAAS;EACT,UAAU,CARM;EAShB,GAAI;EACJ,OAAO,QAAQ,uBAAuB;YAEtC,oBAAC,MAAD,EAAM,IAAI,aAAe,CAAA;CACT,CAAA;AAEtB"}

package/dist/components/pagination/PaginationPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PaginationPage.js","names":[],"sources":["../../../src/components/pagination/PaginationPage.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport type { PaginationPageProps } from './types'\nimport { usePagination } from './usePagination'\n\nconst StyledButton = styled('button', {\n base: [\n 'items-center',\n 'border',\n 'border-transparent',\n 'rounded-sm',\n 'cursor-pointer',\n 'font-body',\n 'justify-center',\n 'whitespace-nowrap',\n 'w-max',\n 'flex',\n 'flex-col',\n 'p-0',\n 'font-normal',\n 'text-text-subtle',\n 'bg-(--base-1)',\n 'relative',\n 'not-disabled:active:bg-(--base-3)',\n 'not-disabled:active:text-(--text-bold)',\n 'not-disabled:focus-visible:outline-none',\n 'not-disabled:focus-visible:relative',\n 'not-disabled:focus-visible:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n 'not-disabled:focus-visible:shadow-[white_0px_0px_0px_2px]',\n 'not-disabled:focus-visible:z-1',\n 'not-disabled:hover:bg-(--base-2)',\n 'not-disabled:hover:text-text-regular',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30',\n 'disabled:pointer-events-none'\n ],\n variants: {\n size: {\n md: ['size-10']\n },\n selected: {\n true: [\n 'border',\n 'border-(--accent-9)',\n 'font-semibold',\n 'not-disabled:active:border-(--accent-11)',\n 'not-disabled:active:text-(--accent-11)',\n 'not-disabled:hover:border-(--accent-10)',\n 'not-disabled:hover:text-(--accent-10)',\n 'text-(--accent-9)'\n ]\n },\n indicated: {\n true: [\n 'bg-(--accent-9)',\n 'font-semibold',\n 'not-disabled:active:bg-(--accent-11)',\n 'not-disabled:active:text-white',\n 'not-disabled:hover:bg-(--accent-10)',\n 'not-disabled:hover:text-white',\n 'text-white'\n ]\n }\n },\n compoundVariants: [\n {\n selected: true,\n indicated: true,\n class: [\n 'bg-(--accent-9)',\n 'font-semibold',\n 'not-disabled:active:bg-(--accent-11)',\n 'not-disabled:active:text-white',\n 'not-disabled:hover:bg-(--accent-10)',\n 'not-disabled:hover:text-white',\n 'not-focus-visible:border-white!',\n 'shadow-[var(--accent-9)_0px_0px_0px_1px]',\n 'text-white'\n ]\n }\n ]\n})\n\nexport const PaginationPage = ({\n pageNumber,\n className,\n onClick\n}: PaginationPageProps) => {\n const { currentPage, goToPage, indicatedPages, disabledPages, onItemHover } =\n usePagination()\n\n const isIndicated = indicatedPages.includes(pageNumber)\n const isDisabled = disabledPages.includes(pageNumber)\n\n const isSelected = currentPage === pageNumber\n\n const handleOnHover = () => {\n if (isSelected \|\| isDisabled) return\n onItemHover?.(pageNumber)\n }\n\n const handleOnClick = (pageNumber) => {\n onClick?.()\n goToPage(pageNumber)\n }\n\n return (\n <StyledButton\n selected={isSelected}\n size=\"md\"\n onClick={() => handleOnClick(pageNumber)}\n className={className}\n indicated={isIndicated}\n disabled={isDisabled}\n aria-current={isSelected && 'page'}\n aria-disabled={isDisabled}\n onMouseOver={handleOnHover}\n >\n {pageNumber}\n </StyledButton>\n )\n}\n"],"mappings":";;;;;~~AAOA~~,IAAM,eAAe,OAAO,UAAU;CACpC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;~~EACD~~;~~CACD~~,UAAU;EACR,MAAM,EACJ,IAAI,CAAC,~~UAAU~~,EAChB;~~EACD~~,UAAU,EACR,MAAM;GACJ;GACA;GACA;GACA;GACA;GACA;GACA;GACA;~~GACD~~,EACF;~~EACD~~,WAAW,EACT,MAAM;GACJ;GACA;GACA;GACA;GACA;GACA;GACA;~~GACD~~,EACF;~~EACF~~;~~CACD~~,kBAAkB,CAChB;EACE,UAAU;EACV,WAAW;EACX,OAAO;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;~~GACD~~;~~EACF~~,CACF;~~CACF~~,CAAC;~~AAEF~~,IAAa,kBAAkB,EAC7B,YACA,WACA,cACyB;CACzB,MAAM,EAAE,aAAa,UAAU,gBAAgB,eAAe,gBAC5D,~~eAAe~~;~~CAEjB~~,MAAM,cAAc,eAAe,SAAS,~~WAAW~~;~~CACvD~~,MAAM,aAAa,cAAc,SAAS,~~WAAW~~;~~CAErD~~,MAAM,aAAa,gBAAgB;CAEnC,MAAM,sBAAsB;~~AAC1B~~,~~MAAI~~,cAAc,~~WAAY~~;~~AAC9B~~,~~gBAAc~~,~~WAAW;;CAG3B~~,MAAM,iBAAiB,eAAe;~~AACpC~~,~~aAAW~~;~~AACX~~,~~WAAS~~,~~WAAW;;AAGtB~~,~~QACE~~,oBAAC,cAAD;EACE,UAAU;EACV,MAAK;EACL,eAAe,cAAc,~~WAAW~~;~~EAC7B~~;EACX,WAAW;EACX,UAAU;EACV,gBAAc,cAAc;EAC5B,iBAAe;EACf,aAAa;YAEZ;~~EACY~~,CAAA"}
1	+ {"version":3,"file":"PaginationPage.js","names":[],"sources":["../../../src/components/pagination/PaginationPage.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '../../styled'\nimport type { PaginationPageProps } from './types'\nimport { usePagination } from './usePagination'\n\nconst StyledButton = styled('button', {\n base: [\n 'items-center',\n 'border',\n 'border-transparent',\n 'rounded-sm',\n 'cursor-pointer',\n 'font-body',\n 'justify-center',\n 'whitespace-nowrap',\n 'w-max',\n 'flex',\n 'flex-col',\n 'p-0',\n 'font-normal',\n 'text-text-subtle',\n 'bg-(--base-1)',\n 'relative',\n 'not-disabled:active:bg-(--base-3)',\n 'not-disabled:active:text-(--text-bold)',\n 'not-disabled:focus-visible:outline-none',\n 'not-disabled:focus-visible:relative',\n 'not-disabled:focus-visible:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n 'not-disabled:focus-visible:shadow-[white_0px_0px_0px_2px]',\n 'not-disabled:focus-visible:z-1',\n 'not-disabled:hover:bg-(--base-2)',\n 'not-disabled:hover:text-text-regular',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30',\n 'disabled:pointer-events-none'\n ],\n variants: {\n size: {\n md: ['size-10']\n },\n selected: {\n true: [\n 'border',\n 'border-(--accent-9)',\n 'font-semibold',\n 'not-disabled:active:border-(--accent-11)',\n 'not-disabled:active:text-(--accent-11)',\n 'not-disabled:hover:border-(--accent-10)',\n 'not-disabled:hover:text-(--accent-10)',\n 'text-(--accent-9)'\n ]\n },\n indicated: {\n true: [\n 'bg-(--accent-9)',\n 'font-semibold',\n 'not-disabled:active:bg-(--accent-11)',\n 'not-disabled:active:text-white',\n 'not-disabled:hover:bg-(--accent-10)',\n 'not-disabled:hover:text-white',\n 'text-white'\n ]\n }\n },\n compoundVariants: [\n {\n selected: true,\n indicated: true,\n class: [\n 'bg-(--accent-9)',\n 'font-semibold',\n 'not-disabled:active:bg-(--accent-11)',\n 'not-disabled:active:text-white',\n 'not-disabled:hover:bg-(--accent-10)',\n 'not-disabled:hover:text-white',\n 'not-focus-visible:border-white!',\n 'shadow-[var(--accent-9)_0px_0px_0px_1px]',\n 'text-white'\n ]\n }\n ]\n})\n\nexport const PaginationPage = ({\n pageNumber,\n className,\n onClick\n}: PaginationPageProps) => {\n const { currentPage, goToPage, indicatedPages, disabledPages, onItemHover } =\n usePagination()\n\n const isIndicated = indicatedPages.includes(pageNumber)\n const isDisabled = disabledPages.includes(pageNumber)\n\n const isSelected = currentPage === pageNumber\n\n const handleOnHover = () => {\n if (isSelected \|\| isDisabled) return\n onItemHover?.(pageNumber)\n }\n\n const handleOnClick = (pageNumber) => {\n onClick?.()\n goToPage(pageNumber)\n }\n\n return (\n <StyledButton\n selected={isSelected}\n size=\"md\"\n onClick={() => handleOnClick(pageNumber)}\n className={className}\n indicated={isIndicated}\n disabled={isDisabled}\n aria-current={isSelected && 'page'}\n aria-disabled={isDisabled}\n onMouseOver={handleOnHover}\n >\n {pageNumber}\n </StyledButton>\n )\n}\n"],"mappings":";;;;;AAMA,IAAM,eAAe,OAAO,UAAU;CACpC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,UAAU;EACR,MAAM,EACJ,IAAI,CAAC,SAAS,EAChB;EACA,UAAU,EACR,MAAM;GACJ;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF,EACF;EACA,WAAW,EACT,MAAM;GACJ;GACA;GACA;GACA;GACA;GACA;GACA;EACF,EACF;CACF;CACA,kBAAkB,CAChB;EACE,UAAU;EACV,WAAW;EACX,OAAO;GACL;GACA;GACA;GACA;GACA;GACA;GACA;GACA;GACA;EACF;CACF,CACF;AACF,CAAC;AAED,IAAa,kBAAkB,EAC7B,YACA,WACA,cACyB;CACzB,MAAM,EAAE,aAAa,UAAU,gBAAgB,eAAe,gBAC5D,cAAc;CAEhB,MAAM,cAAc,eAAe,SAAS,UAAU;CACtD,MAAM,aAAa,cAAc,SAAS,UAAU;CAEpD,MAAM,aAAa,gBAAgB;CAEnC,MAAM,sBAAsB;EAC1B,IAAI,cAAc,YAAY;EAC9B,cAAc,UAAU;CAC1B;CAEA,MAAM,iBAAiB,eAAe;EACpC,UAAU;EACV,SAAS,UAAU;CACrB;CAEA,OACE,oBAAC,cAAD;EACE,UAAU;EACV,MAAK;EACL,eAAe,cAAc,UAAU;EAC5B;EACX,WAAW;EACX,UAAU;EACV,gBAAc,cAAc;EAC5B,iBAAe;EACf,aAAa;YAEZ;CACW,CAAA;AAElB"}