@atom-learning/components 3.10.0 → 3.11.0

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

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","sources":["../../../src/components/pagination/Pagination.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { ColorScheme } from '../../experiments/color-scheme'\nimport { Flex } from '../flex'\nimport { VisibleElementsAmount } from './pagination.constants'\nimport { PaginationProvider } from './pagination-context/PaginationContext'\nimport { PaginationItems } from './PaginationItems'\nimport type { PaginationProps } from './types'\n\nexport const Pagination: React.FC<PaginationProps> = ({\n  colorScheme,\n  onSelectedPageChange,\n  selectedPage,\n  visibleElementsCount = VisibleElementsAmount.LESS,\n  pagesCount,\n  indicatedPages = [],\n  disabledPages = [],\n  onItemHover = () => null,\n  labels = {},\n  ...rest\n}) => {\n  if (!pagesCount) return null\n\n  const 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=\"blue1\" {...colorScheme} asChild>\n        <Flex gap={1} {...rest}>\n          <PaginationItems />\n        </Flex>\n      </ColorScheme>\n    </PaginationProvider>\n  )\n}\n\nPagination.displayName = 'Pagination'\n"],"names":["Pagination","colorScheme","onSelectedPageChange","selectedPage","visibleElementsCount","VisibleElementsAmount","pagesCount","indicatedPages","disabledPages","onItemHover","labels","rest","React","PaginationProvider","ColorScheme","Flex","PaginationItems"],"mappings":"mVASa,MAAAA,EAAwC,CAAC,CACpD,YAAAC,EACA,qBAAAC,EACA,aAAAC,EACA,qBAAAC,EAAuBC,EAAsB,KAC7C,WAAAC,EACA,eAAAC,EAAiB,CAAA,EACjB,cAAAC,EAAgB,CAChB,EAAA,YAAAC,EAAc,IAAM,KACpB,OAAAC,EAAS,CACNC,KAAAA,CACL,IACOL,EAcHM,EAAA,cAACC,EAAA,CAXD,qBAAAX,EACA,aAAAC,EACA,qBAAAC,EACA,WAAAE,EACA,eAAAC,EACA,cAAAC,EACA,YAAAC,EACA,OAAAC,CAKEE,EAAAA,EAAA,cAACE,EAAA,CAAY,KAAK,QAAQ,OAAO,QAAS,GAAGb,EAAa,QAAO,EAC/DW,EAAAA,EAAA,cAACG,EAAA,CAAK,IAAK,EAAI,GAAGJ,CAAAA,EAChBC,EAAA,cAACI,EAAA,IAAgB,CACnB,CACF,CACF,EApBsB,KAwB1BhB,EAAW,YAAc"}
+{"version":3,"file":"Pagination.js","sources":["../../../src/components/pagination/Pagination.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { ColorScheme } from '../../experiments/color-scheme'\nimport { Flex } from '../flex'\nimport { VisibleElementsAmount } from './pagination.constants'\nimport { PaginationProvider } from './pagination-context/PaginationContext'\nimport { PaginationItems } from './PaginationItems'\nimport type { PaginationProps } from './types'\n\nexport const Pagination: React.FC<PaginationProps> = ({\n  colorScheme,\n  onSelectedPageChange,\n  selectedPage,\n  visibleElementsCount = VisibleElementsAmount.LESS,\n  pagesCount,\n  indicatedPages = [],\n  disabledPages = [],\n  onItemHover = () => null,\n  labels = {},\n  ...rest\n}) => {\n  if (!pagesCount) return null\n\n  const 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        <Flex gap={1} {...rest}>\n          <PaginationItems />\n        </Flex>\n      </ColorScheme>\n    </PaginationProvider>\n  )\n}\n\nPagination.displayName = 'Pagination'\n"],"names":["Pagination","colorScheme","onSelectedPageChange","selectedPage","visibleElementsCount","VisibleElementsAmount","pagesCount","indicatedPages","disabledPages","onItemHover","labels","rest","React","PaginationProvider","ColorScheme","Flex","PaginationItems"],"mappings":"mVASa,MAAAA,EAAwC,CAAC,CACpD,YAAAC,EACA,qBAAAC,EACA,aAAAC,EACA,qBAAAC,EAAuBC,EAAsB,KAC7C,WAAAC,EACA,eAAAC,EAAiB,CAAA,EACjB,cAAAC,EAAgB,CAChB,EAAA,YAAAC,EAAc,IAAM,KACpB,OAAAC,EAAS,CACNC,KAAAA,CACL,IACOL,EAcHM,EAAA,cAACC,EAAA,CAXD,qBAAAX,EACA,aAAAC,EACA,qBAAAC,EACA,WAAAE,EACA,eAAAC,EACA,cAAAC,EACA,YAAAC,EACA,OAAAC,CAKEE,EAAAA,EAAA,cAACE,EAAA,CAAY,KAAK,QAAQ,OAAO,WAAY,GAAGb,EAAa,QAAO,EAClEW,EAAAA,EAAA,cAACG,EAAA,CAAK,IAAK,EAAI,GAAGJ,CAAAA,EAChBC,EAAA,cAACI,EAAA,IAAgB,CACnB,CACF,CACF,EApBsB,KAwB1BhB,EAAW,YAAc"}

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

@@ -2,7 +2,7 @@ import * as React from 'react';
 declare const StyledActionIcon: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Pick<Omit<Omit<Pick<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof React.ButtonHTMLAttributes<HTMLButtonElement>> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
 }, "appearance" | "size" | "css" | "theme" | "isRounded"> & import("@stitches/react/types/styled-component").TransformProps<{
-    theme?: "primary" | "success" | "danger" | "warning" | "neutral" | undefined;
+    theme?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
     appearance?: "outline" | "solid" | "simple" | undefined;
     size?: "sm" | "md" | "lg" | "xs" | undefined;
     isRounded?: boolean | "true" | undefined;
@@ -25,9 +25,10 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
         hover: string;
     }, {
         colors: {
-            textForeground: any;
+            textBold: any;
+            textRegular: any;
             textSubtle: any;
-            textPlaceholder: any;
+            textMinimal: any;
             background: any;
             backgroundAccent: any;
             grey100: any;
@@ -174,11 +175,6 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
             alpha200: any;
             alpha250: any;
             alpha600: any;
-            primaryLight: any;
-            primary: any;
-            primaryMid: any;
-            primaryDark: any;
-            secondary: any;
             brandRed: any;
             brandRedAccent: any;
             brandGreen: any;
@@ -187,6 +183,10 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
             brandPurpleAccent: any;
             brandYellow: any;
             brandYellowAccent: any;
+            infoLight: any;
+            info: any;
+            infoMid: any;
+            infoDark: any;
             successLight: any;
             success: any;
             successMid: any;
@@ -210,6 +210,18 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
             glBlueLight: any;
             glBluePrimary: any;
             glBlueDark: any;
+            primary100: any;
+            primary200: any;
+            primary300: any;
+            primary400: any;
+            primary500: any;
+            primary600: any;
+            primary700: any;
+            primary800: any;
+            primary900: any;
+            primary1000: any;
+            primary1100: any;
+            primary1200: any;
         };
         space: {
             "0": any;
@@ -327,7 +339,7 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
         };
     }> | undefined;
 }, "appearance" | "size" | "theme" | "label" | "children" | "as" | "hasTooltip" | "tooltipSide" | "isRounded" | keyof import("../../types").NavigatorActions> & import("@stitches/react/types/styled-component").TransformProps<{
-    theme?: "primary" | "success" | "danger" | "warning" | "neutral" | undefined;
+    theme?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
     appearance?: "outline" | "solid" | "simple" | undefined;
     size?: "sm" | "md" | "lg" | "xs" | undefined;
     isRounded?: boolean | "true" | undefined;
@@ -361,9 +373,10 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
     hover: string;
 }, {
     colors: {
-        textForeground: any;
+        textBold: any;
+        textRegular: any;
         textSubtle: any;
-        textPlaceholder: any;
+        textMinimal: any;
         background: any;
         backgroundAccent: any;
         grey100: any;
@@ -510,11 +523,6 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
         alpha200: any;
         alpha250: any;
         alpha600: any;
-        primaryLight: any;
-        primary: any;
-        primaryMid: any;
-        primaryDark: any;
-        secondary: any;
         brandRed: any;
         brandRedAccent: any;
         brandGreen: any;
@@ -523,6 +531,10 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
         brandPurpleAccent: any;
         brandYellow: any;
         brandYellowAccent: any;
+        infoLight: any;
+        info: any;
+        infoMid: any;
+        infoDark: any;
         successLight: any;
         success: any;
         successMid: any;
@@ -546,6 +558,18 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
         glBlueLight: any;
         glBluePrimary: any;
         glBlueDark: any;
+        primary100: any;
+        primary200: any;
+        primary300: any;
+        primary400: any;
+        primary500: any;
+        primary600: any;
+        primary700: any;
+        primary800: any;
+        primary900: any;
+        primary1000: any;
+        primary1100: any;
+        primary1200: any;
     };
     space: {
         "0": any;

package/dist/components/pagination/PaginationPreviousButton.d.ts

@@ -2,7 +2,7 @@ import * as React from 'react';
 declare const StyledActionIcon: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Pick<Omit<Omit<Pick<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "key" | keyof React.ButtonHTMLAttributes<HTMLButtonElement>> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
 }, "appearance" | "size" | "css" | "theme" | "isRounded"> & import("@stitches/react/types/styled-component").TransformProps<{
-    theme?: "primary" | "success" | "danger" | "warning" | "neutral" | undefined;
+    theme?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
     appearance?: "outline" | "solid" | "simple" | undefined;
     size?: "sm" | "md" | "lg" | "xs" | undefined;
     isRounded?: boolean | "true" | undefined;
@@ -25,9 +25,10 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
         hover: string;
     }, {
         colors: {
-            textForeground: any;
+            textBold: any;
+            textRegular: any;
             textSubtle: any;
-            textPlaceholder: any;
+            textMinimal: any;
             background: any;
             backgroundAccent: any;
             grey100: any;
@@ -174,11 +175,6 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
             alpha200: any;
             alpha250: any;
             alpha600: any;
-            primaryLight: any;
-            primary: any;
-            primaryMid: any;
-            primaryDark: any;
-            secondary: any;
             brandRed: any;
             brandRedAccent: any;
             brandGreen: any;
@@ -187,6 +183,10 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
             brandPurpleAccent: any;
             brandYellow: any;
             brandYellowAccent: any;
+            infoLight: any;
+            info: any;
+            infoMid: any;
+            infoDark: any;
             successLight: any;
             success: any;
             successMid: any;
@@ -210,6 +210,18 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
             glBlueLight: any;
             glBluePrimary: any;
             glBlueDark: any;
+            primary100: any;
+            primary200: any;
+            primary300: any;
+            primary400: any;
+            primary500: any;
+            primary600: any;
+            primary700: any;
+            primary800: any;
+            primary900: any;
+            primary1000: any;
+            primary1100: any;
+            primary1200: any;
         };
         space: {
             "0": any;
@@ -327,7 +339,7 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
         };
     }> | undefined;
 }, "appearance" | "size" | "theme" | "label" | "children" | "as" | "hasTooltip" | "tooltipSide" | "isRounded" | keyof import("../../types").NavigatorActions> & import("@stitches/react/types/styled-component").TransformProps<{
-    theme?: "primary" | "success" | "danger" | "warning" | "neutral" | undefined;
+    theme?: "success" | "danger" | "warning" | "primary" | "neutral" | undefined;
     appearance?: "outline" | "solid" | "simple" | undefined;
     size?: "sm" | "md" | "lg" | "xs" | undefined;
     isRounded?: boolean | "true" | undefined;
@@ -361,9 +373,10 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
     hover: string;
 }, {
     colors: {
-        textForeground: any;
+        textBold: any;
+        textRegular: any;
         textSubtle: any;
-        textPlaceholder: any;
+        textMinimal: any;
         background: any;
         backgroundAccent: any;
         grey100: any;
@@ -510,11 +523,6 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
         alpha200: any;
         alpha250: any;
         alpha600: any;
-        primaryLight: any;
-        primary: any;
-        primaryMid: any;
-        primaryDark: any;
-        secondary: any;
         brandRed: any;
         brandRedAccent: any;
         brandGreen: any;
@@ -523,6 +531,10 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
         brandPurpleAccent: any;
         brandYellow: any;
         brandYellowAccent: any;
+        infoLight: any;
+        info: any;
+        infoMid: any;
+        infoDark: any;
         successLight: any;
         success: any;
         successMid: any;
@@ -546,6 +558,18 @@ declare const StyledActionIcon: import("@stitches/react/types/styled-component")
         glBlueLight: any;
         glBluePrimary: any;
         glBlueDark: any;
+        primary100: any;
+        primary200: any;
+        primary300: any;
+        primary400: any;
+        primary500: any;
+        primary600: any;
+        primary700: any;
+        primary800: any;
+        primary900: any;
+        primary1000: any;
+        primary1100: any;
+        primary1200: any;
     };
     space: {
         "0": any;

package/dist/components/popover/Popover.d.ts

@@ -19,9 +19,10 @@ declare const StyledRoot: import("@stitches/react/types/styled-component").Style
     hover: string;
 }, {
     colors: {
-        textForeground: any;
+        textBold: any;
+        textRegular: any;
         textSubtle: any;
-        textPlaceholder: any;
+        textMinimal: any;
         background: any;
         backgroundAccent: any;
         grey100: any;
@@ -168,11 +169,6 @@ declare const StyledRoot: import("@stitches/react/types/styled-component").Style
         alpha200: any;
         alpha250: any;
         alpha600: any;
-        primaryLight: any;
-        primary: any;
-        primaryMid: any;
-        primaryDark: any;
-        secondary: any;
         brandRed: any;
         brandRedAccent: any;
         brandGreen: any;
@@ -181,6 +177,10 @@ declare const StyledRoot: import("@stitches/react/types/styled-component").Style
         brandPurpleAccent: any;
         brandYellow: any;
         brandYellowAccent: any;
+        infoLight: any;
+        info: any;
+        infoMid: any;
+        infoDark: any;
         successLight: any;
         success: any;
         successMid: any;
@@ -204,6 +204,18 @@ declare const StyledRoot: import("@stitches/react/types/styled-component").Style
         glBlueLight: any;
         glBluePrimary: any;
         glBlueDark: any;
+        primary100: any;
+        primary200: any;
+        primary300: any;
+        primary400: any;
+        primary500: any;
+        primary600: any;
+        primary700: any;
+        primary800: any;
+        primary900: any;
+        primary1000: any;
+        primary1100: any;
+        primary1200: any;
     };
     space: {
         "0": any;

package/dist/components/popover/PopoverContent.d.ts

@@ -20,9 +20,10 @@ declare const StyledContent: import("@stitches/react/types/styled-component").St
     hover: string;
 }, {
     colors: {
-        textForeground: any;
+        textBold: any;
+        textRegular: any;
         textSubtle: any;
-        textPlaceholder: any;
+        textMinimal: any;
         background: any;
         backgroundAccent: any;
         grey100: any;
@@ -169,11 +170,6 @@ declare const StyledContent: import("@stitches/react/types/styled-component").St
         alpha200: any;
         alpha250: any;
         alpha600: any;
-        primaryLight: any;
-        primary: any;
-        primaryMid: any;
-        primaryDark: any;
-        secondary: any;
         brandRed: any;
         brandRedAccent: any;
         brandGreen: any;
@@ -182,6 +178,10 @@ declare const StyledContent: import("@stitches/react/types/styled-component").St
         brandPurpleAccent: any;
         brandYellow: any;
         brandYellowAccent: any;
+        infoLight: any;
+        info: any;
+        infoMid: any;
+        infoDark: any;
         successLight: any;
         success: any;
         successMid: any;
@@ -205,6 +205,18 @@ declare const StyledContent: import("@stitches/react/types/styled-component").St
         glBlueLight: any;
         glBluePrimary: any;
         glBlueDark: any;
+        primary100: any;
+        primary200: any;
+        primary300: any;
+        primary400: any;
+        primary500: any;
+        primary600: any;
+        primary700: any;
+        primary800: any;
+        primary900: any;
+        primary1000: any;
+        primary1100: any;
+        primary1200: any;
     };
     space: {
         "0": any;

package/dist/components/progress-bar/ProgressBar.d.ts

@@ -1,7 +1,7 @@
 import * as Progress from '@radix-ui/react-progress';
 import * as React from 'react';
 declare const StyledProgressBar: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<Progress.ProgressProps & React.RefAttributes<HTMLDivElement>>, {
-    theme?: "primary" | "success" | "danger" | "warning" | undefined;
+    theme?: "info" | "success" | "danger" | "warning" | "primary" | undefined;
 }, {
     sm: string;
     md: string;
@@ -20,9 +20,10 @@ declare const StyledProgressBar: import("@stitches/react/types/styled-component"
     hover: string;
 }, {
     colors: {
-        textForeground: any;
+        textBold: any;
+        textRegular: any;
         textSubtle: any;
-        textPlaceholder: any;
+        textMinimal: any;
         background: any;
         backgroundAccent: any;
         grey100: any;
@@ -169,11 +170,6 @@ declare const StyledProgressBar: import("@stitches/react/types/styled-component"
         alpha200: any;
         alpha250: any;
         alpha600: any;
-        primaryLight: any;
-        primary: any;
-        primaryMid: any;
-        primaryDark: any;
-        secondary: any;
         brandRed: any;
         brandRedAccent: any;
         brandGreen: any;
@@ -182,6 +178,10 @@ declare const StyledProgressBar: import("@stitches/react/types/styled-component"
         brandPurpleAccent: any;
         brandYellow: any;
         brandYellowAccent: any;
+        infoLight: any;
+        info: any;
+        infoMid: any;
+        infoDark: any;
         successLight: any;
         success: any;
         successMid: any;
@@ -205,6 +205,18 @@ declare const StyledProgressBar: import("@stitches/react/types/styled-component"
         glBlueLight: any;
         glBluePrimary: any;
         glBlueDark: any;
+        primary100: any;
+        primary200: any;
+        primary300: any;
+        primary400: any;
+        primary500: any;
+        primary600: any;
+        primary700: any;
+        primary800: any;
+        primary900: any;
+        primary1000: any;
+        primary1100: any;
+        primary1200: any;
     };
     space: {
         "0": any;

package/dist/components/progress-bar/ProgressBar.js

@@ -1,2 +1,2 @@
-import*as e from"@radix-ui/react-progress";import*as a from"react";import{styled as t}from"../../stitches.js";const l=t(e.Root,{borderRadius:"$round",background:"$tonal100",height:"$0",position:"relative",overflow:"hidden",width:"100%",variants:{theme:{primary:{color:"$primary"},success:{color:"$success"},warning:{color:"$warning"},danger:{color:"$danger"}}}}),d=t(e.Indicator,{backgroundColor:"currentcolor",borderRadius:"$round",boxSizing:"border-box",height:"100%",position:"absolute",transition:"all 300ms ease-out"}),s=({value:r,max:o=100,theme:i="primary",...n})=>a.createElement(l,{value:r,max:o,theme:i,...n},a.createElement(d,{style:{width:"100%",transform:`translateX(-${100-(r||0)/o*100}%)`}}));s.displayName="ProgressBar";export{s as ProgressBar};
+import*as e from"@radix-ui/react-progress";import*as a from"react";import{styled as t}from"../../stitches.js";const l=t(e.Root,{borderRadius:"$round",background:"$tonal100",height:"$0",position:"relative",overflow:"hidden",width:"100%",variants:{theme:{primary:{color:"$primary800"},info:{color:"$info"},success:{color:"$success"},warning:{color:"$warning"},danger:{color:"$danger"}}}}),d=t(e.Indicator,{backgroundColor:"currentcolor",borderRadius:"$round",boxSizing:"border-box",height:"100%",position:"absolute",transition:"all 300ms ease-out"}),i=({value:r,max:o=100,theme:n="primary",...s})=>a.createElement(l,{value:r,max:o,theme:n,...s},a.createElement(d,{style:{width:"100%",transform:`translateX(-${100-(r||0)/o*100}%)`}}));i.displayName="ProgressBar";export{i as ProgressBar};
 //# sourceMappingURL=ProgressBar.js.map

package/dist/components/progress-bar/ProgressBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProgressBar.js","sources":["../../../src/components/progress-bar/ProgressBar.tsx"],"sourcesContent":["import * as Progress from '@radix-ui/react-progress'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nconst StyledProgressBar = styled(Progress.Root, {\n  borderRadius: '$round',\n  background: '$tonal100',\n  height: '$0',\n  position: 'relative',\n  overflow: 'hidden',\n  width: '100%',\n  variants: {\n    theme: {\n      primary: { color: '$primary' },\n      success: { color: '$success' },\n      warning: { color: '$warning' },\n      danger: { color: '$danger' }\n    }\n  }\n})\n\nconst StyledIndicator = styled(Progress.Indicator, {\n  backgroundColor: 'currentcolor',\n  borderRadius: '$round',\n  boxSizing: 'border-box',\n  height: '100%',\n  position: 'absolute',\n  transition: 'all 300ms ease-out'\n})\n\ntype ProgressBarProps = React.ComponentPropsWithoutRef<\n  typeof StyledProgressBar\n> &\n  (\n    | { id: string; 'aria-label'?: string }\n    | { 'aria-label': string; id?: string }\n  )\n\nexport const ProgressBar: React.FC<ProgressBarProps> = ({\n  value,\n  max = 100,\n  theme = 'primary',\n  ...remainingProps\n}) => (\n  <StyledProgressBar value={value} max={max} theme={theme} {...remainingProps}>\n    <StyledIndicator\n      style={{\n        width: '100%',\n        transform: `translateX(-${100 - ((value || 0) / max) * 100}%)`\n      }}\n    />\n  </StyledProgressBar>\n)\n\nProgressBar.displayName = 'ProgressBar'\n"],"names":["StyledProgressBar","styled","Progress","StyledIndicator","ProgressBar","value","max","theme","remainingProps","React"],"mappings":"8GAKA,MAAMA,EAAoBC,EAAOC,EAAS,KAAM,CAC9C,aAAc,SACd,WAAY,YACZ,OAAQ,KACR,SAAU,WACV,SAAU,SACV,MAAO,OACP,SAAU,CACR,MAAO,CACL,QAAS,CAAE,MAAO,UAAW,EAC7B,QAAS,CAAE,MAAO,UAAW,EAC7B,QAAS,CAAE,MAAO,UAAW,EAC7B,OAAQ,CAAE,MAAO,SAAU,CAC7B,CACF,CACF,CAAC,EAEKC,EAAkBF,EAAOC,EAAS,UAAW,CACjD,gBAAiB,eACjB,aAAc,SACd,UAAW,aACX,OAAQ,OACR,SAAU,WACV,WAAY,oBACd,CAAC,EAUYE,EAA0C,CAAC,CACtD,MAAAC,EACA,IAAAC,EAAM,IACN,MAAAC,EAAQ,aACLC,CACL,IACEC,EAAA,cAACT,EAAA,CAAkB,MAAOK,EAAO,IAAKC,EAAK,MAAOC,EAAQ,GAAGC,CAC3DC,EAAAA,EAAA,cAACN,EAAA,CACC,MAAO,CACL,MAAO,OACP,UAAW,eAAe,KAAQE,GAAS,GAAKC,EAAO,OACzD,CACF,CAAA,CACF,EAGFF,EAAY,YAAc"}
+{"version":3,"file":"ProgressBar.js","sources":["../../../src/components/progress-bar/ProgressBar.tsx"],"sourcesContent":["import * as Progress from '@radix-ui/react-progress'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\n\nconst StyledProgressBar = styled(Progress.Root, {\n  borderRadius: '$round',\n  background: '$tonal100',\n  height: '$0',\n  position: 'relative',\n  overflow: 'hidden',\n  width: '100%',\n  variants: {\n    theme: {\n      primary: { color: '$primary800' },\n      info: { color: '$info' },\n      success: { color: '$success' },\n      warning: { color: '$warning' },\n      danger: { color: '$danger' }\n    }\n  }\n})\n\nconst StyledIndicator = styled(Progress.Indicator, {\n  backgroundColor: 'currentcolor',\n  borderRadius: '$round',\n  boxSizing: 'border-box',\n  height: '100%',\n  position: 'absolute',\n  transition: 'all 300ms ease-out'\n})\n\ntype ProgressBarProps = React.ComponentPropsWithoutRef<\n  typeof StyledProgressBar\n> &\n  (\n    | { id: string; 'aria-label'?: string }\n    | { 'aria-label': string; id?: string }\n  )\n\nexport const ProgressBar: React.FC<ProgressBarProps> = ({\n  value,\n  max = 100,\n  theme = 'primary',\n  ...remainingProps\n}) => (\n  <StyledProgressBar value={value} max={max} theme={theme} {...remainingProps}>\n    <StyledIndicator\n      style={{\n        width: '100%',\n        transform: `translateX(-${100 - ((value || 0) / max) * 100}%)`\n      }}\n    />\n  </StyledProgressBar>\n)\n\nProgressBar.displayName = 'ProgressBar'\n"],"names":["StyledProgressBar","styled","Progress","StyledIndicator","ProgressBar","value","max","theme","remainingProps","React"],"mappings":"8GAKA,MAAMA,EAAoBC,EAAOC,EAAS,KAAM,CAC9C,aAAc,SACd,WAAY,YACZ,OAAQ,KACR,SAAU,WACV,SAAU,SACV,MAAO,OACP,SAAU,CACR,MAAO,CACL,QAAS,CAAE,MAAO,aAAc,EAChC,KAAM,CAAE,MAAO,OAAQ,EACvB,QAAS,CAAE,MAAO,UAAW,EAC7B,QAAS,CAAE,MAAO,UAAW,EAC7B,OAAQ,CAAE,MAAO,SAAU,CAC7B,CACF,CACF,CAAC,EAEKC,EAAkBF,EAAOC,EAAS,UAAW,CACjD,gBAAiB,eACjB,aAAc,SACd,UAAW,aACX,OAAQ,OACR,SAAU,WACV,WAAY,oBACd,CAAC,EAUYE,EAA0C,CAAC,CACtD,MAAAC,EACA,IAAAC,EAAM,IACN,MAAAC,EAAQ,aACLC,CACL,IACEC,EAAA,cAACT,EAAA,CAAkB,MAAOK,EAAO,IAAKC,EAAK,MAAOC,EAAQ,GAAGC,CAC3DC,EAAAA,EAAA,cAACN,EAAA,CACC,MAAO,CACL,MAAO,OACP,UAAW,eAAe,KAAQE,GAAS,GAAKC,EAAO,OACzD,CACF,CAAA,CACF,EAGFF,EAAY,YAAc"}

package/dist/components/radio-button/RadioButton.d.ts

@@ -21,9 +21,10 @@ declare const StyledRadioButton: import("@stitches/react/types/styled-component"
     hover: string;
 }, {
     colors: {
-        textForeground: any;
+        textBold: any;
+        textRegular: any;
         textSubtle: any;
-        textPlaceholder: any;
+        textMinimal: any;
         background: any;
         backgroundAccent: any;
         grey100: any;
@@ -170,11 +171,6 @@ declare const StyledRadioButton: import("@stitches/react/types/styled-component"
         alpha200: any;
         alpha250: any;
         alpha600: any;
-        primaryLight: any;
-        primary: any;
-        primaryMid: any;
-        primaryDark: any;
-        secondary: any;
         brandRed: any;
         brandRedAccent: any;
         brandGreen: any;
@@ -183,6 +179,10 @@ declare const StyledRadioButton: import("@stitches/react/types/styled-component"
         brandPurpleAccent: any;
         brandYellow: any;
         brandYellowAccent: any;
+        infoLight: any;
+        info: any;
+        infoMid: any;
+        infoDark: any;
         successLight: any;
         success: any;
         successMid: any;
@@ -206,6 +206,18 @@ declare const StyledRadioButton: import("@stitches/react/types/styled-component"
         glBlueLight: any;
         glBluePrimary: any;
         glBlueDark: any;
+        primary100: any;
+        primary200: any;
+        primary300: any;
+        primary400: any;
+        primary500: any;
+        primary600: any;
+        primary700: any;
+        primary800: any;
+        primary900: any;
+        primary1000: any;
+        primary1100: any;
+        primary1200: any;
     };
     space: {
         "0": any;

package/dist/components/radio-button/RadioButton.js

@@ -1,2 +1,2 @@
-import*as r from"@radix-ui/react-radio-group";import*as e from"react";import{styled as t}from"../../stitches.js";const n=t(r.Item,{alignItems:"center",appearance:"none",backgroundColor:"transparent",border:"1px solid $tonal400",borderRadius:"$round",color:"white",cursor:"pointer",display:"flex",justifyContent:"center",p:0,size:"$1",variants:{size:{md:{size:"$1"},lg:{size:"$2",mt:"-$1"}}},transition:"all 50ms ease-out","&:focus":{outline:"2px solid $primary",outlineOffset:"1px"},'&[data-state="checked"]':{backgroundColor:"$primary",borderColor:"$primary"},"&[disabled]":{backgroundColor:"$tonal100",borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"}}),s=t(r.Indicator,{size:"6px",borderRadius:"$round",backgroundColor:"currentcolor",position:"absolute",variants:{size:{md:{size:"6px"},lg:{size:"12px"}}}}),a=({size:o,...i})=>e.createElement(n,{...i,size:o},e.createElement(s,{size:o}));a.displayName="RadioButton";export{a as RadioButton};
+import*as r from"@radix-ui/react-radio-group";import*as e from"react";import{styled as t}from"../../stitches.js";const n=t(r.Item,{alignItems:"center",appearance:"none",backgroundColor:"transparent",border:"1px solid $tonal400",borderRadius:"$round",color:"white",cursor:"pointer",display:"flex",justifyContent:"center",p:0,size:"$1",variants:{size:{md:{size:"$1"},lg:{size:"$2",mt:"-$1"}}},transition:"all 50ms ease-out","&:focus":{outline:"2px solid $primary800",outlineOffset:"1px"},'&[data-state="checked"]':{backgroundColor:"$primary800",borderColor:"$primary800"},"&[disabled]":{backgroundColor:"$tonal100",borderColor:"$tonal400",color:"$tonal400",cursor:"not-allowed"}}),s=t(r.Indicator,{size:"6px",borderRadius:"$round",backgroundColor:"currentcolor",position:"absolute",variants:{size:{md:{size:"6px"},lg:{size:"12px"}}}}),a=({size:o,...i})=>e.createElement(n,{...i,size:o},e.createElement(s,{size:o}));a.displayName="RadioButton";export{a as RadioButton};
 //# sourceMappingURL=RadioButton.js.map

package/dist/components/radio-button/RadioButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"RadioButton.js","sources":["../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { Override } from '~/utilities/types'\n\nconst StyledRadioButton = styled(RadioGroup.Item, {\n  alignItems: 'center',\n  appearance: 'none',\n  backgroundColor: 'transparent',\n  border: '1px solid $tonal400',\n  borderRadius: '$round',\n  color: 'white',\n  cursor: 'pointer',\n  display: 'flex',\n  justifyContent: 'center',\n  p: 0,\n  size: '$1',\n  variants: {\n    size: {\n      md: {\n        size: '$1'\n      },\n      lg: {\n        size: '$2',\n        mt: '-$1'\n      }\n    }\n  },\n  transition: 'all 50ms ease-out',\n  '&:focus': {\n    outline: '2px solid $primary',\n    outlineOffset: '1px'\n  },\n  '&[data-state=\"checked\"]': {\n    backgroundColor: '$primary',\n    borderColor: '$primary'\n  },\n  '&[disabled]': {\n    backgroundColor: '$tonal100',\n    borderColor: '$tonal400',\n    color: '$tonal400',\n    cursor: 'not-allowed'\n  }\n})\n\nconst StyledIndicator = styled(RadioGroup.Indicator, {\n  size: '6px',\n  borderRadius: '$round',\n  backgroundColor: 'currentcolor',\n  position: 'absolute',\n  variants: {\n    size: {\n      md: {\n        size: '6px'\n      },\n      lg: {\n        size: '12px'\n      }\n    }\n  }\n})\n\ntype RadioButtonProps = Override<\n  React.ComponentPropsWithoutRef<typeof StyledRadioButton>,\n  {\n    as?: never\n  } & {\n    'aria-label'?: string\n  }\n>\n\nexport const RadioButton: React.FC<RadioButtonProps> = ({ size, ...props }) => {\n  return (\n    <StyledRadioButton {...props} size={size}>\n      <StyledIndicator size={size} />\n    </StyledRadioButton>\n  )\n}\n\nRadioButton.displayName = 'RadioButton'\n"],"names":["StyledRadioButton","styled","RadioGroup","StyledIndicator","RadioButton","size","props","React"],"mappings":"iHAMA,MAAMA,EAAoBC,EAAOC,EAAW,KAAM,CAChD,WAAY,SACZ,WAAY,OACZ,gBAAiB,cACjB,OAAQ,sBACR,aAAc,SACd,MAAO,QACP,OAAQ,UACR,QAAS,OACT,eAAgB,SAChB,EAAG,EACH,KAAM,KACN,SAAU,CACR,KAAM,CACJ,GAAI,CACF,KAAM,IACR,EACA,GAAI,CACF,KAAM,KACN,GAAI,KACN,CACF,CACF,EACA,WAAY,oBACZ,UAAW,CACT,QAAS,qBACT,cAAe,KACjB,EACA,0BAA2B,CACzB,gBAAiB,WACjB,YAAa,UACf,EACA,cAAe,CACb,gBAAiB,YACjB,YAAa,YACb,MAAO,YACP,OAAQ,aACV,CACF,CAAC,EAEKC,EAAkBF,EAAOC,EAAW,UAAW,CACnD,KAAM,MACN,aAAc,SACd,gBAAiB,eACjB,SAAU,WACV,SAAU,CACR,KAAM,CACJ,GAAI,CACF,KAAM,KACR,EACA,GAAI,CACF,KAAM,MACR,CACF,CACF,CACF,CAAC,EAWYE,EAA0C,CAAC,CAAE,KAAAC,KAASC,CAAM,IAErEC,EAAA,cAACP,EAAA,CAAmB,GAAGM,EAAO,KAAMD,GAClCE,EAAA,cAACJ,EAAA,CAAgB,KAAME,CAAAA,CAAM,CAC/B,EAIJD,EAAY,YAAc"}
+{"version":3,"file":"RadioButton.js","sources":["../../../src/components/radio-button/RadioButton.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport { styled } from '~/stitches'\nimport { Override } from '~/utilities/types'\n\nconst StyledRadioButton = styled(RadioGroup.Item, {\n  alignItems: 'center',\n  appearance: 'none',\n  backgroundColor: 'transparent',\n  border: '1px solid $tonal400',\n  borderRadius: '$round',\n  color: 'white',\n  cursor: 'pointer',\n  display: 'flex',\n  justifyContent: 'center',\n  p: 0,\n  size: '$1',\n  variants: {\n    size: {\n      md: {\n        size: '$1'\n      },\n      lg: {\n        size: '$2',\n        mt: '-$1'\n      }\n    }\n  },\n  transition: 'all 50ms ease-out',\n  '&:focus': {\n    outline: '2px solid $primary800',\n    outlineOffset: '1px'\n  },\n  '&[data-state=\"checked\"]': {\n    backgroundColor: '$primary800',\n    borderColor: '$primary800'\n  },\n  '&[disabled]': {\n    backgroundColor: '$tonal100',\n    borderColor: '$tonal400',\n    color: '$tonal400',\n    cursor: 'not-allowed'\n  }\n})\n\nconst StyledIndicator = styled(RadioGroup.Indicator, {\n  size: '6px',\n  borderRadius: '$round',\n  backgroundColor: 'currentcolor',\n  position: 'absolute',\n  variants: {\n    size: {\n      md: {\n        size: '6px'\n      },\n      lg: {\n        size: '12px'\n      }\n    }\n  }\n})\n\ntype RadioButtonProps = Override<\n  React.ComponentPropsWithoutRef<typeof StyledRadioButton>,\n  {\n    as?: never\n  } & {\n    'aria-label'?: string\n  }\n>\n\nexport const RadioButton: React.FC<RadioButtonProps> = ({ size, ...props }) => {\n  return (\n    <StyledRadioButton {...props} size={size}>\n      <StyledIndicator size={size} />\n    </StyledRadioButton>\n  )\n}\n\nRadioButton.displayName = 'RadioButton'\n"],"names":["StyledRadioButton","styled","RadioGroup","StyledIndicator","RadioButton","size","props","React"],"mappings":"iHAMA,MAAMA,EAAoBC,EAAOC,EAAW,KAAM,CAChD,WAAY,SACZ,WAAY,OACZ,gBAAiB,cACjB,OAAQ,sBACR,aAAc,SACd,MAAO,QACP,OAAQ,UACR,QAAS,OACT,eAAgB,SAChB,EAAG,EACH,KAAM,KACN,SAAU,CACR,KAAM,CACJ,GAAI,CACF,KAAM,IACR,EACA,GAAI,CACF,KAAM,KACN,GAAI,KACN,CACF,CACF,EACA,WAAY,oBACZ,UAAW,CACT,QAAS,wBACT,cAAe,KACjB,EACA,0BAA2B,CACzB,gBAAiB,cACjB,YAAa,aACf,EACA,cAAe,CACb,gBAAiB,YACjB,YAAa,YACb,MAAO,YACP,OAAQ,aACV,CACF,CAAC,EAEKC,EAAkBF,EAAOC,EAAW,UAAW,CACnD,KAAM,MACN,aAAc,SACd,gBAAiB,eACjB,SAAU,WACV,SAAU,CACR,KAAM,CACJ,GAAI,CACF,KAAM,KACR,EACA,GAAI,CACF,KAAM,MACR,CACF,CACF,CACF,CAAC,EAWYE,EAA0C,CAAC,CAAE,KAAAC,KAASC,CAAM,IAErEC,EAAA,cAACP,EAAA,CAAmB,GAAGM,EAAO,KAAMD,GAClCE,EAAA,cAACJ,EAAA,CAAgB,KAAME,CAAAA,CAAM,CAC/B,EAIJD,EAAY,YAAc"}

package/dist/components/radio-button/RadioButtonGroup.d.ts

@@ -20,9 +20,10 @@ export declare const RadioButtonGroup: import("@stitches/react/types/styled-comp
     hover: string;
 }, {
     colors: {
-        textForeground: any;
+        textBold: any;
+        textRegular: any;
         textSubtle: any;
-        textPlaceholder: any;
+        textMinimal: any;
         background: any;
         backgroundAccent: any;
         grey100: any;
@@ -169,11 +170,6 @@ export declare const RadioButtonGroup: import("@stitches/react/types/styled-comp
         alpha200: any;
         alpha250: any;
         alpha600: any;
-        primaryLight: any;
-        primary: any;
-        primaryMid: any;
-        primaryDark: any;
-        secondary: any;
         brandRed: any;
         brandRedAccent: any;
         brandGreen: any;
@@ -182,6 +178,10 @@ export declare const RadioButtonGroup: import("@stitches/react/types/styled-comp
         brandPurpleAccent: any;
         brandYellow: any;
         brandYellowAccent: any;
+        infoLight: any;
+        info: any;
+        infoMid: any;
+        infoDark: any;
         successLight: any;
         success: any;
         successMid: any;
@@ -205,6 +205,18 @@ export declare const RadioButtonGroup: import("@stitches/react/types/styled-comp
         glBlueLight: any;
         glBluePrimary: any;
         glBlueDark: any;
+        primary100: any;
+        primary200: any;
+        primary300: any;
+        primary400: any;
+        primary500: any;
+        primary600: any;
+        primary700: any;
+        primary800: any;
+        primary900: any;
+        primary1000: any;
+        primary1100: any;
+        primary1200: any;
     };
     space: {
         "0": any;

package/dist/components/radio-card/RadioCard.d.ts

@@ -22,9 +22,10 @@ export declare const StyledRadioCard: import("@stitches/react/types/styled-compo
     hover: string;
 }, {
     colors: {
-        textForeground: any;
+        textBold: any;
+        textRegular: any;
         textSubtle: any;
-        textPlaceholder: any;
+        textMinimal: any;
         background: any;
         backgroundAccent: any;
         grey100: any;
@@ -171,11 +172,6 @@ export declare const StyledRadioCard: import("@stitches/react/types/styled-compo
         alpha200: any;
         alpha250: any;
         alpha600: any;
-        primaryLight: any;
-        primary: any;
-        primaryMid: any;
-        primaryDark: any;
-        secondary: any;
         brandRed: any;
         brandRedAccent: any;
         brandGreen: any;
@@ -184,6 +180,10 @@ export declare const StyledRadioCard: import("@stitches/react/types/styled-compo
         brandPurpleAccent: any;
         brandYellow: any;
         brandYellowAccent: any;
+        infoLight: any;
+        info: any;
+        infoMid: any;
+        infoDark: any;
         successLight: any;
         success: any;
         successMid: any;
@@ -207,6 +207,18 @@ export declare const StyledRadioCard: import("@stitches/react/types/styled-compo
         glBlueLight: any;
         glBluePrimary: any;
         glBlueDark: any;
+        primary100: any;
+        primary200: any;
+        primary300: any;
+        primary400: any;
+        primary500: any;
+        primary600: any;
+        primary700: any;
+        primary800: any;
+        primary900: any;
+        primary1000: any;
+        primary1100: any;
+        primary1200: any;
     };
     space: {
         "0": any;

package/dist/components/radio-card/RadioCard.js

@@ -1,2 +1,2 @@
-import*as l from"@radix-ui/react-radio-group";import*as e from"react";import{styled as t}from"../../stitches.js";import{Box as d}from"../box/Box.js";const o=t(l.Item,{alignItems:"center",bg:"white",border:"1px solid $tonal200",borderRadius:"$0",cursor:"pointer",display:"flex",textAlign:"left",'&[data-state="checked"]':{outline:"2px solid $primary",outlineOffset:"-2px"},variants:{align:{left:{flexDirection:"row"},right:{flexDirection:"row-reverse"}},size:{md:{px:"$4",py:"$3"},lg:{px:"$5",py:"$4"}},isFullWidth:{true:{width:"100%"},false:{width:"max-content"}}}}),c=t("div",{alignItems:"center",appearance:"none",backgroundColor:"transparent",border:"1px solid $tonal500",borderRadius:"$round",display:"flex",flexShrink:0,justifyContent:"center",p:0,size:"$1",transition:"all 50ms ease-out",'[data-state="checked"] &':{backgroundColor:"$primary",borderColor:"$primary"},variants:{containerIsFullWidth:{true:{},false:{}},align:{left:{mr:"$4"},right:{}}},compoundVariants:[{containerIsFullWidth:!0,align:"right",css:{ml:"auto"}},{containerIsFullWidth:!1,align:"right",css:{ml:"$4"}}]}),p=t(l.Indicator,{backgroundColor:"white",borderRadius:"$round",position:"absolute",size:"6px"}),u=({children:a,isFullWidth:r=!1,size:n="md",align:i="left",...s})=>e.createElement(o,{...s,align:i,isFullWidth:r,size:n},e.createElement(c,{align:i,containerIsFullWidth:r},e.createElement(p,null)),e.createElement(d,null,a));export{u as RadioCard,o as StyledRadioCard};
+import*as l from"@radix-ui/react-radio-group";import*as e from"react";import{styled as t}from"../../stitches.js";import{Box as d}from"../box/Box.js";const o=t(l.Item,{alignItems:"center",bg:"white",border:"1px solid $tonal200",borderRadius:"$0",cursor:"pointer",display:"flex",textAlign:"left",'&[data-state="checked"]':{outline:"2px solid $primary800",outlineOffset:"-2px"},variants:{align:{left:{flexDirection:"row"},right:{flexDirection:"row-reverse"}},size:{md:{px:"$4",py:"$3"},lg:{px:"$5",py:"$4"}},isFullWidth:{true:{width:"100%"},false:{width:"max-content"}}}}),c=t("div",{alignItems:"center",appearance:"none",backgroundColor:"transparent",border:"1px solid $tonal500",borderRadius:"$round",display:"flex",flexShrink:0,justifyContent:"center",p:0,size:"$1",transition:"all 50ms ease-out",'[data-state="checked"] &':{backgroundColor:"$primary800",borderColor:"$primary800"},variants:{containerIsFullWidth:{true:{},false:{}},align:{left:{mr:"$4"},right:{}}},compoundVariants:[{containerIsFullWidth:!0,align:"right",css:{ml:"auto"}},{containerIsFullWidth:!1,align:"right",css:{ml:"$4"}}]}),p=t(l.Indicator,{backgroundColor:"white",borderRadius:"$round",position:"absolute",size:"6px"}),u=({children:a,isFullWidth:r=!1,size:n="md",align:i="left",...s})=>e.createElement(o,{...s,align:i,isFullWidth:r,size:n},e.createElement(c,{align:i,containerIsFullWidth:r},e.createElement(p,null)),e.createElement(d,null,a));export{u as RadioCard,o as StyledRadioCard};
 //# sourceMappingURL=RadioCard.js.map