npm - @atom-learning/components - Versions diffs - 6.5.4 → 6.6.0-beta.1 - Mend

@atom-learning/components 6.5.4 → 6.6.0-beta.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 (72) hide show

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

@@ -3,33 +3,7 @@ import * as t from "react";
 import * as n from "@radix-ui/react-radio-group";
 //#region src/components/radio-button/RadioButton.tsx
 var r = e(n.Item, {
-	base: [
-		"items-center",
-		"appearance-none",
-		"border",
-		"border-grey-800",
-		"rounded-full",
-		"text-white",
-		"cursor-pointer",
-		"flex",
-		"justify-center",
-		"size-4",
-		"transition-all",
-		"duration-50",
-		"ease-out",
-		"focus:outline-2",
-		"focus:outline-offset-1",
-		"focus:outline-primary-800",
-		"focus:outline-solid",
-		"data-[state=checked]:bg-primary-800",
-		"data-[state=checked]:border-primary-800",
-		"disabled:bg-grey-200",
-		"disabled:border-grey-800",
-		"disabled:cursor-not-allowed",
-		"disabled:text-grey-800",
-		"disabled:data-[state=checked]:bg-grey-800",
-		"disabled:data-[state=checked]:border-grey-800"
-	],
+	base: /* @__PURE__ */ "items-center.appearance-none.bg-transparent.border.border-grey-800.rounded-full.text-white.cursor-pointer.flex.justify-center.p-0.size-4.transition-all.duration-50.ease-out.focus:outline-2.focus:outline-offset-1.focus:outline-primary-800.focus:outline-solid.data-[state=checked]:bg-primary-800.data-[state=checked]:border-primary-800.disabled:bg-grey-200.disabled:border-grey-800.disabled:cursor-not-allowed.disabled:text-grey-800.disabled:data-[state=checked]:bg-grey-800.disabled:data-[state=checked]:border-grey-800".split("."),
 	variants: { size: {
 		md: ["size-4"],
 		lg: ["-mt-1", "size-6"]

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

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioButton.js","names":[],"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 '~/styled'\nimport { Override } from '~/utilities/types'\n\nconst StyledRadioButton = styled(\n RadioGroup.Item,\n {\n base: [\n 'items-center',\n 'appearance-none',\n 'border',\n 'border-grey-800',\n 'rounded-full',\n 'text-white',\n 'cursor-pointer',\n 'flex',\n 'justify-center',\n 'size-4',\n 'transition-all',\n 'duration-50',\n 'ease-out',\n 'focus:outline-2',\n 'focus:outline-offset-1',\n 'focus:outline-primary-800',\n 'focus:outline-solid',\n 'data-[state=checked]:bg-primary-800',\n 'data-[state=checked]:border-primary-800',\n 'disabled:bg-grey-200',\n 'disabled:border-grey-800',\n 'disabled:cursor-not-allowed',\n 'disabled:text-grey-800',\n 'disabled:data-[state=checked]:bg-grey-800',\n 'disabled:data-[state=checked]:border-grey-800'\n ],\n variants: {\n size: {\n md: ['size-4'],\n lg: ['-mt-1', 'size-6']\n }\n }\n },\n { enabledResponsiveVariants: true }\n)\n\nconst StyledIndicator = styled(\n RadioGroup.Indicator,\n {\n base: ['size-1.5', 'rounded-full', 'bg-current', 'absolute'],\n variants: {\n size: {\n md: ['size-1.5'],\n lg: ['size-3']\n }\n }\n },\n { enabledResponsiveVariants: true }\n)\n\ntype RadioButtonProps = Override<\n React.ComponentProps<typeof StyledRadioButton>,\n {\n as?: never\n } & {\n 'aria-label'?: string\n }\n>\n\nexport const RadioButton = ({ size, ...props }: RadioButtonProps) => {\n return (\n <StyledRadioButton {...props} size={size}>\n <StyledIndicator size={size} />\n </StyledRadioButton>\n )\n}\n\nRadioButton.displayName = 'RadioButton'\n"],"mappings":";;;;AAMA,IAAM,IAAoB,EACxB,EAAW,MACX;CACE,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;EACD;~~CACD,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,SAAS;EACd,IAAI,CAAC,SAAS,SAAS;EACxB,EACF;CACF,EACD,EAAE,2BAA2B,IAAM,CACpC,EAEK,IAAkB,EACtB,EAAW,WACX;CACE,MAAM;EAAC;EAAY;EAAgB;EAAc;EAAW;CAC5D,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,WAAW;EAChB,IAAI,CAAC,SAAS;EACf,EACF;CACF,EACD,EAAE,2BAA2B,IAAM,CACpC,EAWY,KAAe,EAAE,SAAM,GAAG,QAEnC,kBAAA,cAAC,GAAD;CAAmB,GAAI;CAAa;CAEhB,EADlB,kBAAA,cAAC,GAAD,EAAuB,SAAQ,CAAA,CACb;AAIxB,EAAY,cAAc"}
1	+ {"version":3,"file":"RadioButton.js","names":[],"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 '~/styled'\nimport { Override } from '~/utilities/types'\n\nconst StyledRadioButton = styled(\n RadioGroup.Item,\n {\n base: [\n 'items-center',\n 'appearance-none',\n 'bg-transparent',\n 'border',\n 'border-grey-800',\n 'rounded-full',\n 'text-white',\n 'cursor-pointer',\n 'flex',\n 'justify-center',\n 'p-0',\n 'size-4',\n 'transition-all',\n 'duration-50',\n 'ease-out',\n 'focus:outline-2',\n 'focus:outline-offset-1',\n 'focus:outline-primary-800',\n 'focus:outline-solid',\n 'data-[state=checked]:bg-primary-800',\n 'data-[state=checked]:border-primary-800',\n 'disabled:bg-grey-200',\n 'disabled:border-grey-800',\n 'disabled:cursor-not-allowed',\n 'disabled:text-grey-800',\n 'disabled:data-[state=checked]:bg-grey-800',\n 'disabled:data-[state=checked]:border-grey-800'\n ],\n variants: {\n size: {\n md: ['size-4'],\n lg: ['-mt-1', 'size-6']\n }\n }\n },\n { enabledResponsiveVariants: true }\n)\n\nconst StyledIndicator = styled(\n RadioGroup.Indicator,\n {\n base: ['size-1.5', 'rounded-full', 'bg-current', 'absolute'],\n variants: {\n size: {\n md: ['size-1.5'],\n lg: ['size-3']\n }\n }\n },\n { enabledResponsiveVariants: true }\n)\n\ntype RadioButtonProps = Override<\n React.ComponentProps<typeof StyledRadioButton>,\n {\n as?: never\n } & {\n 'aria-label'?: string\n }\n>\n\nexport const RadioButton = ({ size, ...props }: RadioButtonProps) => {\n return (\n <StyledRadioButton {...props} size={size}>\n <StyledIndicator size={size} />\n </StyledRadioButton>\n )\n}\n\nRadioButton.displayName = 'RadioButton'\n"],"mappings":";;;;AAMA,IAAM,IAAoB,EACxB,EAAW,MACX;CACE,MAAM,miBA4BL;CACD,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,SAAS;EACd,IAAI,CAAC,SAAS,SAAS;EACxB,EACF;CACF,EACD,EAAE,2BAA2B,IAAM,CACpC,EAEK,IAAkB,EACtB,EAAW,WACX;CACE,MAAM;EAAC;EAAY;EAAgB;EAAc;EAAW;CAC5D,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,WAAW;EAChB,IAAI,CAAC,SAAS;EACf,EACF;CACF,EACD,EAAE,2BAA2B,IAAM,CACpC,EAWY,KAAe,EAAE,SAAM,GAAG,QAEnC,kBAAA,cAAC,GAAD;CAAmB,GAAI;CAAa;CAEhB,EADlB,kBAAA,cAAC,GAAD,EAAuB,SAAQ,CAAA,CACb;AAIxB,EAAY,cAAc"}

package/dist/components/radio-button-field/RadioButtonField.js CHANGED Viewed

@@ -8,7 +8,12 @@ import { RadioField as o } from "./RadioField.js";
 import * as s from "react";
 import { useController as c, useFormContext as l } from "react-hook-form";
 //#region src/components/radio-button-field/RadioButtonField.tsx
-var u = e("fieldset", { base: ["min-w-0"] }), d = ({ children: e, className: o, direction: d = "column", defaultValue: f, value: p, description: m, label: h, name: g, validation: _, onValueChange: v, ...y }) => {
+var u = e("fieldset", { base: [
+	"border-0",
+	"p-0",
+	"m-0",
+	"min-w-0"
+] }), d = ({ children: e, className: o, direction: d = "column", defaultValue: f, value: p, description: m, label: h, name: g, validation: _, onValueChange: v, ...y }) => {
 	let { control: b } = l(), { field: { ref: x, onChange: S, value: C } } = c({
 		name: g,
 		control: b,

package/dist/components/radio-button-field/RadioButtonField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioButtonField.js","names":[],"sources":["../../../src/components/radio-button-field/RadioButtonField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { Description as FieldDescription } from '~/components/field-wrapper/FieldDescription'\nimport { FieldElementWrapperProps } from '~/components/field-wrapper/FieldWrapper'\nimport { useFieldError } from '~/components/form/useFieldError'\nimport { InlineMessage } from '~/components/inline-message/InlineMessage'\nimport { Label } from '~/components/label/Label'\nimport { RadioButtonGroup } from '~/components/radio-button/RadioButtonGroup'\nimport { styled } from '~/styled'\n\nimport { RadioField } from './RadioField'\n\nconst Fieldset = styled('fieldset', {\n base: ['min-w-0']\n})\n\ntype RadioButtonFieldProps = React.ComponentProps<typeof RadioButtonGroup> &\n FieldElementWrapperProps\n\nconst RadioButtonFieldComponent = ({\n children,\n className,\n direction = 'column',\n defaultValue,\n value,\n description,\n label,\n name,\n validation,\n onValueChange,\n ...remainingProps\n}: RadioButtonFieldProps) => {\n const { control } = useFormContext()\n const {\n field: { ref, onChange, value: innerValue }\n } = useController({\n name,\n control,\n rules: validation,\n defaultValue\n })\n const { error } = useFieldError(name)\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 <Fieldset className={className}>\n <Label\n as=\"legend\"\n required={Boolean(validation?.required)}\n className=\"mb-3 p-0\"\n >\n {label}\n </Label>\n {description && (\n <FieldDescription className=\"mb-3\">{description}</FieldDescription>\n )}\n\n <RadioButtonGroup\n ref={ref}\n direction={direction}\n defaultValue={defaultValue}\n onValueChange={(newValue) => {\n onChange(newValue)\n onValueChange?.(newValue)\n }}\n value={innerValue}\n {...remainingProps}\n >\n {children}\n </RadioButtonGroup>\n\n {error && <InlineMessage className=\"mt-2\">{error}</InlineMessage>}\n </Fieldset>\n )\n}\n\nexport const RadioButtonField = Object.assign(RadioButtonFieldComponent, {\n Item: RadioField\n})\n\nRadioButtonFieldComponent.displayName = 'RadioButtonField'\n"],"mappings":";;;;;;;;;;AAaA,IAAM,IAAW,EAAO,YAAY,EAClC,MAAM,CAAC,~~UAAU~~,~~EAClB,~~CAAC,EAKI,KAA6B,EACjC,aACA,cACA,eAAY,UACZ,iBACA,UACA,gBACA,UACA,SACA,eACA,kBACA,GAAG,QACwB;CAC3B,IAAM,EAAE,eAAY,GAAgB,EAC9B,EACJ,OAAO,EAAE,QAAK,aAAU,OAAO,QAC7B,EAAc;EAChB;EACA;EACA,OAAO;EACP;EACD,CAAC,EACI,EAAE,aAAU,EAAc,EAAK;AAOrC,QALA,EAAM,gBAAgB;AAEpB,EAAW,MAAU,UAAa,EAAS,EAAM;IAChD,CAAC,EAAM,CAAC,EAGT,kBAAA,cAAC,GAAD,EAAqB,cA2BV,EA1BT,kBAAA,cAAC,GAAD;EACE,IAAG;EACH,UAAU,EAAQ,GAAY;EAC9B,WAAU;EAGJ,EADL,EACK,EACP,KACC,kBAAA,cAAC,GAAD,EAAkB,WAAU,QAAuC,EAA/B,EAA+B,EAGrE,kBAAA,cAAC,GAAD;EACO;EACM;EACG;EACd,gBAAgB,MAAa;AAE3B,GADA,EAAS,EAAS,EAClB,IAAgB,EAAS;;EAE3B,OAAO;EACP,GAAI;EAGa,EADhB,EACgB,EAElB,KAAS,kBAAA,cAAC,GAAD,EAAe,WAAU,QAA8B,EAAtB,EAAsB,CACxD;GAIF,IAAmB,OAAO,OAAO,GAA2B,EACvE,MAAM,GACP,CAAC;AAEF,EAA0B,cAAc"}
1	+ {"version":3,"file":"RadioButtonField.js","names":[],"sources":["../../../src/components/radio-button-field/RadioButtonField.tsx"],"sourcesContent":["import * as React from 'react'\nimport { useController, useFormContext } from 'react-hook-form'\n\nimport { Description as FieldDescription } from '~/components/field-wrapper/FieldDescription'\nimport { FieldElementWrapperProps } from '~/components/field-wrapper/FieldWrapper'\nimport { useFieldError } from '~/components/form/useFieldError'\nimport { InlineMessage } from '~/components/inline-message/InlineMessage'\nimport { Label } from '~/components/label/Label'\nimport { RadioButtonGroup } from '~/components/radio-button/RadioButtonGroup'\nimport { styled } from '~/styled'\n\nimport { RadioField } from './RadioField'\n\nconst Fieldset = styled('fieldset', {\n base: ['border-0', 'p-0', 'm-0', 'min-w-0']\n})\n\ntype RadioButtonFieldProps = React.ComponentProps<typeof RadioButtonGroup> &\n FieldElementWrapperProps\n\nconst RadioButtonFieldComponent = ({\n children,\n className,\n direction = 'column',\n defaultValue,\n value,\n description,\n label,\n name,\n validation,\n onValueChange,\n ...remainingProps\n}: RadioButtonFieldProps) => {\n const { control } = useFormContext()\n const {\n field: { ref, onChange, value: innerValue }\n } = useController({\n name,\n control,\n rules: validation,\n defaultValue\n })\n const { error } = useFieldError(name)\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 <Fieldset className={className}>\n <Label\n as=\"legend\"\n required={Boolean(validation?.required)}\n className=\"mb-3 p-0\"\n >\n {label}\n </Label>\n {description && (\n <FieldDescription className=\"mb-3\">{description}</FieldDescription>\n )}\n\n <RadioButtonGroup\n ref={ref}\n direction={direction}\n defaultValue={defaultValue}\n onValueChange={(newValue) => {\n onChange(newValue)\n onValueChange?.(newValue)\n }}\n value={innerValue}\n {...remainingProps}\n >\n {children}\n </RadioButtonGroup>\n\n {error && <InlineMessage className=\"mt-2\">{error}</InlineMessage>}\n </Fieldset>\n )\n}\n\nexport const RadioButtonField = Object.assign(RadioButtonFieldComponent, {\n Item: RadioField\n})\n\nRadioButtonFieldComponent.displayName = 'RadioButtonField'\n"],"mappings":";;;;;;;;;;AAaA,IAAM,IAAW,EAAO,YAAY,EAClC,MAAM;CAAC;CAAY;CAAO;CAAO;CAAU,EAC5C,CAAC,EAKI,KAA6B,EACjC,aACA,cACA,eAAY,UACZ,iBACA,UACA,gBACA,UACA,SACA,eACA,kBACA,GAAG,QACwB;CAC3B,IAAM,EAAE,eAAY,GAAgB,EAC9B,EACJ,OAAO,EAAE,QAAK,aAAU,OAAO,QAC7B,EAAc;EAChB;EACA;EACA,OAAO;EACP;EACD,CAAC,EACI,EAAE,aAAU,EAAc,EAAK;AAOrC,QALA,EAAM,gBAAgB;AAEpB,EAAW,MAAU,UAAa,EAAS,EAAM;IAChD,CAAC,EAAM,CAAC,EAGT,kBAAA,cAAC,GAAD,EAAqB,cA2BV,EA1BT,kBAAA,cAAC,GAAD;EACE,IAAG;EACH,UAAU,EAAQ,GAAY;EAC9B,WAAU;EAGJ,EADL,EACK,EACP,KACC,kBAAA,cAAC,GAAD,EAAkB,WAAU,QAAuC,EAA/B,EAA+B,EAGrE,kBAAA,cAAC,GAAD;EACO;EACM;EACG;EACd,gBAAgB,MAAa;AAE3B,GADA,EAAS,EAAS,EAClB,IAAgB,EAAS;;EAE3B,OAAO;EACP,GAAI;EAGa,EADhB,EACgB,EAElB,KAAS,kBAAA,cAAC,GAAD,EAAe,WAAU,QAA8B,EAAtB,EAAsB,CACxD;GAIF,IAAmB,OAAO,OAAO,GAA2B,EACvE,MAAM,GACP,CAAC;AAEF,EAA0B,cAAc"}

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

@@ -35,12 +35,14 @@ var r = e(n.Item, {
 	base: [
 		"items-center",
 		"appearance-none",
+		"bg-transparent",
 		"border",
 		"border-grey-900",
 		"rounded-full",
 		"flex",
 		"shrink-0",
 		"justify-center",
+		"p-0",
 		"size-4",
 		"transition-all",
 		"duration-50",

package/dist/components/radio-card/RadioCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RadioCard.js","names":[],"sources":["../../../src/components/radio-card/RadioCard.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledRadioCard = styled(RadioGroup.Item, {\n base: [\n 'items-center',\n 'bg-white',\n 'border',\n 'border-grey-600',\n 'rounded-sm',\n 'cursor-pointer',\n 'flex',\n 'text-left',\n 'data-[state=checked]:-outline-offset-2',\n 'data-[state=checked]:outline-2',\n 'data-[state=checked]:outline-primary-800',\n 'data-[state=checked]:outline-solid'\n ],\n variants: {\n align: {\n left: ['flex-row'],\n right: ['flex-row-reverse']\n },\n size: {\n md: ['px-4', 'py-3'],\n lg: ['px-8', 'py-4']\n },\n isFullWidth: {\n true: ['w-full'],\n false: ['w-max']\n }\n }\n})\n\nconst RadioButton = styled('div', {\n base: [\n 'items-center',\n 'appearance-none',\n 'border',\n 'border-grey-900',\n 'rounded-full',\n 'flex',\n 'shrink-0',\n 'justify-center',\n 'size-4',\n 'transition-all',\n 'duration-50',\n 'ease-out',\n 'in-data-[state=checked]:bg-primary-800',\n 'in-data-[state=checked]:border-primary-800'\n ],\n variants: {\n containerIsFullWidth: {\n true: [],\n false: []\n },\n align: {\n left: ['mr-4'],\n right: []\n }\n },\n compoundVariants: [\n {\n containerIsFullWidth: true,\n align: 'right',\n class: ['ml-auto']\n },\n {\n containerIsFullWidth: false,\n align: 'right',\n class: ['ml-4']\n }\n ]\n})\n\nconst Indicator = styled(RadioGroup.Indicator, {\n base: ['bg-white', 'rounded-full', 'absolute', 'size-1.5']\n})\n\ntype RadioCardProps = React.ComponentProps<typeof StyledRadioCard>\n\nexport const RadioCard = ({\n children,\n isFullWidth = false,\n size = 'md',\n align = 'left',\n ...rest\n}: RadioCardProps) => (\n <StyledRadioCard\n {...rest}\n align={align}\n isFullWidth={isFullWidth}\n size={size}\n >\n <RadioButton align={align} containerIsFullWidth={isFullWidth}>\n <Indicator />\n </RadioButton>\n <div>{children}</div>\n </StyledRadioCard>\n)\n"],"mappings":";;;;AAKA,IAAM,IAAkB,EAAO,EAAW,MAAM;CAC9C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,MAAM,CAAC,WAAW;GAClB,OAAO,CAAC,mBAAmB;GAC5B;EACD,MAAM;GACJ,IAAI,CAAC,QAAQ,OAAO;GACpB,IAAI,CAAC,QAAQ,OAAO;GACrB;EACD,aAAa;GACX,MAAM,CAAC,SAAS;GAChB,OAAO,CAAC,QAAQ;GACjB;EACF;CACF,CAAC,EAEI,IAAc,EAAO,OAAO;CAChC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,sBAAsB;GACpB,MAAM,EAAE;GACR,OAAO,EAAE;GACV;EACD,OAAO;GACL,MAAM,CAAC,OAAO;GACd,OAAO,EAAE;GACV;EACF;CACD,kBAAkB,CAChB;EACE,sBAAsB;EACtB,OAAO;EACP,OAAO,CAAC,UAAU;EACnB,EACD;EACE,sBAAsB;EACtB,OAAO;EACP,OAAO,CAAC,OAAO;EAChB,CACF;CACF,CAAC,EAEI,IAAY,EAAO,EAAW,WAAW,EAC7C,MAAM;CAAC;CAAY;CAAgB;CAAY;CAAW,EAC3D,CAAC,EAIW,KAAa,EACxB,aACA,iBAAc,IACd,UAAO,MACP,WAAQ,QACR,GAAG,QAEH,kBAAA,cAAC,GAAD;CACE,GAAI;CACG;CACM;CACP;CAMU,EAJhB,kBAAA,cAAC,GAAD;CAAoB;CAAO,sBAAsB;CAEnC,EADZ,kBAAA,cAAC,GAAA,KAAY,CACD,EACd,kBAAA,cAAC,OAAA,MAAK,EAAe,CACL"}
1	+ {"version":3,"file":"RadioCard.js","names":[],"sources":["../../../src/components/radio-card/RadioCard.tsx"],"sourcesContent":["import * as RadioGroup from '@radix-ui/react-radio-group'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledRadioCard = styled(RadioGroup.Item, {\n base: [\n 'items-center',\n 'bg-white',\n 'border',\n 'border-grey-600',\n 'rounded-sm',\n 'cursor-pointer',\n 'flex',\n 'text-left',\n 'data-[state=checked]:-outline-offset-2',\n 'data-[state=checked]:outline-2',\n 'data-[state=checked]:outline-primary-800',\n 'data-[state=checked]:outline-solid'\n ],\n variants: {\n align: {\n left: ['flex-row'],\n right: ['flex-row-reverse']\n },\n size: {\n md: ['px-4', 'py-3'],\n lg: ['px-8', 'py-4']\n },\n isFullWidth: {\n true: ['w-full'],\n false: ['w-max']\n }\n }\n})\n\nconst RadioButton = styled('div', {\n base: [\n 'items-center',\n 'appearance-none',\n 'bg-transparent',\n 'border',\n 'border-grey-900',\n 'rounded-full',\n 'flex',\n 'shrink-0',\n 'justify-center',\n 'p-0',\n 'size-4',\n 'transition-all',\n 'duration-50',\n 'ease-out',\n 'in-data-[state=checked]:bg-primary-800',\n 'in-data-[state=checked]:border-primary-800'\n ],\n variants: {\n containerIsFullWidth: {\n true: [],\n false: []\n },\n align: {\n left: ['mr-4'],\n right: []\n }\n },\n compoundVariants: [\n {\n containerIsFullWidth: true,\n align: 'right',\n class: ['ml-auto']\n },\n {\n containerIsFullWidth: false,\n align: 'right',\n class: ['ml-4']\n }\n ]\n})\n\nconst Indicator = styled(RadioGroup.Indicator, {\n base: ['bg-white', 'rounded-full', 'absolute', 'size-1.5']\n})\n\ntype RadioCardProps = React.ComponentProps<typeof StyledRadioCard>\n\nexport const RadioCard = ({\n children,\n isFullWidth = false,\n size = 'md',\n align = 'left',\n ...rest\n}: RadioCardProps) => (\n <StyledRadioCard\n {...rest}\n align={align}\n isFullWidth={isFullWidth}\n size={size}\n >\n <RadioButton align={align} containerIsFullWidth={isFullWidth}>\n <Indicator />\n </RadioButton>\n <div>{children}</div>\n </StyledRadioCard>\n)\n"],"mappings":";;;;AAKA,IAAM,IAAkB,EAAO,EAAW,MAAM;CAC9C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,OAAO;GACL,MAAM,CAAC,WAAW;GAClB,OAAO,CAAC,mBAAmB;GAC5B;EACD,MAAM;GACJ,IAAI,CAAC,QAAQ,OAAO;GACpB,IAAI,CAAC,QAAQ,OAAO;GACrB;EACD,aAAa;GACX,MAAM,CAAC,SAAS;GAChB,OAAO,CAAC,QAAQ;GACjB;EACF;CACF,CAAC,EAEI,IAAc,EAAO,OAAO;CAChC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,sBAAsB;GACpB,MAAM,EAAE;GACR,OAAO,EAAE;GACV;EACD,OAAO;GACL,MAAM,CAAC,OAAO;GACd,OAAO,EAAE;GACV;EACF;CACD,kBAAkB,CAChB;EACE,sBAAsB;EACtB,OAAO;EACP,OAAO,CAAC,UAAU;EACnB,EACD;EACE,sBAAsB;EACtB,OAAO;EACP,OAAO,CAAC,OAAO;EAChB,CACF;CACF,CAAC,EAEI,IAAY,EAAO,EAAW,WAAW,EAC7C,MAAM;CAAC;CAAY;CAAgB;CAAY;CAAW,EAC3D,CAAC,EAIW,KAAa,EACxB,aACA,iBAAc,IACd,UAAO,MACP,WAAQ,QACR,GAAG,QAEH,kBAAA,cAAC,GAAD;CACE,GAAI;CACG;CACM;CACP;CAMU,EAJhB,kBAAA,cAAC,GAAD;CAAoB;CAAO,sBAAsB;CAEnC,EADZ,kBAAA,cAAC,GAAA,KAAY,CACD,EACd,kBAAA,cAAC,OAAA,MAAK,EAAe,CACL"}

package/dist/components/segmented-control/SegmentedControlItem.js CHANGED Viewed

@@ -6,7 +6,9 @@ import { Trigger as r } from "@radix-ui/react-tabs";
 var i = e(r, {
 	base: [
 		"relative",
+		"bg-transparent",
 		"rounded-md",
+		"p-0",
 		"z-2",
 		"min-w-35",
 		"border-2",

package/dist/components/segmented-control/SegmentedControlItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SegmentedControlItem.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlItem.tsx"],"sourcesContent":["import { Trigger } from '@radix-ui/react-tabs'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledItem = styled(\n Trigger,\n {\n base: [\n 'relative',\n 'rounded-md',\n 'z-2',\n 'min-w-35',\n 'border-2',\n 'border-transparent',\n 'cursor-pointer',\n 'select-none',\n 'flex',\n 'flex-col',\n 'items-center',\n 'data-[state=active]:border-2',\n 'data-[state=active]:border-transparent',\n 'data-[state=active]:focus-visible:border-primary-800',\n 'data-[state=active]:focus-visible:shadow-none',\n 'data-[state=active]:font-semibold',\n 'data-[state=active]:shadow-none',\n 'data-[state=active]:text-(--text-bold)',\n 'data-[state=inactive]:font-normal',\n 'data-[state=inactive]:text-grey-900',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30',\n 'focus-visible:outline-none'\n ],\n variants: {\n theme: {\n primary: [\n 'data-[state=inactive]:hover:bg-primary-300',\n 'focus-visible:border-primary-800'\n ],\n marsh: [\n 'data-[state=inactive]:hover:bg-marsh-300',\n 'focus-visible:border-marsh-800'\n ]\n },\n size: {\n sm: ['flex-[unset]', 'gap-2', 'px-6', 'py-4'],\n md: ['flex-1', 'gap-3', 'px-4', 'py-6'],\n lg: ['flex-1', 'gap-4', 'px-4', 'py-6']\n }\n }\n },\n { enabledResponsiveVariants: true }\n)\n\nexport const SegmentedControlItem = React.forwardRef<\n HTMLButtonElement,\n Omit<React.ComponentProps<typeof StyledItem>, 'size'>\n>(({ children, ...props }, ref) => {\n const { size, theme } = React.useContext(SegmentedControlContext)\n\n return (\n <StyledItem {...props} theme={theme} size={size} ref={ref}>\n {children}\n </StyledItem>\n )\n})\n\nSegmentedControlItem.displayName = 'SegmentedControlItem'\n"],"mappings":";;;;;AAOA,IAAM,IAAa,EACjB,GACA;CACE,MAAM;EACJ;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,OAAO;GACL,SAAS,CACP,8CACA,mCACD;GACD,OAAO,CACL,4CACA,iCACD;GACF;EACD,MAAM;GACJ,IAAI;IAAC;IAAgB;IAAS;IAAQ;IAAO;GAC7C,IAAI;IAAC;IAAU;IAAS;IAAQ;IAAO;GACvC,IAAI;IAAC;IAAU;IAAS;IAAQ;IAAO;GACxC;EACF;CACF,EACD,EAAE,2BAA2B,IAAM,CACpC,EAEY,IAAuB,EAAM,YAGvC,EAAE,aAAU,GAAG,KAAS,MAAQ;CACjC,IAAM,EAAE,SAAM,aAAU,EAAM,WAAW,EAAwB;AAEjE,QACE,kBAAA,cAAC,GAAD;EAAY,GAAI;EAAc;EAAa;EAAW;EAEzC,EADV,EACU;EAEf;AAEF,EAAqB,cAAc"}
1	+ {"version":3,"file":"SegmentedControlItem.js","names":[],"sources":["../../../src/components/segmented-control/SegmentedControlItem.tsx"],"sourcesContent":["import { Trigger } from '@radix-ui/react-tabs'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { SegmentedControlContext } from './SegmentedControlContext'\n\nconst StyledItem = styled(\n Trigger,\n {\n base: [\n 'relative',\n 'bg-transparent',\n 'rounded-md',\n 'p-0',\n 'z-2',\n 'min-w-35',\n 'border-2',\n 'border-transparent',\n 'cursor-pointer',\n 'select-none',\n 'flex',\n 'flex-col',\n 'items-center',\n 'data-[state=active]:border-2',\n 'data-[state=active]:border-transparent',\n 'data-[state=active]:focus-visible:border-primary-800',\n 'data-[state=active]:focus-visible:shadow-none',\n 'data-[state=active]:font-semibold',\n 'data-[state=active]:shadow-none',\n 'data-[state=active]:text-(--text-bold)',\n 'data-[state=inactive]:font-normal',\n 'data-[state=inactive]:text-grey-900',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30',\n 'focus-visible:outline-none'\n ],\n variants: {\n theme: {\n primary: [\n 'data-[state=inactive]:hover:bg-primary-300',\n 'focus-visible:border-primary-800'\n ],\n marsh: [\n 'data-[state=inactive]:hover:bg-marsh-300',\n 'focus-visible:border-marsh-800'\n ]\n },\n size: {\n sm: ['flex-[unset]', 'gap-2', 'px-6', 'py-4'],\n md: ['flex-1', 'gap-3', 'px-4', 'py-6'],\n lg: ['flex-1', 'gap-4', 'px-4', 'py-6']\n }\n }\n },\n { enabledResponsiveVariants: true }\n)\n\nexport const SegmentedControlItem = React.forwardRef<\n HTMLButtonElement,\n Omit<React.ComponentProps<typeof StyledItem>, 'size'>\n>(({ children, ...props }, ref) => {\n const { size, theme } = React.useContext(SegmentedControlContext)\n\n return (\n <StyledItem {...props} theme={theme} size={size} ref={ref}>\n {children}\n </StyledItem>\n )\n})\n\nSegmentedControlItem.displayName = 'SegmentedControlItem'\n"],"mappings":";;;;;AAOA,IAAM,IAAa,EACjB,GACA;CACE,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;EACD;CACD,UAAU;EACR,OAAO;GACL,SAAS,CACP,8CACA,mCACD;GACD,OAAO,CACL,4CACA,iCACD;GACF;EACD,MAAM;GACJ,IAAI;IAAC;IAAgB;IAAS;IAAQ;IAAO;GAC7C,IAAI;IAAC;IAAU;IAAS;IAAQ;IAAO;GACvC,IAAI;IAAC;IAAU;IAAS;IAAQ;IAAO;GACxC;EACF;CACF,EACD,EAAE,2BAA2B,IAAM,CACpC,EAEY,IAAuB,EAAM,YAGvC,EAAE,aAAU,GAAG,KAAS,MAAQ;CACjC,IAAM,EAAE,SAAM,aAAU,EAAM,WAAW,EAAwB;AAEjE,QACE,kBAAA,cAAC,GAAD;EAAY,GAAI;EAAc;EAAa;EAAW;EAEzC,EADV,EACU;EAEf;AAEF,EAAqB,cAAc"}

package/dist/components/stepper/StepperStepBullet.js CHANGED Viewed

@@ -9,6 +9,7 @@ var t = e("div", {
 		"items-center",
 		"size-8",
 		"rounded-[50%]",
+		"border-0",
 		"bg-grey-200",
 		"z-1",
 		"flex-none"

package/dist/components/stepper/StepperStepBullet.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"StepperStepBullet.js","names":[],"sources":["../../../src/components/stepper/StepperStepBullet.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const StepperStepBullet = styled('div', {\n base: [\n 'flex',\n 'relative',\n 'p-2',\n 'justify-center',\n 'items-center',\n 'size-8',\n 'rounded-[50%]',\n 'bg-grey-200',\n 'z-1',\n 'flex-none'\n ],\n variants: {\n status: {\n default: ['bg-grey-200', 'text-grey-700'],\n active: ['bg-white', 'border-2', 'border-current', 'text-primary-900'],\n viewed: ['bg-white', 'border-2', 'border-grey-600', 'text-grey-1000'],\n completed: ['bg-primary-800', 'text-white'],\n reviewed: ['bg-primary-900', 'text-white'],\n success: ['bg-success', 'text-white']\n }\n }\n})\n"],"mappings":";;AAEA,IAAa,IAAoB,EAAO,OAAO;CAC7C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,QAAQ;EACN,SAAS,CAAC,eAAe,gBAAgB;EACzC,QAAQ;GAAC;GAAY;GAAY;GAAkB;GAAmB;EACtE,QAAQ;GAAC;GAAY;GAAY;GAAmB;GAAiB;EACrE,WAAW,CAAC,kBAAkB,aAAa;EAC3C,UAAU,CAAC,kBAAkB,aAAa;EAC1C,SAAS,CAAC,cAAc,aAAa;EACtC,EACF;CACF,CAAC"}
1	+ {"version":3,"file":"StepperStepBullet.js","names":[],"sources":["../../../src/components/stepper/StepperStepBullet.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const StepperStepBullet = styled('div', {\n base: [\n 'flex',\n 'relative',\n 'p-2',\n 'justify-center',\n 'items-center',\n 'size-8',\n 'rounded-[50%]',\n 'border-0',\n 'bg-grey-200',\n 'z-1',\n 'flex-none'\n ],\n variants: {\n status: {\n default: ['bg-grey-200', 'text-grey-700'],\n active: ['bg-white', 'border-2', 'border-current', 'text-primary-900'],\n viewed: ['bg-white', 'border-2', 'border-grey-600', 'text-grey-1000'],\n completed: ['bg-primary-800', 'text-white'],\n reviewed: ['bg-primary-900', 'text-white'],\n success: ['bg-success', 'text-white']\n }\n }\n})\n"],"mappings":";;AAEA,IAAa,IAAoB,EAAO,OAAO;CAC7C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,QAAQ;EACN,SAAS,CAAC,eAAe,gBAAgB;EACzC,QAAQ;GAAC;GAAY;GAAY;GAAkB;GAAmB;EACtE,QAAQ;GAAC;GAAY;GAAY;GAAmB;GAAiB;EACrE,WAAW,CAAC,kBAAkB,aAAa;EAC3C,UAAU,CAAC,kBAAkB,aAAa;EAC1C,SAAS,CAAC,cAAc,aAAa;EACtC,EACF;CACF,CAAC"}

package/dist/components/switch/Switch.js CHANGED Viewed

@@ -6,6 +6,7 @@ var r = e(n.Root, {
 	base: [
 		"appearance-none",
 		"bg-grey-600",
+		"border-none",
 		"rounded-full",
 		"cursor-pointer",
 		"flex",

package/dist/components/switch/Switch.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Switch.js","names":[],"sources":["../../../src/components/switch/Switch.tsx"],"sourcesContent":["import * as RadixSwitch from '@radix-ui/react-switch'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledSwitch = styled(RadixSwitch.Root, {\n base: [\n 'appearance-none',\n 'bg-grey-600',\n 'rounded-full',\n 'cursor-pointer',\n 'flex',\n 'overflow-hidden',\n 'relative',\n 'transition-all',\n 'duration-50',\n 'ease-out',\n 'hover:bg-grey-700',\n 'focus:outline-2',\n 'focus:outline-offset-1',\n 'focus:outline-primary-800',\n 'focus:outline-solid',\n 'data-[state=checked]:bg-primary-800',\n 'data-[state=checked]:hover:bg-primary-900',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30'\n ],\n variants: {\n size: {\n md: ['p-0.5', 'w-10'],\n lg: ['p-1', 'w-16']\n }\n }\n})\n\nconst StyledThumb = styled(RadixSwitch.Thumb, {\n base: [\n 'bg-white',\n 'rounded-full',\n 'block',\n 'transition-transform',\n 'duration-50',\n 'will-change-transform'\n ],\n variants: {\n size: {\n md: ['data-[state=checked]:translate-x-5', 'size-4'],\n lg: ['data-[state=checked]:translate-x-8', 'size-6']\n }\n }\n})\n\ntype SwitchProps = React.ComponentProps<typeof StyledSwitch>\n\nexport const Switch = ({ size = 'md', ...rest }: SwitchProps) => (\n <StyledSwitch size={size} {...rest}>\n <StyledThumb size={size} />\n </StyledSwitch>\n)\n\nSwitch.displayName = 'Switch'\n"],"mappings":";;;;AAKA,IAAM,IAAe,EAAO,EAAY,MAAM;CAC5C,MAAM;EACJ;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,SAAS,OAAO;EACrB,IAAI,CAAC,OAAO,OAAO;EACpB,EACF;CACF,CAAC,EAEI,IAAc,EAAO,EAAY,OAAO;CAC5C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,sCAAsC,SAAS;EACpD,IAAI,CAAC,sCAAsC,SAAS;EACrD,EACF;CACF,CAAC,EAIW,KAAU,EAAE,UAAO,MAAM,GAAG,QACvC,kBAAA,cAAC,GAAD;CAAoB;CAAM,GAAI;CAEf,EADb,kBAAA,cAAC,GAAD,EAAmB,SAAQ,CAAA,CACd;AAGjB,EAAO,cAAc"}
1	+ {"version":3,"file":"Switch.js","names":[],"sources":["../../../src/components/switch/Switch.tsx"],"sourcesContent":["import * as RadixSwitch from '@radix-ui/react-switch'\nimport * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledSwitch = styled(RadixSwitch.Root, {\n base: [\n 'appearance-none',\n 'bg-grey-600',\n 'border-none',\n 'rounded-full',\n 'cursor-pointer',\n 'flex',\n 'overflow-hidden',\n 'relative',\n 'transition-all',\n 'duration-50',\n 'ease-out',\n 'hover:bg-grey-700',\n 'focus:outline-2',\n 'focus:outline-offset-1',\n 'focus:outline-primary-800',\n 'focus:outline-solid',\n 'data-[state=checked]:bg-primary-800',\n 'data-[state=checked]:hover:bg-primary-900',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30'\n ],\n variants: {\n size: {\n md: ['p-0.5', 'w-10'],\n lg: ['p-1', 'w-16']\n }\n }\n})\n\nconst StyledThumb = styled(RadixSwitch.Thumb, {\n base: [\n 'bg-white',\n 'rounded-full',\n 'block',\n 'transition-transform',\n 'duration-50',\n 'will-change-transform'\n ],\n variants: {\n size: {\n md: ['data-[state=checked]:translate-x-5', 'size-4'],\n lg: ['data-[state=checked]:translate-x-8', 'size-6']\n }\n }\n})\n\ntype SwitchProps = React.ComponentProps<typeof StyledSwitch>\n\nexport const Switch = ({ size = 'md', ...rest }: SwitchProps) => (\n <StyledSwitch size={size} {...rest}>\n <StyledThumb size={size} />\n </StyledSwitch>\n)\n\nSwitch.displayName = 'Switch'\n"],"mappings":";;;;AAKA,IAAM,IAAe,EAAO,EAAY,MAAM;CAC5C,MAAM;EACJ;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,SAAS,OAAO;EACrB,IAAI,CAAC,OAAO,OAAO;EACpB,EACF;CACF,CAAC,EAEI,IAAc,EAAO,EAAY,OAAO;CAC5C,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,MAAM;EACJ,IAAI,CAAC,sCAAsC,SAAS;EACpD,IAAI,CAAC,sCAAsC,SAAS;EACrD,EACF;CACF,CAAC,EAIW,KAAU,EAAE,UAAO,MAAM,GAAG,QACvC,kBAAA,cAAC,GAAD;CAAoB;CAAM,GAAI;CAEf,EADb,kBAAA,cAAC,GAAD,EAAmB,SAAQ,CAAA,CACd;AAGjB,EAAO,cAAc"}

package/dist/components/table/TableCell.js CHANGED Viewed

@@ -3,6 +3,7 @@ import { styled as e } from "../../styled.js";
 var t = e("td", { base: [
 	"border-t",
 	"border-t-grey-100",
+	"box-border",
 	"text-grey-800",
 	"font-body",
 	"leading-normal",

package/dist/components/table/TableCell.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableCell.js","names":[],"sources":["../../../src/components/table/TableCell.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const TableCell = styled('td', {\n base: [\n 'border-t',\n 'border-t-grey-100',\n 'text-grey-800',\n 'font-body',\n 'leading-normal',\n 'text-left',\n 'align-middle',\n 'first:font-semibold'\n ]\n})\n\nTableCell.displayName = 'TableCell'\n"],"mappings":";;AAEA,IAAa,IAAY,EAAO,MAAM,EACpC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC;AAEF,EAAU,cAAc"}
1	+ {"version":3,"file":"TableCell.js","names":[],"sources":["../../../src/components/table/TableCell.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const TableCell = styled('td', {\n base: [\n 'border-t',\n 'border-t-grey-100',\n 'box-border',\n 'text-grey-800',\n 'font-body',\n 'leading-normal',\n 'text-left',\n 'align-middle',\n 'first:font-semibold'\n ]\n})\n\nTableCell.displayName = 'TableCell'\n"],"mappings":";;AAEA,IAAa,IAAY,EAAO,MAAM,EACpC,MAAM;CACJ;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EACF,CAAC;AAEF,EAAU,cAAc"}

package/dist/components/text/Text.js CHANGED Viewed

@@ -2,7 +2,7 @@ import { styled as e } from "../../styled.js";
 import * as t from "react";
 //#region src/components/text/Text.tsx
 var n = e("p", {
-	base: [],
+	base: ["m-0"],
 	variants: {
 		size: {
 			xs: [

package/dist/components/text/Text.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Text.js","names":[],"sources":["../../../src/components/text/Text.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport type { Override } from '~/utilities/types'\n\nexport const StyledText = styled(\n 'p',\n {\n base: [],\n variants: {\n size: {\n xs: ['text-xs', 'leading-[1.6]', 'capsize-[0.4364]'],\n sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n md: ['text-md', 'leading-normal', 'capsize-[0.3864]'],\n lg: ['text-lg', 'leading-[1.52]', 'capsize-[0.3983]'],\n xl: ['text-xl', 'leading-[1.42]', 'capsize-[0.3506]'],\n '2xl': ['text-2xl', 'leading-[1.40]', 'capsize-[0.3336]'],\n '3xl': ['text-3xl', 'leading-[1.28]', 'capsize-[0.2709]'],\n '4xl': ['text-4xl', 'leading-none', 'capsize-[0.1309]']\n },\n noCapsize: {\n true: ['capsize-none']\n },\n weight: {\n normal: ['font-normal'],\n bold: ['font-semibold']\n },\n family: {\n body: ['font-body'],\n display: ['font-display'],\n mono: ['font-mono']\n }\n }\n },\n {\n enabledResponsiveVariants: true\n }\n)\n\ntype TextProps = Override<\n React.ComponentProps<typeof StyledText>,\n {\n as?:\n \| 'blockquote'\n \| 'caption'\n \| 'dd'\n \| 'dt'\n \| 'figcaption'\n \| 'li'\n \| 'p'\n \| 'span'\n \| 'legend'\n \| React.ComponentType\n \| React.ElementType\n }\n>\n\nexport const Text = React.forwardRef<HTMLParagraphElement, TextProps>(\n ({ size = 'md', family = 'body', ...remainingProps }, ref) => (\n <StyledText size={size} family={family} {...remainingProps} ref={ref} />\n )\n)\n\nText.displayName = 'Text'\n"],"mappings":";;;AAKA,IAAa,IAAa,EACxB,KACA;CACE,MAAM,~~EAAE~~;~~CACR~~,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAW;IAAiB;IAAmB;GACpD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,OAAO;IAAC;IAAY;IAAkB;IAAmB;GACzD,OAAO;IAAC;IAAY;IAAkB;IAAmB;GACzD,OAAO;IAAC;IAAY;IAAgB;IAAmB;GACxD;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACD,QAAQ;GACN,QAAQ,CAAC,cAAc;GACvB,MAAM,CAAC,gBAAgB;GACxB;EACD,QAAQ;GACN,MAAM,CAAC,YAAY;GACnB,SAAS,CAAC,eAAe;GACzB,MAAM,CAAC,YAAY;GACpB;EACF;CACF,EACD,EACE,2BAA2B,IAC5B,CACF,EAoBY,IAAO,EAAM,YACvB,EAAE,UAAO,MAAM,YAAS,QAAQ,GAAG,KAAkB,MACpD,kBAAA,cAAC,GAAD;CAAkB;CAAc;CAAQ,GAAI;CAAqB;CAAO,CAAA,CAE3E;AAED,EAAK,cAAc"}
1	+ {"version":3,"file":"Text.js","names":[],"sources":["../../../src/components/text/Text.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\nimport type { Override } from '~/utilities/types'\n\nexport const StyledText = styled(\n 'p',\n {\n base: ['m-0'],\n variants: {\n size: {\n xs: ['text-xs', 'leading-[1.6]', 'capsize-[0.4364]'],\n sm: ['text-sm', 'leading-[1.53]', 'capsize-[0.4056]'],\n md: ['text-md', 'leading-normal', 'capsize-[0.3864]'],\n lg: ['text-lg', 'leading-[1.52]', 'capsize-[0.3983]'],\n xl: ['text-xl', 'leading-[1.42]', 'capsize-[0.3506]'],\n '2xl': ['text-2xl', 'leading-[1.40]', 'capsize-[0.3336]'],\n '3xl': ['text-3xl', 'leading-[1.28]', 'capsize-[0.2709]'],\n '4xl': ['text-4xl', 'leading-none', 'capsize-[0.1309]']\n },\n noCapsize: {\n true: ['capsize-none']\n },\n weight: {\n normal: ['font-normal'],\n bold: ['font-semibold']\n },\n family: {\n body: ['font-body'],\n display: ['font-display'],\n mono: ['font-mono']\n }\n }\n },\n {\n enabledResponsiveVariants: true\n }\n)\n\ntype TextProps = Override<\n React.ComponentProps<typeof StyledText>,\n {\n as?:\n \| 'blockquote'\n \| 'caption'\n \| 'dd'\n \| 'dt'\n \| 'figcaption'\n \| 'li'\n \| 'p'\n \| 'span'\n \| 'legend'\n \| React.ComponentType\n \| React.ElementType\n }\n>\n\nexport const Text = React.forwardRef<HTMLParagraphElement, TextProps>(\n ({ size = 'md', family = 'body', ...remainingProps }, ref) => (\n <StyledText size={size} family={family} {...remainingProps} ref={ref} />\n )\n)\n\nText.displayName = 'Text'\n"],"mappings":";;;AAKA,IAAa,IAAa,EACxB,KACA;CACE,MAAM,CAAC,MAAM;CACb,UAAU;EACR,MAAM;GACJ,IAAI;IAAC;IAAW;IAAiB;IAAmB;GACpD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,IAAI;IAAC;IAAW;IAAkB;IAAmB;GACrD,OAAO;IAAC;IAAY;IAAkB;IAAmB;GACzD,OAAO;IAAC;IAAY;IAAkB;IAAmB;GACzD,OAAO;IAAC;IAAY;IAAgB;IAAmB;GACxD;EACD,WAAW,EACT,MAAM,CAAC,eAAe,EACvB;EACD,QAAQ;GACN,QAAQ,CAAC,cAAc;GACvB,MAAM,CAAC,gBAAgB;GACxB;EACD,QAAQ;GACN,MAAM,CAAC,YAAY;GACnB,SAAS,CAAC,eAAe;GACzB,MAAM,CAAC,YAAY;GACpB;EACF;CACF,EACD,EACE,2BAA2B,IAC5B,CACF,EAoBY,IAAO,EAAM,YACvB,EAAE,UAAO,MAAM,YAAS,QAAQ,GAAG,KAAkB,MACpD,kBAAA,cAAC,GAAD;CAAkB;CAAc;CAAQ,GAAI;CAAqB;CAAO,CAAA,CAE3E;AAED,EAAK,cAAc"}

package/dist/components/textarea/Textarea.js CHANGED Viewed

@@ -6,14 +6,17 @@ var n = e("textarea", {
 		"shadow-none",
 		"appearance-none",
 		"rounded-md",
+		"box-border",
 		"text-grey-1000",
 		"font-body",
 		"font-normal",
 		"text-md",
 		"leading-[1.4]",
+		"m-0",
 		"min-h-24",
 		"px-3",
 		"py-3",
+		"resize-y",
 		"w-full",
 		"disabled:bg-grey-200",
 		"disabled:cursor-not-allowed",

package/dist/components/textarea/Textarea.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Textarea.js","names":[],"sources":["../../../src/components/textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledTextarea = styled('textarea', {\n base: [\n 'shadow-none',\n 'appearance-none',\n 'rounded-md',\n 'text-grey-1000',\n 'font-body',\n 'font-normal',\n 'text-md',\n 'leading-[1.4]',\n 'min-h-24',\n 'px-3',\n 'py-3',\n 'w-full',\n 'disabled:bg-grey-200',\n 'disabled:cursor-not-allowed',\n 'disabled:text-grey-800',\n 'placeholder:opacity-100',\n 'placeholder:text-grey-700'\n ],\n variants: {\n appearance: {\n standard: [\n 'bg-white',\n 'border',\n 'border-grey-800',\n 'focus-within:border-primary-800',\n 'focus-within:outline-none'\n ],\n modern: [\n 'bg-grey-100',\n 'border-none',\n 'focus-within:outline-2',\n 'focus-within:outline-blue-800',\n 'focus-within:outline-offset-1',\n 'focus-within:outline-solid',\n 'focus-within:z-1'\n ]\n },\n state: {\n error: []\n }\n },\n defaultVariants: {\n appearance: 'standard'\n },\n compoundVariants: [\n {\n state: 'error',\n appearance: 'standard',\n class: ['border-danger']\n },\n {\n state: 'error',\n appearance: 'modern',\n class: ['bg-danger-light', 'focus-within:outline-danger']\n }\n ]\n})\n\nexport type TextareaProps = React.ComponentProps<typeof StyledTextarea>\n\nexport const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n (props, ref) => <StyledTextarea {...props} ref={ref} />\n)\n\nTextarea.displayName = 'Textarea'\n"],"mappings":";;;AAIA,IAAM,IAAiB,EAAO,YAAY;CACxC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,YAAY;GACV,UAAU;IACR;IACA;IACA;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,OAAO,EACL,OAAO,EAAE,EACV;EACF;CACD,iBAAiB,EACf,YAAY,YACb;CACD,kBAAkB,CAChB;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,gBAAgB;EACzB,EACD;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,mBAAmB,8BAA8B;EAC1D,CACF;CACF,CAAC,EAIW,IAAW,EAAM,YAC3B,GAAO,MAAQ,kBAAA,cAAC,GAAD;CAAgB,GAAI;CAAY;CAAO,CAAA,CACxD;AAED,EAAS,cAAc"}
1	+ {"version":3,"file":"Textarea.js","names":[],"sources":["../../../src/components/textarea/Textarea.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nconst StyledTextarea = styled('textarea', {\n base: [\n 'shadow-none',\n 'appearance-none',\n 'rounded-md',\n 'box-border',\n 'text-grey-1000',\n 'font-body',\n 'font-normal',\n 'text-md',\n 'leading-[1.4]',\n 'm-0',\n 'min-h-24',\n 'px-3',\n 'py-3',\n 'resize-y',\n 'w-full',\n 'disabled:bg-grey-200',\n 'disabled:cursor-not-allowed',\n 'disabled:text-grey-800',\n 'placeholder:opacity-100',\n 'placeholder:text-grey-700'\n ],\n variants: {\n appearance: {\n standard: [\n 'bg-white',\n 'border',\n 'border-grey-800',\n 'focus-within:border-primary-800',\n 'focus-within:outline-none'\n ],\n modern: [\n 'bg-grey-100',\n 'border-none',\n 'focus-within:outline-2',\n 'focus-within:outline-blue-800',\n 'focus-within:outline-offset-1',\n 'focus-within:outline-solid',\n 'focus-within:z-1'\n ]\n },\n state: {\n error: []\n }\n },\n defaultVariants: {\n appearance: 'standard'\n },\n compoundVariants: [\n {\n state: 'error',\n appearance: 'standard',\n class: ['border-danger']\n },\n {\n state: 'error',\n appearance: 'modern',\n class: ['bg-danger-light', 'focus-within:outline-danger']\n }\n ]\n})\n\nexport type TextareaProps = React.ComponentProps<typeof StyledTextarea>\n\nexport const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(\n (props, ref) => <StyledTextarea {...props} ref={ref} />\n)\n\nTextarea.displayName = 'Textarea'\n"],"mappings":";;;AAIA,IAAM,IAAiB,EAAO,YAAY;CACxC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,YAAY;GACV,UAAU;IACR;IACA;IACA;IACA;IACA;IACD;GACD,QAAQ;IACN;IACA;IACA;IACA;IACA;IACA;IACA;IACD;GACF;EACD,OAAO,EACL,OAAO,EAAE,EACV;EACF;CACD,iBAAiB,EACf,YAAY,YACb;CACD,kBAAkB,CAChB;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,gBAAgB;EACzB,EACD;EACE,OAAO;EACP,YAAY;EACZ,OAAO,CAAC,mBAAmB,8BAA8B;EAC1D,CACF;CACF,CAAC,EAIW,IAAW,EAAM,YAC3B,GAAO,MAAQ,kBAAA,cAAC,GAAD;CAAgB,GAAI;CAAY;CAAO,CAAA,CACxD;AAED,EAAS,cAAc"}

package/dist/components/tile/Tile.js CHANGED Viewed

@@ -4,6 +4,7 @@ import n from "react";
 //#region src/components/tile/Tile.tsx
 var r = e("div", {
 	base: [
+		"box-border",
 		"flex",
 		"flex-col",
 		"relative",

package/dist/components/tile/Tile.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tile.js","names":[],"sources":["../../../src/components/tile/Tile.tsx"],"sourcesContent":["import React from 'react'\n\nimport {\n ColorScheme,\n TcolorScheme\n} from '~/experiments/color-scheme/ColorScheme'\nimport { styled } from '~/styled'\n\nexport const StyledTile = styled(\n 'div',\n {\n base: [\n 'flex',\n 'flex-col',\n 'relative',\n 'border',\n 'bg-(--base-1)',\n 'text-(--foreground)',\n 'border-transparent'\n ],\n variants: {\n borderRadius: {\n sm: ['rounded-sm'],\n md: ['rounded-md'],\n lg: ['rounded-xl']\n },\n border: {\n true: ['border-(--base-3)']\n },\n diffused: {\n true: [\n 'supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]',\n 'supports-color-mix:backdrop-blur-sm'\n ]\n }\n }\n },\n { enabledResponsiveVariants: true }\n)\n\ntype TTileProps = React.ComponentProps<typeof StyledTile> & {\n colorScheme?: TcolorScheme\n}\n\nexport const Tile = React.forwardRef<HTMLDivElement, TTileProps>(\n ({ children, borderRadius = 'lg', colorScheme = {}, ...rest }, ref) => (\n <ColorScheme\n asChild\n base=\"grey1\"\n accent=\"primary2\"\n interactive=\"loContrast\"\n {...colorScheme}\n >\n <StyledTile ref={ref} borderRadius={borderRadius} {...rest}>\n {children}\n </StyledTile>\n </ColorScheme>\n )\n)\n\nTile.displayName = 'Tile'\n"],"mappings":";;;;AAQA,IAAa,IAAa,EACxB,OACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,cAAc;GACZ,IAAI,CAAC,aAAa;GAClB,IAAI,CAAC,aAAa;GAClB,IAAI,CAAC,aAAa;GACnB;EACD,QAAQ,EACN,MAAM,CAAC,oBAAoB,EAC5B;EACD,UAAU,EACR,MAAM,CACJ,wEACA,sCACD,EACF;EACF;CACF,EACD,EAAE,2BAA2B,IAAM,CACpC,EAMY,IAAO,EAAM,YACvB,EAAE,aAAU,kBAAe,MAAM,iBAAc,EAAE,EAAE,GAAG,KAAQ,MAC7D,kBAAA,cAAC,GAAD;CACE,SAAA;CACA,MAAK;CACL,QAAO;CACP,aAAY;CACZ,GAAI;CAKQ,EAHZ,kBAAA,cAAC,GAAD;CAAiB;CAAmB;CAAc,GAAI;CAEzC,EADV,EACU,CACD,CAEjB;AAED,EAAK,cAAc"}
1	+ {"version":3,"file":"Tile.js","names":[],"sources":["../../../src/components/tile/Tile.tsx"],"sourcesContent":["import React from 'react'\n\nimport {\n ColorScheme,\n TcolorScheme\n} from '~/experiments/color-scheme/ColorScheme'\nimport { styled } from '~/styled'\n\nexport const StyledTile = styled(\n 'div',\n {\n base: [\n 'box-border',\n 'flex',\n 'flex-col',\n 'relative',\n 'border',\n 'bg-(--base-1)',\n 'text-(--foreground)',\n 'border-transparent'\n ],\n variants: {\n borderRadius: {\n sm: ['rounded-sm'],\n md: ['rounded-md'],\n lg: ['rounded-xl']\n },\n border: {\n true: ['border-(--base-3)']\n },\n diffused: {\n true: [\n 'supports-color-mix:bg-[color-mix(in_hsl,(--base-1)_70%,transparent)]',\n 'supports-color-mix:backdrop-blur-sm'\n ]\n }\n }\n },\n { enabledResponsiveVariants: true }\n)\n\ntype TTileProps = React.ComponentProps<typeof StyledTile> & {\n colorScheme?: TcolorScheme\n}\n\nexport const Tile = React.forwardRef<HTMLDivElement, TTileProps>(\n ({ children, borderRadius = 'lg', colorScheme = {}, ...rest }, ref) => (\n <ColorScheme\n asChild\n base=\"grey1\"\n accent=\"primary2\"\n interactive=\"loContrast\"\n {...colorScheme}\n >\n <StyledTile ref={ref} borderRadius={borderRadius} {...rest}>\n {children}\n </StyledTile>\n </ColorScheme>\n )\n)\n\nTile.displayName = 'Tile'\n"],"mappings":";;;;AAQA,IAAa,IAAa,EACxB,OACA;CACE,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU;EACR,cAAc;GACZ,IAAI,CAAC,aAAa;GAClB,IAAI,CAAC,aAAa;GAClB,IAAI,CAAC,aAAa;GACnB;EACD,QAAQ,EACN,MAAM,CAAC,oBAAoB,EAC5B;EACD,UAAU,EACR,MAAM,CACJ,wEACA,sCACD,EACF;EACF;CACF,EACD,EAAE,2BAA2B,IAAM,CACpC,EAMY,IAAO,EAAM,YACvB,EAAE,aAAU,kBAAe,MAAM,iBAAc,EAAE,EAAE,GAAG,KAAQ,MAC7D,kBAAA,cAAC,GAAD;CACE,SAAA;CACA,MAAK;CACL,QAAO;CACP,aAAY;CACZ,GAAI;CAKQ,EAHZ,kBAAA,cAAC,GAAD;CAAiB;CAAmB;CAAc,GAAI;CAEzC,EADV,EACU,CACD,CAEjB;AAED,EAAK,cAAc"}

package/dist/components/toast/Toast.js CHANGED Viewed

@@ -11,6 +11,7 @@ var a = e("div", {
 		"pointer-events-auto",
 		"rounded-md",
 		"shadow-md",
+		"box-border",
 		"text-white",
 		"min-h-12",
 		"relative",

package/dist/components/toast/Toast.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Toast.js","names":[],"sources":["../../../src/components/toast/Toast.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { ToastCloseButton } from './ToastCloseButton'\nimport { useToastContext } from './ToastContext'\nimport { ToastIcon } from './ToastIcon'\n\nexport const StyledToast = styled('div', {\n base: [\n 'flex',\n 'items-center',\n 'pointer-events-auto',\n 'rounded-md',\n 'shadow-md',\n 'text-white',\n 'min-h-12',\n 'relative',\n 'px-4',\n 'py-1',\n 'motion-safe:duration-125',\n 'motion-safe:ease-out',\n 'motion-safe:transition-[colors,transform]'\n ],\n variants: {\n type: {\n loading: ['bg-info'],\n blank: ['bg-info'],\n success: ['bg-success'],\n error: ['bg-danger']\n }\n }\n})\n\nexport const Toast = (props: React.ComponentProps<typeof StyledToast>) => {\n const { type } = useToastContext()\n return <StyledToast type={props.type \|\| type} {...props} />\n}\n\nToast.Icon = ToastIcon\nToast.Close = ToastCloseButton\n"],"mappings":";;;;;;AAQA,IAAa,IAAc,EAAO,OAAO;CACvC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,MAAM;EACJ,SAAS,CAAC,UAAU;EACpB,OAAO,CAAC,UAAU;EAClB,SAAS,CAAC,aAAa;EACvB,OAAO,CAAC,YAAY;EACrB,EACF;CACF,CAAC,EAEW,KAAS,MAAoD;CACxE,IAAM,EAAE,YAAS,GAAiB;AAClC,QAAO,kBAAA,cAAC,GAAD;EAAa,MAAM,EAAM,QAAQ;EAAM,GAAI;EAAS,CAAA;;AAG7D,EAAM,OAAO,GACb,EAAM,QAAQ"}
1	+ {"version":3,"file":"Toast.js","names":[],"sources":["../../../src/components/toast/Toast.tsx"],"sourcesContent":["import * as React from 'react'\n\nimport { styled } from '~/styled'\n\nimport { ToastCloseButton } from './ToastCloseButton'\nimport { useToastContext } from './ToastContext'\nimport { ToastIcon } from './ToastIcon'\n\nexport const StyledToast = styled('div', {\n base: [\n 'flex',\n 'items-center',\n 'pointer-events-auto',\n 'rounded-md',\n 'shadow-md',\n 'box-border',\n 'text-white',\n 'min-h-12',\n 'relative',\n 'px-4',\n 'py-1',\n 'motion-safe:duration-125',\n 'motion-safe:ease-out',\n 'motion-safe:transition-[colors,transform]'\n ],\n variants: {\n type: {\n loading: ['bg-info'],\n blank: ['bg-info'],\n success: ['bg-success'],\n error: ['bg-danger']\n }\n }\n})\n\nexport const Toast = (props: React.ComponentProps<typeof StyledToast>) => {\n const { type } = useToastContext()\n return <StyledToast type={props.type \|\| type} {...props} />\n}\n\nToast.Icon = ToastIcon\nToast.Close = ToastCloseButton\n"],"mappings":";;;;;;AAQA,IAAa,IAAc,EAAO,OAAO;CACvC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,MAAM;EACJ,SAAS,CAAC,UAAU;EACpB,OAAO,CAAC,UAAU;EAClB,SAAS,CAAC,aAAa;EACvB,OAAO,CAAC,YAAY;EACrB,EACF;CACF,CAAC,EAEW,KAAS,MAAoD;CACxE,IAAM,EAAE,YAAS,GAAiB;AAClC,QAAO,kBAAA,cAAC,GAAD;EAAa,MAAM,EAAM,QAAQ;EAAM,GAAI;EAAS,CAAA;;AAG7D,EAAM,OAAO,GACb,EAAM,QAAQ"}

package/dist/components/toast/ToastProvider.js CHANGED Viewed

@@ -21,6 +21,7 @@ var l = e("div", { base: [
 		"justify-center",
 		"items-center",
 		"rounded-sm",
+		"box-border",
 		"min-h-12",
 		"[--slide-opacity-out:0]",
 		"[--slide-direction-out-y:-100%]"

package/dist/components/toast/ToastProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToastProvider.js","names":[],"sources":["../../../src/components/toast/ToastProvider.tsx"],"sourcesContent":["import { Error } from '@atom-learning/icons'\nimport * as React from 'react'\nimport { useToaster } from 'react-hot-toast'\n\nimport { styled } from '~/styled'\n\nimport { Spacer } from '../spacer/Spacer'\nimport { Text } from '../text/Text'\nimport { Toast } from './Toast'\nimport { ToastContext } from './ToastContext'\n\nexport { default as toast } from 'react-hot-toast'\nexport { useToastContext } from './ToastContext'\n\nconst ToastProviderBase = styled('div', {\n base: ['fixed', 'z-2147483647', 'inset-2', 'pointer-events-none', 'sm:top-3']\n})\n\nconst ToastWrapper = styled('div', {\n base: [\n 'absolute',\n 'w-full',\n 'flex',\n 'justify-center',\n 'items-center',\n 'rounded-sm',\n 'min-h-12',\n '[--slide-opacity-out:0]',\n '[--slide-direction-out-y:-100%]'\n ],\n variants: {\n visible: {\n true: ['motion-safe:animate-slide-direction-in'],\n false: ['opacity-0', 'motion-safe:animate-slide-direction-out']\n }\n }\n})\n\nexport const ToastProvider = ({\n children,\n className\n}: React.PropsWithChildren<{ className?: string }>) => {\n const { toasts, handlers } = useToaster()\n const { startPause, endPause, calculateOffset, updateHeight } = handlers\n\n return (\n <>\n <ToastProviderBase\n onMouseEnter={startPause}\n onMouseLeave={endPause}\n className={className}\n >\n {toasts.map((toast) => {\n const { message: children } = toast\n\n const offset = calculateOffset(toast.id, {\n reverseOrder: true,\n margin: 8\n })\n\n const ref = (el: HTMLDivElement \| null) => {\n if (el && toast.height === undefined) {\n updateHeight(toast.id, el.getBoundingClientRect().height)\n }\n }\n\n return (\n <ToastWrapper\n key={toast.id}\n ref={ref}\n visible={toast.visible}\n role={toast.role}\n aria-live={toast.ariaLive}\n style={{ '--offset': `${offset}px` }}\n className=\"top-(--offset)\"\n >\n <ToastContext.Provider value={toast}>\n {typeof children === 'function' ? (\n children(toast)\n ) : React.isValidElement(children) ? (\n children\n ) : (\n <Toast className=\"w-100\">\n {toast.type === 'error' && <Toast.Icon is={Error} />}\n <Text>{children}</Text>\n <Spacer />\n <Toast.Close />\n </Toast>\n )}\n </ToastContext.Provider>\n </ToastWrapper>\n )\n })}\n </ToastProviderBase>\n {children}\n </>\n )\n}\n\nToastProvider.displayName = 'ToastProvider'\n"],"mappings":";;;;;;;;;AAcA,IAAM,IAAoB,EAAO,OAAO,EACtC,MAAM;CAAC;CAAS;CAAgB;CAAW;CAAuB;CAAW,EAC9E,CAAC,EAEI,IAAe,EAAO,OAAO;CACjC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,SAAS;EACP,MAAM,CAAC,yCAAyC;EAChD,OAAO,CAAC,aAAa,0CAA0C;EAChE,EACF;CACF,CAAC,EAEW,KAAiB,EAC5B,aACA,mBACqD;CACrD,IAAM,EAAE,WAAQ,gBAAa,GAAY,EACnC,EAAE,eAAY,aAAU,oBAAiB,oBAAiB;AAEhE,QACE,kBAAA,cAAA,EAAA,UAAA,MACE,kBAAA,cAAC,GAAD;EACE,cAAc;EACd,cAAc;EACH;EA2CO,EAzCjB,EAAO,KAAK,MAAU;EACrB,IAAM,EAAE,SAAS,MAAa,GAExB,IAAS,EAAgB,EAAM,IAAI;GACvC,cAAc;GACd,QAAQ;GACT,CAAC;AAQF,SACE,kBAAA,cAAC,GAAD;GACE,KAAK,EAAM;GACN,MATI,MAA8B;AACzC,IAAI,KAAM,EAAM,WAAW,KAAA,KACzB,EAAa,EAAM,IAAI,EAAG,uBAAuB,CAAC,OAAO;;GAQzD,SAAS,EAAM;GACf,MAAM,EAAM;GACZ,aAAW,EAAM;GACjB,OAAO,EAAE,YAAY,GAAG,EAAO,KAAK;GACpC,WAAU;GAgBG,EAdb,kBAAA,cAAC,EAAa,UAAd,EAAuB,OAAO,GAaN,EAZrB,OAAO,KAAa,aACnB,EAAS,EAAM,GACb,EAAM,eAAe,EAAS,GAChC,IAEA,kBAAA,cAAC,GAAD,EAAO,WAAU,SAKT,EAJL,EAAM,SAAS,WAAW,kBAAA,cAAC,EAAM,MAAP,EAAY,IAAI,GAAS,CAAA,EACpD,kBAAA,cAAC,GAAA,MAAM,EAAgB,EACvB,kBAAA,cAAC,GAAA,KAAS,EACV,kBAAA,cAAC,EAAM,OAAA,KAAQ,CACT,CAEY,CACX;GAEjB,CACgB,EACnB,EACA;;AAIP,EAAc,cAAc"}
1	+ {"version":3,"file":"ToastProvider.js","names":[],"sources":["../../../src/components/toast/ToastProvider.tsx"],"sourcesContent":["import { Error } from '@atom-learning/icons'\nimport * as React from 'react'\nimport { useToaster } from 'react-hot-toast'\n\nimport { styled } from '~/styled'\n\nimport { Spacer } from '../spacer/Spacer'\nimport { Text } from '../text/Text'\nimport { Toast } from './Toast'\nimport { ToastContext } from './ToastContext'\n\nexport { default as toast } from 'react-hot-toast'\nexport { useToastContext } from './ToastContext'\n\nconst ToastProviderBase = styled('div', {\n base: ['fixed', 'z-2147483647', 'inset-2', 'pointer-events-none', 'sm:top-3']\n})\n\nconst ToastWrapper = styled('div', {\n base: [\n 'absolute',\n 'w-full',\n 'flex',\n 'justify-center',\n 'items-center',\n 'rounded-sm',\n 'box-border',\n 'min-h-12',\n '[--slide-opacity-out:0]',\n '[--slide-direction-out-y:-100%]'\n ],\n variants: {\n visible: {\n true: ['motion-safe:animate-slide-direction-in'],\n false: ['opacity-0', 'motion-safe:animate-slide-direction-out']\n }\n }\n})\n\nexport const ToastProvider = ({\n children,\n className\n}: React.PropsWithChildren<{ className?: string }>) => {\n const { toasts, handlers } = useToaster()\n const { startPause, endPause, calculateOffset, updateHeight } = handlers\n\n return (\n <>\n <ToastProviderBase\n onMouseEnter={startPause}\n onMouseLeave={endPause}\n className={className}\n >\n {toasts.map((toast) => {\n const { message: children } = toast\n\n const offset = calculateOffset(toast.id, {\n reverseOrder: true,\n margin: 8\n })\n\n const ref = (el: HTMLDivElement \| null) => {\n if (el && toast.height === undefined) {\n updateHeight(toast.id, el.getBoundingClientRect().height)\n }\n }\n\n return (\n <ToastWrapper\n key={toast.id}\n ref={ref}\n visible={toast.visible}\n role={toast.role}\n aria-live={toast.ariaLive}\n style={{ '--offset': `${offset}px` }}\n className=\"top-(--offset)\"\n >\n <ToastContext.Provider value={toast}>\n {typeof children === 'function' ? (\n children(toast)\n ) : React.isValidElement(children) ? (\n children\n ) : (\n <Toast className=\"w-100\">\n {toast.type === 'error' && <Toast.Icon is={Error} />}\n <Text>{children}</Text>\n <Spacer />\n <Toast.Close />\n </Toast>\n )}\n </ToastContext.Provider>\n </ToastWrapper>\n )\n })}\n </ToastProviderBase>\n {children}\n </>\n )\n}\n\nToastProvider.displayName = 'ToastProvider'\n"],"mappings":";;;;;;;;;AAcA,IAAM,IAAoB,EAAO,OAAO,EACtC,MAAM;CAAC;CAAS;CAAgB;CAAW;CAAuB;CAAW,EAC9E,CAAC,EAEI,IAAe,EAAO,OAAO;CACjC,MAAM;EACJ;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD;CACD,UAAU,EACR,SAAS;EACP,MAAM,CAAC,yCAAyC;EAChD,OAAO,CAAC,aAAa,0CAA0C;EAChE,EACF;CACF,CAAC,EAEW,KAAiB,EAC5B,aACA,mBACqD;CACrD,IAAM,EAAE,WAAQ,gBAAa,GAAY,EACnC,EAAE,eAAY,aAAU,oBAAiB,oBAAiB;AAEhE,QACE,kBAAA,cAAA,EAAA,UAAA,MACE,kBAAA,cAAC,GAAD;EACE,cAAc;EACd,cAAc;EACH;EA2CO,EAzCjB,EAAO,KAAK,MAAU;EACrB,IAAM,EAAE,SAAS,MAAa,GAExB,IAAS,EAAgB,EAAM,IAAI;GACvC,cAAc;GACd,QAAQ;GACT,CAAC;AAQF,SACE,kBAAA,cAAC,GAAD;GACE,KAAK,EAAM;GACN,MATI,MAA8B;AACzC,IAAI,KAAM,EAAM,WAAW,KAAA,KACzB,EAAa,EAAM,IAAI,EAAG,uBAAuB,CAAC,OAAO;;GAQzD,SAAS,EAAM;GACf,MAAM,EAAM;GACZ,aAAW,EAAM;GACjB,OAAO,EAAE,YAAY,GAAG,EAAO,KAAK;GACpC,WAAU;GAgBG,EAdb,kBAAA,cAAC,EAAa,UAAd,EAAuB,OAAO,GAaN,EAZrB,OAAO,KAAa,aACnB,EAAS,EAAM,GACb,EAAM,eAAe,EAAS,GAChC,IAEA,kBAAA,cAAC,GAAD,EAAO,WAAU,SAKT,EAJL,EAAM,SAAS,WAAW,kBAAA,cAAC,EAAM,MAAP,EAAY,IAAI,GAAS,CAAA,EACpD,kBAAA,cAAC,GAAA,MAAM,EAAgB,EACvB,kBAAA,cAAC,GAAA,KAAS,EACV,kBAAA,cAAC,EAAM,OAAA,KAAQ,CACT,CAEY,CACX;GAEjB,CACgB,EACnB,EACA;;AAIP,EAAc,cAAc"}

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

@@ -26,6 +26,7 @@ var n = [
 	"not-disabled:hover:text-primary-900"
 ], r = [
 	"bg-grey-200",
+	"border-0",
 	"text-grey-800",
 	"overflow-hidden",
 	"rounded-md",

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

	@@ -1 +1 @@
1	- {"version":3,"file":"ToggleGroupItem.js","names":[],"sources":["../../../src/components/toggle-group/ToggleGroupItem.tsx"],"sourcesContent":["import * as ToggleGroup from '@radix-ui/react-toggle-group'\n\nimport { styled } from '~/styled'\n\nexport const standardVariant = [\n 'before:bg-grey-600',\n 'bg-white',\n 'border',\n 'border-grey-600',\n 'text-grey-800',\n 'data-[state=on]:border-current!',\n 'data-[state=on]:inset-shadow-[currentColor_0px_0px_0px_1px]',\n 'data-[state=on]:text-primary-800',\n 'not-disabled:data-[state=on]:before:bg-none',\n 'not-disabled:focus-visible:before:bg-none',\n 'not-disabled:focus-visible:data-[state=off]:border-grey-600!',\n 'not-disabled:focus-visible:data-[state=on]:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n 'not-disabled:focus-visible:data-[state=on]:inset-shadow-[currentColor_0px_0px_0px_1px]',\n 'not-disabled:focus-visible:data-[state=on]:shadow-[white_0px_0px_0px_2px]',\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:before:bg-none',\n 'not-disabled:hover:border-current!',\n 'not-disabled:hover:text-primary-900'\n]\n\nexport const modernVariant = [\n 'bg-grey-200',\n 'text-grey-800',\n 'overflow-hidden',\n 'rounded-md',\n 'data-[state=on]:bg-white',\n 'data-[state=on]:border!',\n 'data-[state=on]:border-grey-200!',\n 'data-[state=on]:shadow-none!',\n 'data-[state=on]:text-grey-900',\n 'not-disabled:focus-visible:data-[state=off]:border-grey-600!',\n 'not-disabled:focus-visible:data-[state=on]:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n 'not-disabled:focus-visible:data-[state=on]:inset-shadow-[currentColor_0px_0px_0px_1px_white_0px_0px_0px_2px]',\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:text-primary-900'\n]\n\nexport const ToggleGroupItem = styled(ToggleGroup.Item, {\n base: [\n 'cursor-pointer',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30'\n ],\n variants: {\n theme: {\n standard: standardVariant,\n modern: modernVariant\n }\n },\n defaultVariants: {\n theme: 'standard'\n }\n})\n"],"mappings":";;;AAIA,IAAa,IAAkB;CAC7B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EAEY,IAAgB;CAC3B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EAEY,IAAkB,EAAO,EAAY,MAAM;CACtD,MAAM;EACJ;EACA;EACA;EACD;CACD,UAAU,EACR,OAAO;EACL,UAAU;EACV,QAAQ;EACT,EACF;CACD,iBAAiB,EACf,OAAO,YACR;CACF,CAAC"}
1	+ {"version":3,"file":"ToggleGroupItem.js","names":[],"sources":["../../../src/components/toggle-group/ToggleGroupItem.tsx"],"sourcesContent":["import * as ToggleGroup from '@radix-ui/react-toggle-group'\n\nimport { styled } from '~/styled'\n\nexport const standardVariant = [\n 'before:bg-grey-600',\n 'bg-white',\n 'border',\n 'border-grey-600',\n 'text-grey-800',\n 'data-[state=on]:border-current!',\n 'data-[state=on]:inset-shadow-[currentColor_0px_0px_0px_1px]',\n 'data-[state=on]:text-primary-800',\n 'not-disabled:data-[state=on]:before:bg-none',\n 'not-disabled:focus-visible:before:bg-none',\n 'not-disabled:focus-visible:data-[state=off]:border-grey-600!',\n 'not-disabled:focus-visible:data-[state=on]:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n 'not-disabled:focus-visible:data-[state=on]:inset-shadow-[currentColor_0px_0px_0px_1px]',\n 'not-disabled:focus-visible:data-[state=on]:shadow-[white_0px_0px_0px_2px]',\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:before:bg-none',\n 'not-disabled:hover:border-current!',\n 'not-disabled:hover:text-primary-900'\n]\n\nexport const modernVariant = [\n 'bg-grey-200',\n 'border-0',\n 'text-grey-800',\n 'overflow-hidden',\n 'rounded-md',\n 'data-[state=on]:bg-white',\n 'data-[state=on]:border!',\n 'data-[state=on]:border-grey-200!',\n 'data-[state=on]:shadow-none!',\n 'data-[state=on]:text-grey-900',\n 'not-disabled:focus-visible:data-[state=off]:border-grey-600!',\n 'not-disabled:focus-visible:data-[state=on]:shadow-[var(--color-primary-800)_0px_0px_0px_4px]',\n 'not-disabled:focus-visible:data-[state=on]:inset-shadow-[currentColor_0px_0px_0px_1px_white_0px_0px_0px_2px]',\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:text-primary-900'\n]\n\nexport const ToggleGroupItem = styled(ToggleGroup.Item, {\n base: [\n 'cursor-pointer',\n 'disabled:cursor-not-allowed',\n 'disabled:opacity-30'\n ],\n variants: {\n theme: {\n standard: standardVariant,\n modern: modernVariant\n }\n },\n defaultVariants: {\n theme: 'standard'\n }\n})\n"],"mappings":";;;AAIA,IAAa,IAAkB;CAC7B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EAEY,IAAgB;CAC3B;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACA;CACD,EAEY,IAAkB,EAAO,EAAY,MAAM;CACtD,MAAM;EACJ;EACA;EACA;EACD;CACD,UAAU,EACR,OAAO;EACL,UAAU;EACV,QAAQ;EACT,EACF;CACD,iBAAiB,EACf,OAAO,YACR;CACF,CAAC"}

package/dist/components/tree/TreeList.js CHANGED Viewed

@@ -3,6 +3,9 @@ import { styled as e } from "../../styled.js";
 var t = e("ul", { base: [
 	"flex",
 	"flex-col",
+	"p-0",
+	"m-0",
+	"list-none",
 	"w-full",
 	"[&_&]:pl-4"
 ] });

package/dist/components/tree/TreeList.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TreeList.js","names":[],"sources":["../../../src/components/tree/TreeList.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const TreeList = styled('ul', {\n base: ['flex', 'flex-col', 'w-full', '[&_&]:pl-4']\n})\n"],"mappings":";;AAEA,IAAa,IAAW,EAAO,MAAM,EACnC,MAAM;CAAC;CAAQ;CAAY;CAAU;CAAa,~~EACnD~~,CAAC"}
1	+ {"version":3,"file":"TreeList.js","names":[],"sources":["../../../src/components/tree/TreeList.tsx"],"sourcesContent":["import { styled } from '~/styled'\n\nexport const TreeList = styled('ul', {\n base: ['flex', 'flex-col', 'p-0', 'm-0', 'list-none', 'w-full', '[&_&]:pl-4']\n})\n"],"mappings":";;AAEA,IAAa,IAAW,EAAO,MAAM,EACnC,MAAM;CAAC;CAAQ;CAAY;CAAO;CAAO;CAAa;CAAU;CAAa,EAC9E,CAAC"}