npm - @traefik-labs/faency - Versions diffs - 12.3.9 → 13.0.0 - Mend

@traefik-labs/faency 12.3.9 → 13.0.0

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

package/dist/components/Table/Table.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.cjs","names":[],"sources":["../../../components/Table/Table.tsx"],"sourcesContent":["import { ChevronRightIcon } from '@radix-ui/react-icons';\nimport React, { ComponentProps, ElementRef, forwardRef, ReactNode, useMemo, useState } from 'react';\n\nimport { styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { elevationVariants } from '../Elevation';\nimport { Flex } from '../Flex';\nimport { Label } from '../Label';\nimport { Text } from '../Text';\n\nexport const Caption = styled('caption', Text, {\n display: 'table-caption',\n textAlign: 'start',\n fontVariantNumeric: 'proportional-nums',\n fontWeight: '$medium',\n lineHeight: '1.25',\n});\n\nexport const Tbody = styled('tbody', {\n width: '100%',\n verticalAlign: 'middle',\n});\n\nexport const Th = styled('th', Label, {\n // override Label\n display: 'table-cell',\n verticalAlign: 'inherit',\n\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n\n textAlign: 'start',\n p: '$2 $3',\n borderBottom: '1px solid $tableRowBorder',\n\n variants: {\n align: {\n start: {\n textAlign: 'start',\n },\n center: {\n textAlign: 'center',\n },\n end: {\n textAlign: 'end',\n },\n },\n transform: {\n capitalize: {\n display: 'table-cell', // revert Label enforced value\n },\n },\n },\n defaultVariants: {\n align: 'start',\n },\n});\n\nexport const Td = styled('td', {\n boxSizing: 'border-box',\n p: '$5 $3',\n borderBottom: '1px solid $tableRowBorder',\n fontSize: '$3',\n lineHeight: '16px',\n verticalAlign: 'inherit',\n variants: {\n subtle: {\n true: {\n fontWeight: '$regular',\n color: '$tableSubtleText',\n },\n },\n align: {\n start: {\n textAlign: 'start',\n },\n center: {\n textAlign: 'center',\n },\n end: {\n textAlign: 'end',\n },\n },\n },\n defaultVariants: {\n align: 'start',\n },\n});\n\nexport const StyledTr = styled('tr', {\n verticalAlign: 'inherit',\n '&:hover': {\n color: '$tableHoverText',\n },\n [`&:last-child > ${Td}`]: {\n borderBottom: 'none',\n },\n\n variants: {\n interactive: {\n true: {\n '&:hover': {\n backgroundColor: '$tableHoverBackground',\n cursor: 'pointer',\n },\n },\n },\n active: {\n true: {\n backgroundColor: '$tableHoverBackground',\n color: '$tableActiveText',\n fontWeight: '$semiBold',\n },\n },\n },\n compoundVariants: [\n {\n interactive: true,\n active: true,\n css: {\n '&:hover': {\n color: '$tableActiveHoverText',\n },\n },\n },\n ],\n});\n\nconst AnimatedTr = ({\n collapsedContentColSpan,\n isOpen,\n children,\n}: {\n collapsedContentColSpan: number;\n isOpen: boolean;\n children: ReactNode;\n}) => {\n const appliedStyle = useMemo(\n () =>\n isOpen\n ? { transition: 'padding 0.2s ease-out' }\n : {\n transition: 'padding 0.2s ease-out',\n lineHeight: 0,\n fontSize: 0,\n padding: '0px 16px',\n border: 'none',\n },\n [isOpen],\n );\n\n const containerStyle = useMemo(\n () =>\n isOpen\n ? { transition: 'all 0.2s ease-out' }\n : {\n transition: 'all 0.2s ease-out',\n height: 0,\n overflow: 'hidden',\n },\n [isOpen],\n );\n\n return (\n <Tr>\n <Td colSpan={collapsedContentColSpan} css={appliedStyle}>\n <Box css={containerStyle}>{children}</Box>\n </Td>\n </Tr>\n );\n};\nexport type TrProps = ComponentProps<typeof StyledTr> &\n VariantProps<typeof StyledTr> & {\n children: React.ReactNode;\n collapsedContent?: React.ReactNode;\n emptyFirstColumn?: boolean;\n tableHead?: boolean;\n collapsedContentColSpan?: number;\n };\n\nexport const Tr = forwardRef<ElementRef<typeof StyledTr>, TrProps>(\n (\n {\n children,\n collapsedContent,\n emptyFirstColumn = false,\n tableHead = false,\n collapsedContentColSpan = 1,\n css,\n ...props\n },\n ref,\n ) => {\n const [isCollapsed, setIsCollapsed] = useState(false);\n\n return (\n <>\n <StyledTr\n ref={ref}\n css={\n !!collapsedContent && !isCollapsed\n ? {\n ...css,\n [`&:nth-last-child(2) > ${Td}`]: {\n borderBottom: 'none',\n },\n }\n : { ...css }\n }\n {...props}\n >\n {emptyFirstColumn ? tableHead ? <Th css={{ width: 24 }} /> : <Td /> : null}\n {!!collapsedContent && (\n <Td\n css={{ padding: '0 0 0 $3' }}\n onClick={(e) => {\n e.stopPropagation();\n e.preventDefault();\n }}\n >\n <Flex\n align=\"center\"\n justify=\"center\"\n css={{\n height: '40px',\n '&:hover': {\n color: '$tableActiveText',\n },\n }}\n onClick={() => setIsCollapsed(!isCollapsed)}\n >\n <ChevronRightIcon\n style={{\n cursor: 'pointer',\n transition: 'transform 0.2s ease-out',\n transform: isCollapsed ? 'rotate(90deg)' : 'initial',\n }}\n />\n </Flex>\n </Td>\n )}\n {children}\n </StyledTr>\n {!!collapsedContent && (\n <AnimatedTr isOpen={isCollapsed} collapsedContentColSpan={collapsedContentColSpan}>\n {collapsedContent}\n </AnimatedTr>\n )}\n </>\n );\n },\n);\n\nexport const Tfoot = styled('tfoot', {\n verticalAlign: 'middle',\n position: 'relative',\n borderRadius: 'inherit',\n\n '&::after': {\n pointerEvents: 'none',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n backgroundColor: '$tableFooterLayerBackground',\n borderRadius: 'inherit',\n },\n\n [`& ${Td}`]: {\n fontSize: '$1',\n color: '$tableHeaderText',\n fontWeight: '$light',\n p: '$2 $3',\n },\n});\n\nexport const Thead = styled('thead', {\n position: 'relative',\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n verticalAlign: 'middle',\n\n '&::after': {\n pointerEvents: 'none',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n backgroundColor: '$tableHeaderLayerBackground',\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n },\n\n [`& ${Th}`]: {\n fontSize: '$1',\n color: '$tableHeaderText',\n fontWeight: '$light',\n },\n});\n\nexport const Table = styled('table', {\n width: '100%',\n tableLayout: 'fixed',\n boxSizing: 'border-box',\n borderCollapse: 'separate',\n borderSpacing: 0,\n fontFamily: '$rubik',\n color: '$tableText',\n borderRadius: '$3',\n overflow: 'hidden',\n [`& ${Tbody}:not(:empty) ~ ${Tfoot}`]: {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n [`& ${Td}`]: {\n borderTop: '1px solid $tableRowBorder',\n },\n },\n [`& ${Thead}:not(:empty) ~ ${Tfoot}`]: {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n },\n\n variants: {\n elevation: elevationVariants,\n },\n defaultVariants: {\n elevation: 1,\n },\n});\n\nexport type TableVariants = VariantProps<typeof Table>;\nexport type TableProps = TableVariants & NonNullable<unknown>;\n"],"mappings":"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"}
1	+ {"version":3,"file":"Table.cjs","names":["styled","Text","Label","useMemo","Box","forwardRef","useState","_Fragment","Flex","ChevronRightIcon","elevationVariants"],"sources":["../../../components/Table/Table.tsx"],"sourcesContent":["import { ChevronRightIcon } from '@radix-ui/react-icons';\nimport React, { ComponentProps, ElementRef, forwardRef, ReactNode, useMemo, useState } from 'react';\n\nimport { styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { elevationVariants } from '../Elevation';\nimport { Flex } from '../Flex';\nimport { Label } from '../Label';\nimport { Text } from '../Text';\n\nexport const Caption = styled('caption', Text, {\n display: 'table-caption',\n textAlign: 'start',\n fontVariantNumeric: 'proportional-nums',\n fontWeight: '$medium',\n lineHeight: '1.25',\n});\n\nexport const Tbody = styled('tbody', {\n width: '100%',\n verticalAlign: 'middle',\n});\n\nexport const Th = styled('th', Label, {\n // override Label\n display: 'table-cell',\n verticalAlign: 'inherit',\n\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n\n textAlign: 'start',\n p: '$2 $3',\n borderBottom: '1px solid $tableRowBorder',\n\n variants: {\n align: {\n start: {\n textAlign: 'start',\n },\n center: {\n textAlign: 'center',\n },\n end: {\n textAlign: 'end',\n },\n },\n transform: {\n capitalize: {\n display: 'table-cell', // revert Label enforced value\n },\n },\n },\n defaultVariants: {\n align: 'start',\n },\n});\n\nexport const Td = styled('td', {\n boxSizing: 'border-box',\n p: '$5 $3',\n borderBottom: '1px solid $tableRowBorder',\n fontSize: '$3',\n lineHeight: '16px',\n verticalAlign: 'inherit',\n variants: {\n subtle: {\n true: {\n fontWeight: '$regular',\n color: '$tableSubtleText',\n },\n },\n align: {\n start: {\n textAlign: 'start',\n },\n center: {\n textAlign: 'center',\n },\n end: {\n textAlign: 'end',\n },\n },\n },\n defaultVariants: {\n align: 'start',\n },\n});\n\nexport const StyledTr = styled('tr', {\n verticalAlign: 'inherit',\n '&:hover': {\n color: '$tableHoverText',\n },\n [`&:last-child > ${Td}`]: {\n borderBottom: 'none',\n },\n\n variants: {\n interactive: {\n true: {\n '&:hover': {\n backgroundColor: '$tableHoverBackground',\n cursor: 'pointer',\n },\n },\n },\n active: {\n true: {\n backgroundColor: '$tableHoverBackground',\n color: '$tableActiveText',\n fontWeight: '$semiBold',\n },\n },\n },\n compoundVariants: [\n {\n interactive: true,\n active: true,\n css: {\n '&:hover': {\n color: '$tableActiveHoverText',\n },\n },\n },\n ],\n});\n\nconst AnimatedTr = ({\n collapsedContentColSpan,\n isOpen,\n children,\n}: {\n collapsedContentColSpan: number;\n isOpen: boolean;\n children: ReactNode;\n}) => {\n const appliedStyle = useMemo(\n () =>\n isOpen\n ? { transition: 'padding 0.2s ease-out' }\n : {\n transition: 'padding 0.2s ease-out',\n lineHeight: 0,\n fontSize: 0,\n padding: '0px 16px',\n border: 'none',\n },\n [isOpen],\n );\n\n const containerStyle = useMemo(\n () =>\n isOpen\n ? { transition: 'all 0.2s ease-out' }\n : {\n transition: 'all 0.2s ease-out',\n height: 0,\n overflow: 'hidden',\n },\n [isOpen],\n );\n\n return (\n <Tr>\n <Td colSpan={collapsedContentColSpan} css={appliedStyle}>\n <Box css={containerStyle}>{children}</Box>\n </Td>\n </Tr>\n );\n};\nexport type TrProps = ComponentProps<typeof StyledTr> &\n VariantProps<typeof StyledTr> & {\n children: React.ReactNode;\n collapsedContent?: React.ReactNode;\n emptyFirstColumn?: boolean;\n tableHead?: boolean;\n collapsedContentColSpan?: number;\n };\n\nexport const Tr = forwardRef<ElementRef<typeof StyledTr>, TrProps>(\n (\n {\n children,\n collapsedContent,\n emptyFirstColumn = false,\n tableHead = false,\n collapsedContentColSpan = 1,\n css,\n ...props\n },\n ref,\n ) => {\n const [isCollapsed, setIsCollapsed] = useState(false);\n\n return (\n <>\n <StyledTr\n ref={ref}\n css={\n !!collapsedContent && !isCollapsed\n ? {\n ...css,\n [`&:nth-last-child(2) > ${Td}`]: {\n borderBottom: 'none',\n },\n }\n : { ...css }\n }\n {...props}\n >\n {emptyFirstColumn ? tableHead ? <Th css={{ width: 24 }} /> : <Td /> : null}\n {!!collapsedContent && (\n <Td\n css={{ padding: '0 0 0 $3' }}\n onClick={(e) => {\n e.stopPropagation();\n e.preventDefault();\n }}\n >\n <Flex\n align=\"center\"\n justify=\"center\"\n css={{\n height: '40px',\n '&:hover': {\n color: '$tableActiveText',\n },\n }}\n onClick={() => setIsCollapsed(!isCollapsed)}\n >\n <ChevronRightIcon\n style={{\n cursor: 'pointer',\n transition: 'transform 0.2s ease-out',\n transform: isCollapsed ? 'rotate(90deg)' : 'initial',\n }}\n />\n </Flex>\n </Td>\n )}\n {children}\n </StyledTr>\n {!!collapsedContent && (\n <AnimatedTr isOpen={isCollapsed} collapsedContentColSpan={collapsedContentColSpan}>\n {collapsedContent}\n </AnimatedTr>\n )}\n </>\n );\n },\n);\n\nexport const Tfoot = styled('tfoot', {\n verticalAlign: 'middle',\n position: 'relative',\n borderRadius: 'inherit',\n\n '&::after': {\n pointerEvents: 'none',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n backgroundColor: '$tableFooterLayerBackground',\n borderRadius: 'inherit',\n },\n\n [`& ${Td}`]: {\n fontSize: '$1',\n color: '$tableHeaderText',\n fontWeight: '$light',\n p: '$2 $3',\n },\n});\n\nexport const Thead = styled('thead', {\n position: 'relative',\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n verticalAlign: 'middle',\n\n '&::after': {\n pointerEvents: 'none',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n backgroundColor: '$tableHeaderLayerBackground',\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n },\n\n [`& ${Th}`]: {\n fontSize: '$1',\n color: '$tableHeaderText',\n fontWeight: '$light',\n },\n});\n\nexport const Table = styled('table', {\n width: '100%',\n tableLayout: 'fixed',\n boxSizing: 'border-box',\n borderCollapse: 'separate',\n borderSpacing: 0,\n fontFamily: '$rubik',\n color: '$tableText',\n borderRadius: '$3',\n overflow: 'hidden',\n [`& ${Tbody}:not(:empty) ~ ${Tfoot}`]: {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n [`& ${Td}`]: {\n borderTop: '1px solid $tableRowBorder',\n },\n },\n [`& ${Thead}:not(:empty) ~ ${Tfoot}`]: {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n },\n\n variants: {\n elevation: elevationVariants,\n },\n defaultVariants: {\n elevation: 1,\n },\n});\n\nexport type TableVariants = VariantProps<typeof Table>;\nexport type TableProps = TableVariants & NonNullable<unknown>;\n"],"mappings":"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"}

package/dist/components/Table/Table.js CHANGED Viewed

@@ -7,7 +7,7 @@ import { Label } from "../Label/Label.js";
 import { ChevronRightIcon } from "@radix-ui/react-icons";
 import { forwardRef, useMemo, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-//#region components/Table/Table.tsx
+// components/Table/Table.tsx
 var Caption = styled("caption", Text, {
 	display: "table-caption",
 	textAlign: "start",
@@ -79,21 +79,23 @@ var StyledTr = styled("tr", {
 	}]
 });
 var AnimatedTr = ({ collapsedContentColSpan, isOpen, children }) => {
+	const appliedStyle = useMemo(() => isOpen ? { transition: "padding 0.2s ease-out" } : {
+		transition: "padding 0.2s ease-out",
+		lineHeight: 0,
+		fontSize: 0,
+		padding: "0px 16px",
+		border: "none"
+	}, [isOpen]);
+	const containerStyle = useMemo(() => isOpen ? { transition: "all 0.2s ease-out" } : {
+		transition: "all 0.2s ease-out",
+		height: 0,
+		overflow: "hidden"
+	}, [isOpen]);
 	return /* @__PURE__ */ jsx(Tr, { children: /* @__PURE__ */ jsx(Td, {
 		colSpan: collapsedContentColSpan,
-		css: useMemo(() => isOpen ? { transition: "padding 0.2s ease-out" } : {
-			transition: "padding 0.2s ease-out",
-			lineHeight: 0,
-			fontSize: 0,
-			padding: "0px 16px",
-			border: "none"
-		}, [isOpen]),
+		css: appliedStyle,
 		children: /* @__PURE__ */ jsx(Box, {
-			css: useMemo(() => isOpen ? { transition: "all 0.2s ease-out" } : {
-				transition: "all 0.2s ease-out",
-				height: 0,
-				overflow: "hidden"
-			}, [isOpen]),
+			css: containerStyle,
 			children
 		})
 	}) });
@@ -199,7 +201,6 @@ var Table = styled("table", {
 	variants: { elevation: elevationVariants },
 	defaultVariants: { elevation: 1 }
 });
-//#endregion
 export { Caption, StyledTr, Table, Tbody, Td, Tfoot, Th, Thead, Tr };
 //# sourceMappingURL=Table.js.map

package/dist/components/Table/Table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.js","names":[],"sources":["../../../components/Table/Table.tsx"],"sourcesContent":["import { ChevronRightIcon } from '@radix-ui/react-icons';\nimport React, { ComponentProps, ElementRef, forwardRef, ReactNode, useMemo, useState } from 'react';\n\nimport { styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { elevationVariants } from '../Elevation';\nimport { Flex } from '../Flex';\nimport { Label } from '../Label';\nimport { Text } from '../Text';\n\nexport const Caption = styled('caption', Text, {\n display: 'table-caption',\n textAlign: 'start',\n fontVariantNumeric: 'proportional-nums',\n fontWeight: '$medium',\n lineHeight: '1.25',\n});\n\nexport const Tbody = styled('tbody', {\n width: '100%',\n verticalAlign: 'middle',\n});\n\nexport const Th = styled('th', Label, {\n // override Label\n display: 'table-cell',\n verticalAlign: 'inherit',\n\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n\n textAlign: 'start',\n p: '$2 $3',\n borderBottom: '1px solid $tableRowBorder',\n\n variants: {\n align: {\n start: {\n textAlign: 'start',\n },\n center: {\n textAlign: 'center',\n },\n end: {\n textAlign: 'end',\n },\n },\n transform: {\n capitalize: {\n display: 'table-cell', // revert Label enforced value\n },\n },\n },\n defaultVariants: {\n align: 'start',\n },\n});\n\nexport const Td = styled('td', {\n boxSizing: 'border-box',\n p: '$5 $3',\n borderBottom: '1px solid $tableRowBorder',\n fontSize: '$3',\n lineHeight: '16px',\n verticalAlign: 'inherit',\n variants: {\n subtle: {\n true: {\n fontWeight: '$regular',\n color: '$tableSubtleText',\n },\n },\n align: {\n start: {\n textAlign: 'start',\n },\n center: {\n textAlign: 'center',\n },\n end: {\n textAlign: 'end',\n },\n },\n },\n defaultVariants: {\n align: 'start',\n },\n});\n\nexport const StyledTr = styled('tr', {\n verticalAlign: 'inherit',\n '&:hover': {\n color: '$tableHoverText',\n },\n [`&:last-child > ${Td}`]: {\n borderBottom: 'none',\n },\n\n variants: {\n interactive: {\n true: {\n '&:hover': {\n backgroundColor: '$tableHoverBackground',\n cursor: 'pointer',\n },\n },\n },\n active: {\n true: {\n backgroundColor: '$tableHoverBackground',\n color: '$tableActiveText',\n fontWeight: '$semiBold',\n },\n },\n },\n compoundVariants: [\n {\n interactive: true,\n active: true,\n css: {\n '&:hover': {\n color: '$tableActiveHoverText',\n },\n },\n },\n ],\n});\n\nconst AnimatedTr = ({\n collapsedContentColSpan,\n isOpen,\n children,\n}: {\n collapsedContentColSpan: number;\n isOpen: boolean;\n children: ReactNode;\n}) => {\n const appliedStyle = useMemo(\n () =>\n isOpen\n ? { transition: 'padding 0.2s ease-out' }\n : {\n transition: 'padding 0.2s ease-out',\n lineHeight: 0,\n fontSize: 0,\n padding: '0px 16px',\n border: 'none',\n },\n [isOpen],\n );\n\n const containerStyle = useMemo(\n () =>\n isOpen\n ? { transition: 'all 0.2s ease-out' }\n : {\n transition: 'all 0.2s ease-out',\n height: 0,\n overflow: 'hidden',\n },\n [isOpen],\n );\n\n return (\n <Tr>\n <Td colSpan={collapsedContentColSpan} css={appliedStyle}>\n <Box css={containerStyle}>{children}</Box>\n </Td>\n </Tr>\n );\n};\nexport type TrProps = ComponentProps<typeof StyledTr> &\n VariantProps<typeof StyledTr> & {\n children: React.ReactNode;\n collapsedContent?: React.ReactNode;\n emptyFirstColumn?: boolean;\n tableHead?: boolean;\n collapsedContentColSpan?: number;\n };\n\nexport const Tr = forwardRef<ElementRef<typeof StyledTr>, TrProps>(\n (\n {\n children,\n collapsedContent,\n emptyFirstColumn = false,\n tableHead = false,\n collapsedContentColSpan = 1,\n css,\n ...props\n },\n ref,\n ) => {\n const [isCollapsed, setIsCollapsed] = useState(false);\n\n return (\n <>\n <StyledTr\n ref={ref}\n css={\n !!collapsedContent && !isCollapsed\n ? {\n ...css,\n [`&:nth-last-child(2) > ${Td}`]: {\n borderBottom: 'none',\n },\n }\n : { ...css }\n }\n {...props}\n >\n {emptyFirstColumn ? tableHead ? <Th css={{ width: 24 }} /> : <Td /> : null}\n {!!collapsedContent && (\n <Td\n css={{ padding: '0 0 0 $3' }}\n onClick={(e) => {\n e.stopPropagation();\n e.preventDefault();\n }}\n >\n <Flex\n align=\"center\"\n justify=\"center\"\n css={{\n height: '40px',\n '&:hover': {\n color: '$tableActiveText',\n },\n }}\n onClick={() => setIsCollapsed(!isCollapsed)}\n >\n <ChevronRightIcon\n style={{\n cursor: 'pointer',\n transition: 'transform 0.2s ease-out',\n transform: isCollapsed ? 'rotate(90deg)' : 'initial',\n }}\n />\n </Flex>\n </Td>\n )}\n {children}\n </StyledTr>\n {!!collapsedContent && (\n <AnimatedTr isOpen={isCollapsed} collapsedContentColSpan={collapsedContentColSpan}>\n {collapsedContent}\n </AnimatedTr>\n )}\n </>\n );\n },\n);\n\nexport const Tfoot = styled('tfoot', {\n verticalAlign: 'middle',\n position: 'relative',\n borderRadius: 'inherit',\n\n '&::after': {\n pointerEvents: 'none',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n backgroundColor: '$tableFooterLayerBackground',\n borderRadius: 'inherit',\n },\n\n [`& ${Td}`]: {\n fontSize: '$1',\n color: '$tableHeaderText',\n fontWeight: '$light',\n p: '$2 $3',\n },\n});\n\nexport const Thead = styled('thead', {\n position: 'relative',\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n verticalAlign: 'middle',\n\n '&::after': {\n pointerEvents: 'none',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n backgroundColor: '$tableHeaderLayerBackground',\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n },\n\n [`& ${Th}`]: {\n fontSize: '$1',\n color: '$tableHeaderText',\n fontWeight: '$light',\n },\n});\n\nexport const Table = styled('table', {\n width: '100%',\n tableLayout: 'fixed',\n boxSizing: 'border-box',\n borderCollapse: 'separate',\n borderSpacing: 0,\n fontFamily: '$rubik',\n color: '$tableText',\n borderRadius: '$3',\n overflow: 'hidden',\n [`& ${Tbody}:not(:empty) ~ ${Tfoot}`]: {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n [`& ${Td}`]: {\n borderTop: '1px solid $tableRowBorder',\n },\n },\n [`& ${Thead}:not(:empty) ~ ${Tfoot}`]: {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n },\n\n variants: {\n elevation: elevationVariants,\n },\n defaultVariants: {\n elevation: 1,\n },\n});\n\nexport type TableVariants = VariantProps<typeof Table>;\nexport type TableProps = TableVariants & NonNullable<unknown>;\n"],"mappings":"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"}
1	+ {"version":3,"file":"Table.js","names":["_Fragment"],"sources":["../../../components/Table/Table.tsx"],"sourcesContent":["import { ChevronRightIcon } from '@radix-ui/react-icons';\nimport React, { ComponentProps, ElementRef, forwardRef, ReactNode, useMemo, useState } from 'react';\n\nimport { styled, VariantProps } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { elevationVariants } from '../Elevation';\nimport { Flex } from '../Flex';\nimport { Label } from '../Label';\nimport { Text } from '../Text';\n\nexport const Caption = styled('caption', Text, {\n display: 'table-caption',\n textAlign: 'start',\n fontVariantNumeric: 'proportional-nums',\n fontWeight: '$medium',\n lineHeight: '1.25',\n});\n\nexport const Tbody = styled('tbody', {\n width: '100%',\n verticalAlign: 'middle',\n});\n\nexport const Th = styled('th', Label, {\n // override Label\n display: 'table-cell',\n verticalAlign: 'inherit',\n\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n\n textAlign: 'start',\n p: '$2 $3',\n borderBottom: '1px solid $tableRowBorder',\n\n variants: {\n align: {\n start: {\n textAlign: 'start',\n },\n center: {\n textAlign: 'center',\n },\n end: {\n textAlign: 'end',\n },\n },\n transform: {\n capitalize: {\n display: 'table-cell', // revert Label enforced value\n },\n },\n },\n defaultVariants: {\n align: 'start',\n },\n});\n\nexport const Td = styled('td', {\n boxSizing: 'border-box',\n p: '$5 $3',\n borderBottom: '1px solid $tableRowBorder',\n fontSize: '$3',\n lineHeight: '16px',\n verticalAlign: 'inherit',\n variants: {\n subtle: {\n true: {\n fontWeight: '$regular',\n color: '$tableSubtleText',\n },\n },\n align: {\n start: {\n textAlign: 'start',\n },\n center: {\n textAlign: 'center',\n },\n end: {\n textAlign: 'end',\n },\n },\n },\n defaultVariants: {\n align: 'start',\n },\n});\n\nexport const StyledTr = styled('tr', {\n verticalAlign: 'inherit',\n '&:hover': {\n color: '$tableHoverText',\n },\n [`&:last-child > ${Td}`]: {\n borderBottom: 'none',\n },\n\n variants: {\n interactive: {\n true: {\n '&:hover': {\n backgroundColor: '$tableHoverBackground',\n cursor: 'pointer',\n },\n },\n },\n active: {\n true: {\n backgroundColor: '$tableHoverBackground',\n color: '$tableActiveText',\n fontWeight: '$semiBold',\n },\n },\n },\n compoundVariants: [\n {\n interactive: true,\n active: true,\n css: {\n '&:hover': {\n color: '$tableActiveHoverText',\n },\n },\n },\n ],\n});\n\nconst AnimatedTr = ({\n collapsedContentColSpan,\n isOpen,\n children,\n}: {\n collapsedContentColSpan: number;\n isOpen: boolean;\n children: ReactNode;\n}) => {\n const appliedStyle = useMemo(\n () =>\n isOpen\n ? { transition: 'padding 0.2s ease-out' }\n : {\n transition: 'padding 0.2s ease-out',\n lineHeight: 0,\n fontSize: 0,\n padding: '0px 16px',\n border: 'none',\n },\n [isOpen],\n );\n\n const containerStyle = useMemo(\n () =>\n isOpen\n ? { transition: 'all 0.2s ease-out' }\n : {\n transition: 'all 0.2s ease-out',\n height: 0,\n overflow: 'hidden',\n },\n [isOpen],\n );\n\n return (\n <Tr>\n <Td colSpan={collapsedContentColSpan} css={appliedStyle}>\n <Box css={containerStyle}>{children}</Box>\n </Td>\n </Tr>\n );\n};\nexport type TrProps = ComponentProps<typeof StyledTr> &\n VariantProps<typeof StyledTr> & {\n children: React.ReactNode;\n collapsedContent?: React.ReactNode;\n emptyFirstColumn?: boolean;\n tableHead?: boolean;\n collapsedContentColSpan?: number;\n };\n\nexport const Tr = forwardRef<ElementRef<typeof StyledTr>, TrProps>(\n (\n {\n children,\n collapsedContent,\n emptyFirstColumn = false,\n tableHead = false,\n collapsedContentColSpan = 1,\n css,\n ...props\n },\n ref,\n ) => {\n const [isCollapsed, setIsCollapsed] = useState(false);\n\n return (\n <>\n <StyledTr\n ref={ref}\n css={\n !!collapsedContent && !isCollapsed\n ? {\n ...css,\n [`&:nth-last-child(2) > ${Td}`]: {\n borderBottom: 'none',\n },\n }\n : { ...css }\n }\n {...props}\n >\n {emptyFirstColumn ? tableHead ? <Th css={{ width: 24 }} /> : <Td /> : null}\n {!!collapsedContent && (\n <Td\n css={{ padding: '0 0 0 $3' }}\n onClick={(e) => {\n e.stopPropagation();\n e.preventDefault();\n }}\n >\n <Flex\n align=\"center\"\n justify=\"center\"\n css={{\n height: '40px',\n '&:hover': {\n color: '$tableActiveText',\n },\n }}\n onClick={() => setIsCollapsed(!isCollapsed)}\n >\n <ChevronRightIcon\n style={{\n cursor: 'pointer',\n transition: 'transform 0.2s ease-out',\n transform: isCollapsed ? 'rotate(90deg)' : 'initial',\n }}\n />\n </Flex>\n </Td>\n )}\n {children}\n </StyledTr>\n {!!collapsedContent && (\n <AnimatedTr isOpen={isCollapsed} collapsedContentColSpan={collapsedContentColSpan}>\n {collapsedContent}\n </AnimatedTr>\n )}\n </>\n );\n },\n);\n\nexport const Tfoot = styled('tfoot', {\n verticalAlign: 'middle',\n position: 'relative',\n borderRadius: 'inherit',\n\n '&::after': {\n pointerEvents: 'none',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n backgroundColor: '$tableFooterLayerBackground',\n borderRadius: 'inherit',\n },\n\n [`& ${Td}`]: {\n fontSize: '$1',\n color: '$tableHeaderText',\n fontWeight: '$light',\n p: '$2 $3',\n },\n});\n\nexport const Thead = styled('thead', {\n position: 'relative',\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n verticalAlign: 'middle',\n\n '&::after': {\n pointerEvents: 'none',\n content: '\"\"',\n position: 'absolute',\n inset: 0,\n backgroundColor: '$tableHeaderLayerBackground',\n borderTopLeftRadius: 'inherit',\n borderTopRightRadius: 'inherit',\n },\n\n [`& ${Th}`]: {\n fontSize: '$1',\n color: '$tableHeaderText',\n fontWeight: '$light',\n },\n});\n\nexport const Table = styled('table', {\n width: '100%',\n tableLayout: 'fixed',\n boxSizing: 'border-box',\n borderCollapse: 'separate',\n borderSpacing: 0,\n fontFamily: '$rubik',\n color: '$tableText',\n borderRadius: '$3',\n overflow: 'hidden',\n [`& ${Tbody}:not(:empty) ~ ${Tfoot}`]: {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n [`& ${Td}`]: {\n borderTop: '1px solid $tableRowBorder',\n },\n },\n [`& ${Thead}:not(:empty) ~ ${Tfoot}`]: {\n borderTopLeftRadius: '0',\n borderTopRightRadius: '0',\n },\n\n variants: {\n elevation: elevationVariants,\n },\n defaultVariants: {\n elevation: 1,\n },\n});\n\nexport type TableVariants = VariantProps<typeof Table>;\nexport type TableProps = TableVariants & NonNullable<unknown>;\n"],"mappings":"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"}

package/dist/components/Table/Table.themes.cjs CHANGED Viewed

@@ -1,7 +1,7 @@
 const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
 let tinycolor2 = require("tinycolor2");
 tinycolor2 = require_runtime.__toESM(tinycolor2, 1);
-//#region components/Table/Table.themes.ts
+// components/Table/Table.themes.ts
 var Theme;
 (function(_Theme) {
 	_Theme.getLight = (primaryColor) => ({
@@ -31,7 +31,6 @@ var Theme;
 		tableRowBorder: "hsl(209, 21%, 23%)"
 	});
 })(Theme || (Theme = {}));
-//#endregion
 Object.defineProperty(exports, "Theme", {
 	enumerable: true,
 	get: function() {

package/dist/components/Table/Table.themes.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.themes.cjs","names":[],"sources":["../../../components/Table/Table.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n tableText: Property.Color;\n tableSubtleText: Property.Color;\n tableHoverBackground: Property.BackgroundColor;\n tableActiveText: Property.Color;\n tableActiveHoverText: Property.Color;\n tableHeaderLayerBackground: Property.BackgroundColor;\n tableFooterLayerBackground: Property.BackgroundColor;\n tableHeaderText: Property.Color;\n tableFooterText: Property.Color;\n tableHoverText: Property.Color;\n tableRowBorder: Property.BorderBottomColor;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n tableText: tinycolor('black').setAlpha(0.74).toHslString(),\n tableSubtleText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableHeaderLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n tableFooterLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n tableHeaderText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableFooterText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableHoverBackground: tinycolor('black').setAlpha(0.04).toHslString(),\n tableHoverText: tinycolor('black').setAlpha(0.74).toHslString(),\n tableActiveText: primaryColor.value,\n tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n tableRowBorder: 'hsl(0, 0%, 87%)',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n tableText: tinycolor('white').setAlpha(0.74).toHslString(),\n tableSubtleText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableHeaderLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n tableFooterLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n tableHeaderText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableFooterText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableHoverBackground: tinycolor(primaryColor.value).setAlpha(0.04).toHslString(),\n tableHoverText: tinycolor('white').setAlpha(0.74).toHslString(),\n tableActiveText: '$primary',\n tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n tableRowBorder: 'hsl(209, 21%, 23%)',\n });\n}\n"],"mappings":";;;;AAKO,~~IAAA;;~~CAiBQ,OAAA,YAAqB,kBAAkB;EAClD,YAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAqB~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACzD,kBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAA2B~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,6BAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAsC~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,6BAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAsC~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,kBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAA2B~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,kBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAA2B~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,uBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAgC~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACpE,iBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAA0B~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC9D,iBAAiB,aAAa;EAC9B,uBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAgC~~,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,gBAAgB;CAClB;CAEa,OAAA,WAAoB,kBAAkB;EACjD,YAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAqB~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACzD,kBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAA2B~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,6BAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAsC~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,6BAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAsC~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,kBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAA2B~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,kBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAA2B~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,uBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAgC~~,aAAa,KAAK,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/E,iBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAA0B~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC9D,iBAAiB;EACjB,uBAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAgC~~,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,gBAAgB;CAClB;~~GACD~~,UAAA,QAAA,CAAA,EAAD"}
1	+ {"version":3,"file":"Table.themes.cjs","names":["tinycolor"],"sources":["../../../components/Table/Table.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n tableText: Property.Color;\n tableSubtleText: Property.Color;\n tableHoverBackground: Property.BackgroundColor;\n tableActiveText: Property.Color;\n tableActiveHoverText: Property.Color;\n tableHeaderLayerBackground: Property.BackgroundColor;\n tableFooterLayerBackground: Property.BackgroundColor;\n tableHeaderText: Property.Color;\n tableFooterText: Property.Color;\n tableHoverText: Property.Color;\n tableRowBorder: Property.BorderBottomColor;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n tableText: tinycolor('black').setAlpha(0.74).toHslString(),\n tableSubtleText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableHeaderLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n tableFooterLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n tableHeaderText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableFooterText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableHoverBackground: tinycolor('black').setAlpha(0.04).toHslString(),\n tableHoverText: tinycolor('black').setAlpha(0.74).toHslString(),\n tableActiveText: primaryColor.value,\n tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n tableRowBorder: 'hsl(0, 0%, 87%)',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n tableText: tinycolor('white').setAlpha(0.74).toHslString(),\n tableSubtleText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableHeaderLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n tableFooterLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n tableHeaderText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableFooterText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableHoverBackground: tinycolor(primaryColor.value).setAlpha(0.04).toHslString(),\n tableHoverText: tinycolor('white').setAlpha(0.74).toHslString(),\n tableActiveText: '$primary',\n tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n tableRowBorder: 'hsl(209, 21%, 23%)',\n });\n}\n"],"mappings":";;;;AAKO,IAAU;CAAV,SAAA,QAAA;CAiBQ,OAAA,YAAqB,kBAAkB;EAClD,YAAA,GAAWA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACzD,kBAAA,GAAiBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,6BAAA,GAA4BA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,6BAAA,GAA4BA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,kBAAA,GAAiBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,kBAAA,GAAiBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,uBAAA,GAAsBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACpE,iBAAA,GAAgBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC9D,iBAAiB,aAAa;EAC9B,uBAAA,GAAsBA,WAAAA,QAAAA,CAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,gBAAgB;CAClB;CAEa,OAAA,WAAoB,kBAAkB;EACjD,YAAA,GAAWA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACzD,kBAAA,GAAiBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,6BAAA,GAA4BA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,6BAAA,GAA4BA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,kBAAA,GAAiBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,kBAAA,GAAiBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,uBAAA,GAAsBA,WAAAA,QAAAA,CAAU,aAAa,KAAK,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/E,iBAAA,GAAgBA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC9D,iBAAiB;EACjB,uBAAA,GAAsBA,WAAAA,QAAAA,CAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,gBAAgB;CAClB;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/Table/Table.themes.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import tinycolor from "tinycolor2";
-//#region components/Table/Table.themes.ts
+// components/Table/Table.themes.ts
 var Theme;
 (function(_Theme) {
 	_Theme.getLight = (primaryColor) => ({
@@ -29,7 +29,6 @@ var Theme;
 		tableRowBorder: "hsl(209, 21%, 23%)"
 	});
 })(Theme || (Theme = {}));
-//#endregion
 export { Theme };
 //# sourceMappingURL=Table.themes.js.map

package/dist/components/Table/Table.themes.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table.themes.js","names":[],"sources":["../../../components/Table/Table.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n tableText: Property.Color;\n tableSubtleText: Property.Color;\n tableHoverBackground: Property.BackgroundColor;\n tableActiveText: Property.Color;\n tableActiveHoverText: Property.Color;\n tableHeaderLayerBackground: Property.BackgroundColor;\n tableFooterLayerBackground: Property.BackgroundColor;\n tableHeaderText: Property.Color;\n tableFooterText: Property.Color;\n tableHoverText: Property.Color;\n tableRowBorder: Property.BorderBottomColor;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n tableText: tinycolor('black').setAlpha(0.74).toHslString(),\n tableSubtleText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableHeaderLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n tableFooterLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n tableHeaderText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableFooterText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableHoverBackground: tinycolor('black').setAlpha(0.04).toHslString(),\n tableHoverText: tinycolor('black').setAlpha(0.74).toHslString(),\n tableActiveText: primaryColor.value,\n tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n tableRowBorder: 'hsl(0, 0%, 87%)',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n tableText: tinycolor('white').setAlpha(0.74).toHslString(),\n tableSubtleText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableHeaderLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n tableFooterLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n tableHeaderText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableFooterText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableHoverBackground: tinycolor(primaryColor.value).setAlpha(0.04).toHslString(),\n tableHoverText: tinycolor('white').setAlpha(0.74).toHslString(),\n tableActiveText: '$primary',\n tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n tableRowBorder: 'hsl(209, 21%, 23%)',\n });\n}\n"],"mappings":";;AAKO,~~IAAA;;~~CAiBQ,OAAA,YAAqB,kBAAkB;EAClD,WAAW,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACzD,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,4BAA4B,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,4BAA4B,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,sBAAsB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACpE,gBAAgB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC9D,iBAAiB,aAAa;EAC9B,sBAAsB,UAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,gBAAgB;CAClB;CAEa,OAAA,WAAoB,kBAAkB;EACjD,WAAW,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACzD,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,4BAA4B,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,4BAA4B,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,sBAAsB,UAAU,aAAa,KAAK,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/E,gBAAgB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC9D,iBAAiB;EACjB,sBAAsB,UAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,gBAAgB;CAClB;~~GACD~~,UAAA,QAAA,CAAA,EAAD"}
1	+ {"version":3,"file":"Table.themes.js","names":[],"sources":["../../../components/Table/Table.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n tableText: Property.Color;\n tableSubtleText: Property.Color;\n tableHoverBackground: Property.BackgroundColor;\n tableActiveText: Property.Color;\n tableActiveHoverText: Property.Color;\n tableHeaderLayerBackground: Property.BackgroundColor;\n tableFooterLayerBackground: Property.BackgroundColor;\n tableHeaderText: Property.Color;\n tableFooterText: Property.Color;\n tableHoverText: Property.Color;\n tableRowBorder: Property.BorderBottomColor;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = (primaryColor) => ({\n tableText: tinycolor('black').setAlpha(0.74).toHslString(),\n tableSubtleText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableHeaderLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n tableFooterLayerBackground: tinycolor('black').setAlpha(0.03).toHslString(),\n tableHeaderText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableFooterText: tinycolor('black').setAlpha(0.51).toHslString(),\n tableHoverBackground: tinycolor('black').setAlpha(0.04).toHslString(),\n tableHoverText: tinycolor('black').setAlpha(0.74).toHslString(),\n tableActiveText: primaryColor.value,\n tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n tableRowBorder: 'hsl(0, 0%, 87%)',\n });\n\n export const getDark: Factory = (primaryColor) => ({\n tableText: tinycolor('white').setAlpha(0.74).toHslString(),\n tableSubtleText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableHeaderLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n tableFooterLayerBackground: tinycolor('white').setAlpha(0.02).toHslString(),\n tableHeaderText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableFooterText: tinycolor('white').setAlpha(0.51).toHslString(),\n tableHoverBackground: tinycolor(primaryColor.value).setAlpha(0.04).toHslString(),\n tableHoverText: tinycolor('white').setAlpha(0.74).toHslString(),\n tableActiveText: '$primary',\n tableActiveHoverText: tinycolor(primaryColor.value).lighten(10).toHslString(),\n tableRowBorder: 'hsl(209, 21%, 23%)',\n });\n}\n"],"mappings":";;AAKO,IAAU;CAAV,SAAA,QAAA;CAiBQ,OAAA,YAAqB,kBAAkB;EAClD,WAAW,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACzD,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,4BAA4B,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,4BAA4B,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,sBAAsB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACpE,gBAAgB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC9D,iBAAiB,aAAa;EAC9B,sBAAsB,UAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,gBAAgB;CAClB;CAEa,OAAA,WAAoB,kBAAkB;EACjD,WAAW,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EACzD,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,4BAA4B,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,4BAA4B,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1E,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,iBAAiB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/D,sBAAsB,UAAU,aAAa,KAAK,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC/E,gBAAgB,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC9D,iBAAiB;EACjB,sBAAsB,UAAU,aAAa,KAAK,CAAC,CAAC,QAAQ,EAAE,CAAC,CAAC,YAAY;EAC5E,gBAAgB;CAClB;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/Tabs/Tabs.cjs CHANGED Viewed

@@ -2,7 +2,7 @@ const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
 const require_stitches_config = require("../../stitches.config.cjs");
 let _radix_ui_react_tabs = require("@radix-ui/react-tabs");
 _radix_ui_react_tabs = require_runtime.__toESM(_radix_ui_react_tabs, 1);
-//#region components/Tabs/Tabs.tsx
+// components/Tabs/Tabs.tsx
 var TabsContainer = require_stitches_config.styled(_radix_ui_react_tabs.Root, {
 	display: "flex",
 	flexDirection: "column"
@@ -32,7 +32,6 @@ var TabsTrigger = require_stitches_config.styled(_radix_ui_react_tabs.Trigger, {
 	}
 });
 var TabsContent = require_stitches_config.styled(_radix_ui_react_tabs.Content, { width: "100%" });
-//#endregion
 exports.TabsContainer = TabsContainer;
 exports.TabsContent = TabsContent;
 exports.TabsList = TabsList;

package/dist/components/Tabs/Tabs.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Tabs.cjs","names":[],"sources":["../../../components/Tabs/Tabs.tsx"],"sourcesContent":["import * as TabsPrimitive from '@radix-ui/react-tabs';\n\nimport { styled } from '../../stitches.config';\n\nexport const TabsContainer = styled(TabsPrimitive.Root, {\n display: 'flex',\n flexDirection: 'column',\n});\n\nexport const TabsList = styled(TabsPrimitive.List, {\n display: 'flex',\n borderBottom: `1px solid $textSubtle`,\n});\n\nexport const TabsTrigger = styled(TabsPrimitive.Trigger, {\n all: 'unset',\n color: '$textSubtle',\n fontFamily: 'inherit',\n flex: 1,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n py: '$2',\n userSelect: 'none',\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n color: '$hiContrast',\n },\n },\n '&[data-state=\"active\"]': {\n color: '$primary',\n boxShadow: 'inset 0 -1px 0 0 currentColor, 0 1px 0 0 currentColor',\n fontWeight: '$semiBold',\n },\n});\n\nexport const TabsContent = styled(TabsPrimitive.Content, {\n width: '100%',\n});\n"],"mappings":";;;;;AAIA,IAAa,~~gBAAgB~~,~~wBAAA~~,~~OAAO~~,qBAAc,MAAM;CACtD,SAAS;CACT,eAAe;AACjB,CAAC;AAED,IAAa,~~WAAW~~,~~wBAAA~~,~~OAAO~~,qBAAc,MAAM;CACjD,SAAS;CACT,cAAc;AAChB,CAAC;AAED,IAAa,~~cAAc~~,~~wBAAA~~,~~OAAO~~,qBAAc,SAAS;CACvD,KAAK;CACL,OAAO;CACP,YAAY;CACZ,MAAM;CACN,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,IAAI;CACJ,YAAY;CACZ,UAAU,EACR,WAAW;EACT,QAAQ;EACR,OAAO;CACT,EACF;CACA,4BAA0B;EACxB,OAAO;EACP,WAAW;EACX,YAAY;CACd;AACF,CAAC;AAED,IAAa,~~cAAc~~,~~wBAAA~~,~~OAAO~~,qBAAc,SAAS,EACvD,OAAO,OACT,CAAC"}
1	+ {"version":3,"file":"Tabs.cjs","names":["styled","TabsPrimitive"],"sources":["../../../components/Tabs/Tabs.tsx"],"sourcesContent":["import * as TabsPrimitive from '@radix-ui/react-tabs';\n\nimport { styled } from '../../stitches.config';\n\nexport const TabsContainer = styled(TabsPrimitive.Root, {\n display: 'flex',\n flexDirection: 'column',\n});\n\nexport const TabsList = styled(TabsPrimitive.List, {\n display: 'flex',\n borderBottom: `1px solid $textSubtle`,\n});\n\nexport const TabsTrigger = styled(TabsPrimitive.Trigger, {\n all: 'unset',\n color: '$textSubtle',\n fontFamily: 'inherit',\n flex: 1,\n display: 'flex',\n alignItems: 'center',\n justifyContent: 'center',\n py: '$2',\n userSelect: 'none',\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n color: '$hiContrast',\n },\n },\n '&[data-state=\"active\"]': {\n color: '$primary',\n boxShadow: 'inset 0 -1px 0 0 currentColor, 0 1px 0 0 currentColor',\n fontWeight: '$semiBold',\n },\n});\n\nexport const TabsContent = styled(TabsPrimitive.Content, {\n width: '100%',\n});\n"],"mappings":";;;;;AAIA,IAAa,gBAAgBA,wBAAAA,OAAOC,qBAAc,MAAM;CACtD,SAAS;CACT,eAAe;AACjB,CAAC;AAED,IAAa,WAAWD,wBAAAA,OAAOC,qBAAc,MAAM;CACjD,SAAS;CACT,cAAc;AAChB,CAAC;AAED,IAAa,cAAcD,wBAAAA,OAAOC,qBAAc,SAAS;CACvD,KAAK;CACL,OAAO;CACP,YAAY;CACZ,MAAM;CACN,SAAS;CACT,YAAY;CACZ,gBAAgB;CAChB,IAAI;CACJ,YAAY;CACZ,UAAU,EACR,WAAW;EACT,QAAQ;EACR,OAAO;CACT,EACF;CACA,4BAA0B;EACxB,OAAO;EACP,WAAW;EACX,YAAY;CACd;AACF,CAAC;AAED,IAAa,cAAcD,wBAAAA,OAAOC,qBAAc,SAAS,EACvD,OAAO,OACT,CAAC"}

package/dist/components/Tabs/Tabs.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { styled } from "../../stitches.config.js";
 import * as TabsPrimitive from "@radix-ui/react-tabs";
-//#region components/Tabs/Tabs.tsx
+// components/Tabs/Tabs.tsx
 var TabsContainer = styled(TabsPrimitive.Root, {
 	display: "flex",
 	flexDirection: "column"
@@ -30,7 +30,6 @@ var TabsTrigger = styled(TabsPrimitive.Trigger, {
 	}
 });
 var TabsContent = styled(TabsPrimitive.Content, { width: "100%" });
-//#endregion
 export { TabsContainer, TabsContent, TabsList, TabsTrigger };
 //# sourceMappingURL=Tabs.js.map

package/dist/components/Text/Text.cjs CHANGED Viewed

@@ -1,4 +1,4 @@
-//#region components/Text/Text.tsx
+// components/Text/Text.tsx
 var Text = require("../../stitches.config.cjs").styled("span", {
 	lineHeight: "1",
 	margin: "0",
@@ -60,7 +60,6 @@ var Text = require("../../stitches.config.cjs").styled("span", {
 		variant: "default"
 	}
 });
-//#endregion
 exports.Text = Text;
 //# sourceMappingURL=Text.cjs.map

package/dist/components/Text/Text.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Text.cjs","names":[],"sources":["../../../components/Text/Text.tsx"],"sourcesContent":["import { CSS, styled, VariantProps } from '../../stitches.config';\n\nexport const Text = styled('span', {\n // Reset\n lineHeight: '1',\n margin: '0',\n fontFamily: '$rubik',\n fontVariantNumeric: 'tabular-nums',\n display: 'inline-block',\n\n variants: {\n size: {\n '0': {\n fontSize: '$0',\n },\n '1': {\n fontSize: '$1',\n },\n '2': {\n fontSize: '$2',\n },\n '3': {\n fontSize: '$3',\n },\n '4': {\n fontSize: '$4',\n },\n '5': {\n fontSize: '$5',\n },\n '6': {\n fontSize: '$6',\n },\n '7': {\n fontSize: '$7',\n },\n '8': {\n fontSize: '$8',\n },\n '9': {\n fontSize: '$9',\n },\n '10': {\n fontSize: '$10',\n },\n '11': {\n fontSize: '$11',\n },\n '12': {\n fontSize: '$12',\n },\n inherit: {\n fontSize: 'inherit',\n },\n },\n weight: {\n light: {\n fontWeight: '$light',\n },\n regular: {\n fontWeight: '$regular',\n },\n medium: {\n fontWeight: '$medium',\n },\n semiBold: {\n fontWeight: '$semiBold',\n },\n bold: {\n fontWeight: '$bold',\n },\n },\n variant: {\n red: {\n color: '$textRed',\n },\n subtle: {\n color: '$textSubtle',\n },\n default: {\n color: '$textDefault',\n },\n contrast: {\n color: '$textContrast',\n },\n inherit: {\n color: 'inherit',\n },\n invalid: {\n color: '$textInvalid',\n },\n },\n gradient: {\n true: {\n WebkitBackgroundClip: 'text',\n WebkitTextFillColor: 'transparent',\n },\n },\n transform: {\n uppercase: {\n textTransform: 'uppercase',\n },\n capitalize: {\n // WARNING: this will only work with block elements (display block/inline-block)\n // @see https://developer.mozilla.org/en-US/docs/Web/CSS/::first-letter\n display: 'inline-block',\n '&::first-letter': {\n textTransform: 'uppercase',\n },\n },\n capitalizeWords: {\n textTransform: 'capitalize',\n },\n },\n noWrap: {\n true: {\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n },\n },\n },\n defaultVariants: {\n size: '3',\n variant: 'default',\n },\n});\n\nexport type TextVariants = VariantProps<typeof Text>;\nexport type TextProps = TextVariants & { css?: CSS };\n"],"mappings":";AAEA,IAAa,~~0CAAO~~,~~CAAA~~,~~CAAA~~,OAAO,QAAQ;CAEjC,YAAY;CACZ,QAAQ;CACR,YAAY;CACZ,oBAAoB;CACpB,SAAS;CAET,UAAU;EACR,MAAM;GACJ,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,MAAM,EACJ,UAAU,MACZ;GACA,MAAM,EACJ,UAAU,MACZ;GACA,MAAM,EACJ,UAAU,MACZ;GACA,SAAS,EACP,UAAU,UACZ;EACF;EACA,QAAQ;GACN,OAAO,EACL,YAAY,SACd;GACA,SAAS,EACP,YAAY,WACd;GACA,QAAQ,EACN,YAAY,UACd;GACA,UAAU,EACR,YAAY,YACd;GACA,MAAM,EACJ,YAAY,QACd;EACF;EACA,SAAS;GACP,KAAK,EACH,OAAO,WACT;GACA,QAAQ,EACN,OAAO,cACT;GACA,SAAS,EACP,OAAO,eACT;GACA,UAAU,EACR,OAAO,gBACT;GACA,SAAS,EACP,OAAO,UACT;GACA,SAAS,EACP,OAAO,eACT;EACF;EACA,UAAU,EACR,MAAM;GACJ,sBAAsB;GACtB,qBAAqB;EACvB,EACF;EACA,WAAW;GACT,WAAW,EACT,eAAe,YACjB;GACA,YAAY;IAGV,SAAS;IACT,mBAAmB,EACjB,eAAe,YACjB;GACF;GACA,iBAAiB,EACf,eAAe,aACjB;EACF;EACA,QAAQ,EACN,MAAM;GACJ,UAAU;GACV,cAAc;GACd,YAAY;EACd,EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,SAAS;CACX;AACF,CAAC"}
1	+ {"version":3,"file":"Text.cjs","names":["styled"],"sources":["../../../components/Text/Text.tsx"],"sourcesContent":["import { CSS, styled, VariantProps } from '../../stitches.config';\n\nexport const Text = styled('span', {\n // Reset\n lineHeight: '1',\n margin: '0',\n fontFamily: '$rubik',\n fontVariantNumeric: 'tabular-nums',\n display: 'inline-block',\n\n variants: {\n size: {\n '0': {\n fontSize: '$0',\n },\n '1': {\n fontSize: '$1',\n },\n '2': {\n fontSize: '$2',\n },\n '3': {\n fontSize: '$3',\n },\n '4': {\n fontSize: '$4',\n },\n '5': {\n fontSize: '$5',\n },\n '6': {\n fontSize: '$6',\n },\n '7': {\n fontSize: '$7',\n },\n '8': {\n fontSize: '$8',\n },\n '9': {\n fontSize: '$9',\n },\n '10': {\n fontSize: '$10',\n },\n '11': {\n fontSize: '$11',\n },\n '12': {\n fontSize: '$12',\n },\n inherit: {\n fontSize: 'inherit',\n },\n },\n weight: {\n light: {\n fontWeight: '$light',\n },\n regular: {\n fontWeight: '$regular',\n },\n medium: {\n fontWeight: '$medium',\n },\n semiBold: {\n fontWeight: '$semiBold',\n },\n bold: {\n fontWeight: '$bold',\n },\n },\n variant: {\n red: {\n color: '$textRed',\n },\n subtle: {\n color: '$textSubtle',\n },\n default: {\n color: '$textDefault',\n },\n contrast: {\n color: '$textContrast',\n },\n inherit: {\n color: 'inherit',\n },\n invalid: {\n color: '$textInvalid',\n },\n },\n gradient: {\n true: {\n WebkitBackgroundClip: 'text',\n WebkitTextFillColor: 'transparent',\n },\n },\n transform: {\n uppercase: {\n textTransform: 'uppercase',\n },\n capitalize: {\n // WARNING: this will only work with block elements (display block/inline-block)\n // @see https://developer.mozilla.org/en-US/docs/Web/CSS/::first-letter\n display: 'inline-block',\n '&::first-letter': {\n textTransform: 'uppercase',\n },\n },\n capitalizeWords: {\n textTransform: 'capitalize',\n },\n },\n noWrap: {\n true: {\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n },\n },\n },\n defaultVariants: {\n size: '3',\n variant: 'default',\n },\n});\n\nexport type TextVariants = VariantProps<typeof Text>;\nexport type TextProps = TextVariants & { css?: CSS };\n"],"mappings":";AAEA,IAAa,O,mCAAOA,CAAAA,CAAAA,OAAO,QAAQ;CAEjC,YAAY;CACZ,QAAQ;CACR,YAAY;CACZ,oBAAoB;CACpB,SAAS;CAET,UAAU;EACR,MAAM;GACJ,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,KAAK,EACH,UAAU,KACZ;GACA,MAAM,EACJ,UAAU,MACZ;GACA,MAAM,EACJ,UAAU,MACZ;GACA,MAAM,EACJ,UAAU,MACZ;GACA,SAAS,EACP,UAAU,UACZ;EACF;EACA,QAAQ;GACN,OAAO,EACL,YAAY,SACd;GACA,SAAS,EACP,YAAY,WACd;GACA,QAAQ,EACN,YAAY,UACd;GACA,UAAU,EACR,YAAY,YACd;GACA,MAAM,EACJ,YAAY,QACd;EACF;EACA,SAAS;GACP,KAAK,EACH,OAAO,WACT;GACA,QAAQ,EACN,OAAO,cACT;GACA,SAAS,EACP,OAAO,eACT;GACA,UAAU,EACR,OAAO,gBACT;GACA,SAAS,EACP,OAAO,UACT;GACA,SAAS,EACP,OAAO,eACT;EACF;EACA,UAAU,EACR,MAAM;GACJ,sBAAsB;GACtB,qBAAqB;EACvB,EACF;EACA,WAAW;GACT,WAAW,EACT,eAAe,YACjB;GACA,YAAY;IAGV,SAAS;IACT,mBAAmB,EACjB,eAAe,YACjB;GACF;GACA,iBAAiB,EACf,eAAe,aACjB;EACF;EACA,QAAQ,EACN,MAAM;GACJ,UAAU;GACV,cAAc;GACd,YAAY;EACd,EACF;CACF;CACA,iBAAiB;EACf,MAAM;EACN,SAAS;CACX;AACF,CAAC"}

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

@@ -1,5 +1,5 @@
 import { styled } from "../../stitches.config.js";
-//#region components/Text/Text.tsx
+// components/Text/Text.tsx
 var Text = styled("span", {
 	lineHeight: "1",
 	margin: "0",
@@ -61,7 +61,6 @@ var Text = styled("span", {
 		variant: "default"
 	}
 });
-//#endregion
 export { Text };
 //# sourceMappingURL=Text.js.map

package/dist/components/Text/Text.themes.cjs CHANGED Viewed

@@ -1,7 +1,7 @@
 const require_runtime = require("../../_virtual/_rolldown/runtime.cjs");
 let tinycolor2 = require("tinycolor2");
 tinycolor2 = require_runtime.__toESM(tinycolor2, 1);
-//#region components/Text/Text.themes.ts
+// components/Text/Text.themes.ts
 var Theme;
 (function(_Theme) {
 	_Theme.getLight = () => ({
@@ -19,7 +19,6 @@ var Theme;
 		textRed: "$red10"
 	});
 })(Theme || (Theme = {}));
-//#endregion
 Object.defineProperty(exports, "Theme", {
 	enumerable: true,
 	get: function() {

package/dist/components/Text/Text.themes.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Text.themes.cjs","names":[],"sources":["../../../components/Text/Text.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n textSubtle: Property.Color;\n textDefault: Property.Color;\n textContrast: Property.Color;\n textInvalid: Property.Color;\n textRed: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n textSubtle: tinycolor('black').setAlpha(0.51).toHslString(),\n textDefault: tinycolor('black').setAlpha(0.74).toHslString(),\n textContrast: 'black',\n textInvalid: '$red9',\n textRed: '$red10',\n });\n\n export const getDark: Factory = () => ({\n textSubtle: tinycolor('white').setAlpha(0.51).toHslString(),\n textDefault: tinycolor('white').setAlpha(0.74).toHslString(),\n textContrast: 'white',\n textInvalid: '$red9',\n textRed: '$red10',\n });\n}\n"],"mappings":";;;;AAKO,~~IAAA;;~~CAWQ,OAAA,kBAA2B;EACtC,aAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAsB~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1D,cAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAuB~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC3D,cAAc;EACd,aAAa;EACb,SAAS;CACX;CAEa,OAAA,iBAA0B;EACrC,aAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAsB~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1D,cAAA,~~GAAA~~,~~WAAA~~,~~QAAA~~,~~CAAuB~~,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC3D,cAAc;EACd,aAAa;EACb,SAAS;CACX;~~GACD~~,UAAA,QAAA,CAAA,EAAD"}
1	+ {"version":3,"file":"Text.themes.cjs","names":["tinycolor"],"sources":["../../../components/Text/Text.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n textSubtle: Property.Color;\n textDefault: Property.Color;\n textContrast: Property.Color;\n textInvalid: Property.Color;\n textRed: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n textSubtle: tinycolor('black').setAlpha(0.51).toHslString(),\n textDefault: tinycolor('black').setAlpha(0.74).toHslString(),\n textContrast: 'black',\n textInvalid: '$red9',\n textRed: '$red10',\n });\n\n export const getDark: Factory = () => ({\n textSubtle: tinycolor('white').setAlpha(0.51).toHslString(),\n textDefault: tinycolor('white').setAlpha(0.74).toHslString(),\n textContrast: 'white',\n textInvalid: '$red9',\n textRed: '$red10',\n });\n}\n"],"mappings":";;;;AAKO,IAAU;CAAV,SAAA,QAAA;CAWQ,OAAA,kBAA2B;EACtC,aAAA,GAAYA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1D,cAAA,GAAaA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC3D,cAAc;EACd,aAAa;EACb,SAAS;CACX;CAEa,OAAA,iBAA0B;EACrC,aAAA,GAAYA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1D,cAAA,GAAaA,WAAAA,QAAAA,CAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC3D,cAAc;EACd,aAAa;EACb,SAAS;CACX;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

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

@@ -1,5 +1,5 @@
 import tinycolor from "tinycolor2";
-//#region components/Text/Text.themes.ts
+// components/Text/Text.themes.ts
 var Theme;
 (function(_Theme) {
 	_Theme.getLight = () => ({
@@ -17,7 +17,6 @@ var Theme;
 		textRed: "$red10"
 	});
 })(Theme || (Theme = {}));
-//#endregion
 export { Theme };
 //# sourceMappingURL=Text.themes.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"Text.themes.js","names":[],"sources":["../../../components/Text/Text.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n textSubtle: Property.Color;\n textDefault: Property.Color;\n textContrast: Property.Color;\n textInvalid: Property.Color;\n textRed: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n textSubtle: tinycolor('black').setAlpha(0.51).toHslString(),\n textDefault: tinycolor('black').setAlpha(0.74).toHslString(),\n textContrast: 'black',\n textInvalid: '$red9',\n textRed: '$red10',\n });\n\n export const getDark: Factory = () => ({\n textSubtle: tinycolor('white').setAlpha(0.51).toHslString(),\n textDefault: tinycolor('white').setAlpha(0.74).toHslString(),\n textContrast: 'white',\n textInvalid: '$red9',\n textRed: '$red10',\n });\n}\n"],"mappings":";;AAKO,~~IAAA;;~~CAWQ,OAAA,kBAA2B;EACtC,YAAY,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1D,aAAa,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC3D,cAAc;EACd,aAAa;EACb,SAAS;CACX;CAEa,OAAA,iBAA0B;EACrC,YAAY,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1D,aAAa,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC3D,cAAc;EACd,aAAa;EACb,SAAS;CACX;~~GACD~~,UAAA,QAAA,CAAA,EAAD"}
1	+ {"version":3,"file":"Text.themes.js","names":[],"sources":["../../../components/Text/Text.themes.ts"],"sourcesContent":["import { Property } from '@stitches/react/types/css';\nimport tinycolor from 'tinycolor2';\n\nimport { ColorInfo } from '../../utils/getPrimaryColorInfo';\n\nexport namespace Theme {\n type Colors = {\n textSubtle: Property.Color;\n textDefault: Property.Color;\n textContrast: Property.Color;\n textInvalid: Property.Color;\n textRed: Property.Color;\n };\n\n type Factory = (primaryColor: ColorInfo) => Colors;\n\n export const getLight: Factory = () => ({\n textSubtle: tinycolor('black').setAlpha(0.51).toHslString(),\n textDefault: tinycolor('black').setAlpha(0.74).toHslString(),\n textContrast: 'black',\n textInvalid: '$red9',\n textRed: '$red10',\n });\n\n export const getDark: Factory = () => ({\n textSubtle: tinycolor('white').setAlpha(0.51).toHslString(),\n textDefault: tinycolor('white').setAlpha(0.74).toHslString(),\n textContrast: 'white',\n textInvalid: '$red9',\n textRed: '$red10',\n });\n}\n"],"mappings":";;AAKO,IAAU;CAAV,SAAA,QAAA;CAWQ,OAAA,kBAA2B;EACtC,YAAY,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1D,aAAa,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC3D,cAAc;EACd,aAAa;EACb,SAAS;CACX;CAEa,OAAA,iBAA0B;EACrC,YAAY,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC1D,aAAa,UAAU,OAAO,CAAC,CAAC,SAAS,GAAI,CAAC,CAAC,YAAY;EAC3D,cAAc;EACd,aAAa;EACb,SAAS;CACX;AACD,EAAA,CAAA,UAAA,QAAA,CAAA,EAAD"}

package/dist/components/TextField/TextField.cjs CHANGED Viewed

@@ -8,7 +8,7 @@ let _radix_ui_react_icons = require("@radix-ui/react-icons");
 let react = require("react");
 react = require_runtime.__toESM(react, 1);
 let react_jsx_runtime = require("react/jsx-runtime");
-//#region components/TextField/TextField.tsx
+// components/TextField/TextField.tsx
 var AdornmentGroup = require_stitches_config.styled("div", {
 	display: "flex",
 	flexDirection: "row",
@@ -121,7 +121,6 @@ var TextField = react.default.forwardRef(({ state, clearable, label: LabelOrComp
 		})]
 	});
 });
-//#endregion
 exports.TextField = TextField;
 //# sourceMappingURL=TextField.cjs.map

package/dist/components/TextField/TextField.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextField.cjs","names":[],"sources":["../../../components/TextField/TextField.tsx"],"sourcesContent":["import {\n CrossCircledIcon,\n ExclamationTriangleIcon,\n EyeClosedIcon,\n EyeOpenIcon,\n} from '@radix-ui/react-icons';\nimport React from 'react';\n\nimport { styled } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Input, InputHandle, InputProps, InputVariants } from '../Input';\nimport { Label } from '../Label';\nimport { Tooltip } from '../Tooltip';\n\n// TYPES\nexport interface TextFieldLabelProps {\n variant: 'invalid' \| 'subtle' \| 'contrast' \| 'default';\n htmlFor?: string;\n}\nexport type TextFieldProps = InputProps & {\n type?: string;\n clearable?: boolean;\n label?: string \| ((props: TextFieldLabelProps) => JSX.Element);\n};\n\nexport type TextFieldVariants = InputVariants;\n\n// COMPONENTS\nconst AdornmentGroup = styled('div', {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n});\n\nconst StyledExclamationTriangleIcon = styled(ExclamationTriangleIcon, {\n '& + *': {\n marginLeft: '$1',\n },\n});\n\nconst StyledEyeOpenIcon = styled(EyeOpenIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nconst StyledEyeClosedIcon = styled(EyeClosedIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nconst StyledCrossCircledIcon = styled(CrossCircledIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nexport const TextField = React.forwardRef<React.ElementRef<typeof Input>, TextFieldProps>(\n (\n {\n state,\n clearable,\n label: LabelOrComponent,\n id,\n type,\n disabled,\n readOnly,\n onBlur,\n onFocus,\n css,\n ...props\n },\n forwardedRef\n ) => {\n const inputRef = React.useRef<InputHandle \| null>(null);\n React.useImperativeHandle(forwardedRef, () => inputRef.current as InputHandle);\n\n const [inputHasFocus, setInputHasFocus] = React.useState(false);\n const [innerType, setInnerType] = React.useState(type);\n const isPasswordVisible = React.useMemo(() => innerType !== 'password', [innerType]);\n\n const invalid = React.useMemo(() => state === 'invalid', [state]);\n\n const labelVariant = React.useMemo(() => {\n if (disabled) {\n return 'subtle';\n }\n if (invalid) {\n return 'invalid';\n }\n if (inputHasFocus) {\n return 'contrast';\n }\n return 'default';\n }, [invalid, disabled, inputHasFocus]);\n\n const LabelNode = React.useMemo(() => {\n if (LabelOrComponent === undefined \|\| LabelOrComponent === null) {\n return null;\n }\n if (typeof LabelOrComponent === 'string') {\n return (\n <Label variant={labelVariant} htmlFor={id}>\n {LabelOrComponent}\n </Label>\n );\n }\n return <LabelOrComponent variant={labelVariant} htmlFor={id} />;\n }, [LabelOrComponent, labelVariant, id]);\n\n const isPasswordType = React.useMemo(() => type === 'password', [type]);\n\n const typeOrInnerType = React.useMemo(\n () => (isPasswordType ? innerType : type),\n [isPasswordType, type, innerType]\n );\n\n const hasInnerAdornment = React.useMemo(\n () => clearable \|\| isPasswordType \|\| invalid,\n [clearable, isPasswordType, invalid]\n );\n\n const hasAdornmentGroup = React.useMemo(\n () => (clearable && invalid) \|\| (clearable && isPasswordType) \|\| (invalid && isPasswordType),\n [clearable, invalid, isPasswordType]\n );\n\n const clearDisabled = React.useMemo(() => readOnly \|\| disabled, [readOnly, disabled]);\n\n const handleClear = React.useCallback(() => {\n const { current } = inputRef;\n if (current) {\n current.clear();\n }\n }, [inputRef]);\n\n const handleFocus = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n if (onFocus) {\n onFocus(e);\n }\n setInputHasFocus(true);\n },\n [onFocus, setInputHasFocus]\n );\n\n const handleBlur = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n if (onBlur) {\n onBlur(e);\n }\n setInputHasFocus(false);\n },\n [onBlur, setInputHasFocus]\n );\n\n const togglePasswordVisibility = React.useCallback(() => {\n setInnerType((prevInnerType) => (prevInnerType === 'password' ? undefined : 'password'));\n }, [setInnerType]);\n\n const EndAdornmentWrapper = React.useMemo(\n () => (hasAdornmentGroup ? AdornmentGroup : React.Fragment),\n [hasAdornmentGroup]\n );\n\n const PasswordVisibilityToggleIcon = React.useMemo(\n () => (isPasswordVisible ? StyledEyeClosedIcon : StyledEyeOpenIcon),\n [isPasswordVisible]\n );\n\n const passwordAction = React.useMemo(\n () => (isPasswordVisible ? 'Hide password' : 'Show password'),\n [isPasswordVisible]\n );\n\n return (\n <Box css={css}>\n {LabelNode}\n <Input\n id={id}\n ref={inputRef}\n endAdornment={\n hasInnerAdornment && (\n <EndAdornmentWrapper>\n {invalid && <StyledExclamationTriangleIcon role=\"alert\" aria-label=\"Invalid\" />}\n {isPasswordType && (\n <Tooltip content={passwordAction}>\n <PasswordVisibilityToggleIcon\n aria-label={passwordAction}\n onClick={togglePasswordVisibility}\n />\n </Tooltip>\n )}\n {clearable && !clearDisabled && (\n <Tooltip content=\"Clear\">\n <StyledCrossCircledIcon aria-label=\"Clear\" onClick={handleClear} />\n </Tooltip>\n )}\n </EndAdornmentWrapper>\n )\n }\n state={state}\n type={typeOrInnerType}\n disabled={disabled}\n readOnly={readOnly}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...props}\n />\n </Box>\n );\n }\n);\n"],"mappings":";;;;;;;;;;;AA4BA,IAAM,~~iBAAiB~~,~~wBAAA~~,OAAO,OAAO;CACnC,SAAS;CACT,eAAe;CACf,YAAY;AACd,CAAC;AAED,IAAM,~~gCAAgC~~,~~wBAAA~~,~~OAAO~~,~~sBAAA~~,yBAAyB,EACpE,SAAS,EACP,YAAY,KACd,EACF,CAAC;AAED,IAAM,~~oBAAoB~~,~~wBAAA~~,~~OAAO~~,~~sBAAA~~,aAAa,EAC5C,UAAU,EACR,WAAW,EACT,QAAQ,UACV,EACF,EACF,CAAC;AAED,IAAM,~~sBAAsB~~,~~wBAAA~~,~~OAAO~~,~~sBAAA~~,eAAe,EAChD,UAAU,EACR,WAAW,EACT,QAAQ,UACV,EACF,EACF,CAAC;AAED,IAAM,~~yBAAyB~~,~~wBAAA~~,~~OAAO~~,~~sBAAA~~,kBAAkB,EACtD,UAAU,EACR,WAAW,EACT,QAAQ,UACV,EACF,EACF,CAAC;AAED,IAAa,~~YAAY~~,~~MAAA~~,QAAM,YAE3B,EACE,OACA,WACA,OAAO,kBACP,IACA,MACA,UACA,UACA,QACA,SACA,KACA,GAAG,SAEL,iBACG;CACH,MAAM,~~WAAW~~,~~MAAA~~,QAAM,OAA2B,IAAI;CACtD,MAAA,QAAM,oBAAoB,oBAAoB,SAAS,OAAsB;CAE7E,MAAM,CAAC,eAAe,~~oBAAoB~~,~~MAAA~~,QAAM,SAAS,KAAK;CAC9D,MAAM,CAAC,WAAW,~~gBAAgB~~,~~MAAA~~,QAAM,SAAS,IAAI;CACrD,MAAM,~~oBAAoB~~,~~MAAA~~,QAAM,cAAc,cAAc,YAAY,CAAC,SAAS,CAAC;CAEnF,MAAM,~~UAAU~~,~~MAAA~~,QAAM,cAAc,UAAU,WAAW,CAAC,KAAK,CAAC;CAEhE,MAAM,~~eAAe~~,~~MAAA~~,QAAM,cAAc;EACvC,IAAI,UACF,OAAO;EAET,IAAI,SACF,OAAO;EAET,IAAI,eACF,OAAO;EAET,OAAO;CACT,GAAG;EAAC;EAAS;EAAU;CAAa,CAAC;CAErC,MAAM,~~YAAY~~,~~MAAA~~,QAAM,cAAc;EACpC,IAAI,qBAAqB,KAAA,KAAa,qBAAqB,MACzD,OAAO;EAET,IAAI,OAAO,qBAAqB,UAC9B,OACE,iBAAA,GAAA,kBAAA,IAAA,~~CAAC~~,~~cAAA~~,OAAD;GAAO,SAAS;GAAc,SAAS;~~aACpC~~;EACI,CAAA;EAGX,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD;GAAkB,SAAS;GAAc,SAAS;EAAK,CAAA;CAChE,GAAG;EAAC;EAAkB;EAAc;CAAE,CAAC;CAEvC,MAAM,~~iBAAiB~~,~~MAAA~~,QAAM,cAAc,SAAS,YAAY,CAAC,IAAI,CAAC;CAEtE,MAAM,~~kBAAkB~~,~~MAAA~~,QAAM,cACrB,iBAAiB,YAAY,MACpC;EAAC;EAAgB;EAAM;CAAS,CAClC;CAEA,MAAM,~~oBAAoB~~,~~MAAA~~,QAAM,cACxB,aAAa,kBAAkB,SACrC;EAAC;EAAW;EAAgB;CAAO,CACrC;CAEA,MAAM,~~oBAAoB~~,~~MAAA~~,QAAM,cACvB,aAAa,WAAa,aAAa,kBAAoB,WAAW,gBAC7E;EAAC;EAAW;EAAS;CAAc,CACrC;CAEA,MAAM,~~gBAAgB~~,~~MAAA~~,QAAM,cAAc,YAAY,UAAU,CAAC,UAAU,QAAQ,CAAC;CAEpF,MAAM,~~cAAc~~,~~MAAA~~,QAAM,kBAAkB;EAC1C,MAAM,EAAE,YAAY;EACpB,IAAI,SACF,QAAQ,MAAM;CAElB,GAAG,CAAC,QAAQ,CAAC;CAEb,MAAM,~~cAAc~~,~~MAAA~~,QAAM,aACvB,MAA0C;EACzC,IAAI,SACF,QAAQ,CAAC;EAEX,iBAAiB,IAAI;CACvB,GACA,CAAC,SAAS,gBAAgB,CAC5B;CAEA,MAAM,~~aAAa~~,~~MAAA~~,QAAM,aACtB,MAA0C;EACzC,IAAI,QACF,OAAO,CAAC;EAEV,iBAAiB,KAAK;CACxB,GACA,CAAC,QAAQ,gBAAgB,CAC3B;CAEA,MAAM,~~2BAA2B~~,~~MAAA~~,QAAM,kBAAkB;EACvD,cAAc,kBAAmB,kBAAkB,aAAa,KAAA,IAAY,UAAW;CACzF,GAAG,CAAC,YAAY,CAAC;CAEjB,MAAM,~~sBAAsB~~,~~MAAA~~,QAAM,cACzB,oBAAoB,~~iBAAiB~~,~~MAAA~~,QAAM,UAClD,CAAC,iBAAiB,CACpB;CAEA,MAAM,+BAA+B,~~MAAA~~,QAAM,cAClC,oBAAoB,sBAAsB,mBACjD,CAAC,iBAAiB,CACpB;CAEA,MAAM,~~iBAAiB~~,~~MAAA~~,QAAM,cACpB,oBAAoB,kBAAkB,iBAC7C,CAAC,iBAAiB,CACpB;CAEA,OACE,iBAAA,GAAA,kBAAA,KAAA,~~CAAC~~,~~YAAA~~,KAAD;EAAU;~~YAAV~~,CACG,WACD,iBAAA,GAAA,kBAAA,IAAA,~~CAAC~~,~~cAAA~~,OAAD;GACM;GACJ,KAAK;GACL,cACE,qBACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,qBAAD,EAAA,UAAA;IACG,WAAW,iBAAA,GAAA,kBAAA,IAAA,CAAC,+BAAD;KAA+B,MAAK;KAAQ,cAAW;IAAW,CAAA;IAC7E,kBACC,iBAAA,GAAA,kBAAA,IAAA,~~CAAC~~,~~gBAAA~~,SAAD;KAAS,SAAS;~~eAChB~~,iBAAA,GAAA,kBAAA,IAAA,CAAC,8BAAD;MACE,cAAY;MACZ,SAAS;KACV,CAAA;IACM,CAAA;IAEV,aAAa,CAAC,iBACb,iBAAA,GAAA,kBAAA,IAAA,~~CAAC~~,~~gBAAA~~,SAAD;KAAS,SAAQ;~~eACf~~,iBAAA,GAAA,kBAAA,IAAA,CAAC,wBAAD;MAAwB,cAAW;MAAQ,SAAS;KAAc,CAAA;IAC3D,CAAA;GAEQ,EAAA,CAAA;GAGlB;GACP,MAAM;GACI;GACA;GACV,SAAS;GACT,QAAQ;GACR,GAAI;EACL,CAAA,CACE;;AAET,CACF"}
1	+ {"version":3,"file":"TextField.cjs","names":["styled","ExclamationTriangleIcon","EyeOpenIcon","EyeClosedIcon","CrossCircledIcon","React","Label","Box","Input","Tooltip"],"sources":["../../../components/TextField/TextField.tsx"],"sourcesContent":["import {\n CrossCircledIcon,\n ExclamationTriangleIcon,\n EyeClosedIcon,\n EyeOpenIcon,\n} from '@radix-ui/react-icons';\nimport React from 'react';\n\nimport { styled } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Input, InputHandle, InputProps, InputVariants } from '../Input';\nimport { Label } from '../Label';\nimport { Tooltip } from '../Tooltip';\n\n// TYPES\nexport interface TextFieldLabelProps {\n variant: 'invalid' \| 'subtle' \| 'contrast' \| 'default';\n htmlFor?: string;\n}\nexport type TextFieldProps = InputProps & {\n type?: string;\n clearable?: boolean;\n label?: string \| ((props: TextFieldLabelProps) => JSX.Element);\n};\n\nexport type TextFieldVariants = InputVariants;\n\n// COMPONENTS\nconst AdornmentGroup = styled('div', {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n});\n\nconst StyledExclamationTriangleIcon = styled(ExclamationTriangleIcon, {\n '& + *': {\n marginLeft: '$1',\n },\n});\n\nconst StyledEyeOpenIcon = styled(EyeOpenIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nconst StyledEyeClosedIcon = styled(EyeClosedIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nconst StyledCrossCircledIcon = styled(CrossCircledIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nexport const TextField = React.forwardRef<React.ElementRef<typeof Input>, TextFieldProps>(\n (\n {\n state,\n clearable,\n label: LabelOrComponent,\n id,\n type,\n disabled,\n readOnly,\n onBlur,\n onFocus,\n css,\n ...props\n },\n forwardedRef\n ) => {\n const inputRef = React.useRef<InputHandle \| null>(null);\n React.useImperativeHandle(forwardedRef, () => inputRef.current as InputHandle);\n\n const [inputHasFocus, setInputHasFocus] = React.useState(false);\n const [innerType, setInnerType] = React.useState(type);\n const isPasswordVisible = React.useMemo(() => innerType !== 'password', [innerType]);\n\n const invalid = React.useMemo(() => state === 'invalid', [state]);\n\n const labelVariant = React.useMemo(() => {\n if (disabled) {\n return 'subtle';\n }\n if (invalid) {\n return 'invalid';\n }\n if (inputHasFocus) {\n return 'contrast';\n }\n return 'default';\n }, [invalid, disabled, inputHasFocus]);\n\n const LabelNode = React.useMemo(() => {\n if (LabelOrComponent === undefined \|\| LabelOrComponent === null) {\n return null;\n }\n if (typeof LabelOrComponent === 'string') {\n return (\n <Label variant={labelVariant} htmlFor={id}>\n {LabelOrComponent}\n </Label>\n );\n }\n return <LabelOrComponent variant={labelVariant} htmlFor={id} />;\n }, [LabelOrComponent, labelVariant, id]);\n\n const isPasswordType = React.useMemo(() => type === 'password', [type]);\n\n const typeOrInnerType = React.useMemo(\n () => (isPasswordType ? innerType : type),\n [isPasswordType, type, innerType]\n );\n\n const hasInnerAdornment = React.useMemo(\n () => clearable \|\| isPasswordType \|\| invalid,\n [clearable, isPasswordType, invalid]\n );\n\n const hasAdornmentGroup = React.useMemo(\n () => (clearable && invalid) \|\| (clearable && isPasswordType) \|\| (invalid && isPasswordType),\n [clearable, invalid, isPasswordType]\n );\n\n const clearDisabled = React.useMemo(() => readOnly \|\| disabled, [readOnly, disabled]);\n\n const handleClear = React.useCallback(() => {\n const { current } = inputRef;\n if (current) {\n current.clear();\n }\n }, [inputRef]);\n\n const handleFocus = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n if (onFocus) {\n onFocus(e);\n }\n setInputHasFocus(true);\n },\n [onFocus, setInputHasFocus]\n );\n\n const handleBlur = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n if (onBlur) {\n onBlur(e);\n }\n setInputHasFocus(false);\n },\n [onBlur, setInputHasFocus]\n );\n\n const togglePasswordVisibility = React.useCallback(() => {\n setInnerType((prevInnerType) => (prevInnerType === 'password' ? undefined : 'password'));\n }, [setInnerType]);\n\n const EndAdornmentWrapper = React.useMemo(\n () => (hasAdornmentGroup ? AdornmentGroup : React.Fragment),\n [hasAdornmentGroup]\n );\n\n const PasswordVisibilityToggleIcon = React.useMemo(\n () => (isPasswordVisible ? StyledEyeClosedIcon : StyledEyeOpenIcon),\n [isPasswordVisible]\n );\n\n const passwordAction = React.useMemo(\n () => (isPasswordVisible ? 'Hide password' : 'Show password'),\n [isPasswordVisible]\n );\n\n return (\n <Box css={css}>\n {LabelNode}\n <Input\n id={id}\n ref={inputRef}\n endAdornment={\n hasInnerAdornment && (\n <EndAdornmentWrapper>\n {invalid && <StyledExclamationTriangleIcon role=\"alert\" aria-label=\"Invalid\" />}\n {isPasswordType && (\n <Tooltip content={passwordAction}>\n <PasswordVisibilityToggleIcon\n aria-label={passwordAction}\n onClick={togglePasswordVisibility}\n />\n </Tooltip>\n )}\n {clearable && !clearDisabled && (\n <Tooltip content=\"Clear\">\n <StyledCrossCircledIcon aria-label=\"Clear\" onClick={handleClear} />\n </Tooltip>\n )}\n </EndAdornmentWrapper>\n )\n }\n state={state}\n type={typeOrInnerType}\n disabled={disabled}\n readOnly={readOnly}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...props}\n />\n </Box>\n );\n }\n);\n"],"mappings":";;;;;;;;;;;AA4BA,IAAM,iBAAiBA,wBAAAA,OAAO,OAAO;CACnC,SAAS;CACT,eAAe;CACf,YAAY;AACd,CAAC;AAED,IAAM,gCAAgCA,wBAAAA,OAAOC,sBAAAA,yBAAyB,EACpE,SAAS,EACP,YAAY,KACd,EACF,CAAC;AAED,IAAM,oBAAoBD,wBAAAA,OAAOE,sBAAAA,aAAa,EAC5C,UAAU,EACR,WAAW,EACT,QAAQ,UACV,EACF,EACF,CAAC;AAED,IAAM,sBAAsBF,wBAAAA,OAAOG,sBAAAA,eAAe,EAChD,UAAU,EACR,WAAW,EACT,QAAQ,UACV,EACF,EACF,CAAC;AAED,IAAM,yBAAyBH,wBAAAA,OAAOI,sBAAAA,kBAAkB,EACtD,UAAU,EACR,WAAW,EACT,QAAQ,UACV,EACF,EACF,CAAC;AAED,IAAa,YAAYC,MAAAA,QAAM,YAE3B,EACE,OACA,WACA,OAAO,kBACP,IACA,MACA,UACA,UACA,QACA,SACA,KACA,GAAG,SAEL,iBACG;CACH,MAAM,WAAWA,MAAAA,QAAM,OAA2B,IAAI;CACtD,MAAA,QAAM,oBAAoB,oBAAoB,SAAS,OAAsB;CAE7E,MAAM,CAAC,eAAe,oBAAoBA,MAAAA,QAAM,SAAS,KAAK;CAC9D,MAAM,CAAC,WAAW,gBAAgBA,MAAAA,QAAM,SAAS,IAAI;CACrD,MAAM,oBAAoBA,MAAAA,QAAM,cAAc,cAAc,YAAY,CAAC,SAAS,CAAC;CAEnF,MAAM,UAAUA,MAAAA,QAAM,cAAc,UAAU,WAAW,CAAC,KAAK,CAAC;CAEhE,MAAM,eAAeA,MAAAA,QAAM,cAAc;EACvC,IAAI,UACF,OAAO;EAET,IAAI,SACF,OAAO;EAET,IAAI,eACF,OAAO;EAET,OAAO;CACT,GAAG;EAAC;EAAS;EAAU;CAAa,CAAC;CAErC,MAAM,YAAYA,MAAAA,QAAM,cAAc;EACpC,IAAI,qBAAqB,KAAA,KAAa,qBAAqB,MACzD,OAAO;EAET,IAAI,OAAO,qBAAqB,UAC9B,OACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,cAAAA,OAAD;GAAO,SAAS;GAAc,SAAS;GACpC,UAAA;EACI,CAAA;EAGX,OAAO,iBAAA,GAAA,kBAAA,IAAA,CAAC,kBAAD;GAAkB,SAAS;GAAc,SAAS;EAAK,CAAA;CAChE,GAAG;EAAC;EAAkB;EAAc;CAAE,CAAC;CAEvC,MAAM,iBAAiBD,MAAAA,QAAM,cAAc,SAAS,YAAY,CAAC,IAAI,CAAC;CAEtE,MAAM,kBAAkBA,MAAAA,QAAM,cACrB,iBAAiB,YAAY,MACpC;EAAC;EAAgB;EAAM;CAAS,CAClC;CAEA,MAAM,oBAAoBA,MAAAA,QAAM,cACxB,aAAa,kBAAkB,SACrC;EAAC;EAAW;EAAgB;CAAO,CACrC;CAEA,MAAM,oBAAoBA,MAAAA,QAAM,cACvB,aAAa,WAAa,aAAa,kBAAoB,WAAW,gBAC7E;EAAC;EAAW;EAAS;CAAc,CACrC;CAEA,MAAM,gBAAgBA,MAAAA,QAAM,cAAc,YAAY,UAAU,CAAC,UAAU,QAAQ,CAAC;CAEpF,MAAM,cAAcA,MAAAA,QAAM,kBAAkB;EAC1C,MAAM,EAAE,YAAY;EACpB,IAAI,SACF,QAAQ,MAAM;CAElB,GAAG,CAAC,QAAQ,CAAC;CAEb,MAAM,cAAcA,MAAAA,QAAM,aACvB,MAA0C;EACzC,IAAI,SACF,QAAQ,CAAC;EAEX,iBAAiB,IAAI;CACvB,GACA,CAAC,SAAS,gBAAgB,CAC5B;CAEA,MAAM,aAAaA,MAAAA,QAAM,aACtB,MAA0C;EACzC,IAAI,QACF,OAAO,CAAC;EAEV,iBAAiB,KAAK;CACxB,GACA,CAAC,QAAQ,gBAAgB,CAC3B;CAEA,MAAM,2BAA2BA,MAAAA,QAAM,kBAAkB;EACvD,cAAc,kBAAmB,kBAAkB,aAAa,KAAA,IAAY,UAAW;CACzF,GAAG,CAAC,YAAY,CAAC;CAEjB,MAAM,sBAAsBA,MAAAA,QAAM,cACzB,oBAAoB,iBAAiBA,MAAAA,QAAM,UAClD,CAAC,iBAAiB,CACpB;CAEA,MAAM,+BAA+BA,MAAAA,QAAM,cAClC,oBAAoB,sBAAsB,mBACjD,CAAC,iBAAiB,CACpB;CAEA,MAAM,iBAAiBA,MAAAA,QAAM,cACpB,oBAAoB,kBAAkB,iBAC7C,CAAC,iBAAiB,CACpB;CAEA,OACE,iBAAA,GAAA,kBAAA,KAAA,CAACE,YAAAA,KAAD;EAAU;EAAV,UAAA,CACG,WACD,iBAAA,GAAA,kBAAA,IAAA,CAACC,cAAAA,OAAD;GACM;GACJ,KAAK;GACL,cACE,qBACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,qBAAD,EAAA,UAAA;IACG,WAAW,iBAAA,GAAA,kBAAA,IAAA,CAAC,+BAAD;KAA+B,MAAK;KAAQ,cAAW;IAAW,CAAA;IAC7E,kBACC,iBAAA,GAAA,kBAAA,IAAA,CAACC,gBAAAA,SAAD;KAAS,SAAS;KAChB,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,8BAAD;MACE,cAAY;MACZ,SAAS;KACV,CAAA;IACM,CAAA;IAEV,aAAa,CAAC,iBACb,iBAAA,GAAA,kBAAA,IAAA,CAACA,gBAAAA,SAAD;KAAS,SAAQ;KACf,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,wBAAD;MAAwB,cAAW;MAAQ,SAAS;KAAc,CAAA;IAC3D,CAAA;GAEQ,EAAA,CAAA;GAGlB;GACP,MAAM;GACI;GACA;GACV,SAAS;GACT,QAAQ;GACR,GAAI;EACL,CAAA,CACE;;AAET,CACF"}

package/dist/components/TextField/TextField.js CHANGED Viewed

@@ -6,7 +6,7 @@ import { Tooltip } from "../Tooltip/Tooltip.js";
 import { CrossCircledIcon, ExclamationTriangleIcon, EyeClosedIcon, EyeOpenIcon } from "@radix-ui/react-icons";
 import React from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
-//#region components/TextField/TextField.tsx
+// components/TextField/TextField.tsx
 var AdornmentGroup = styled("div", {
 	display: "flex",
 	flexDirection: "row",
@@ -119,7 +119,6 @@ var TextField = React.forwardRef(({ state, clearable, label: LabelOrComponent, i
 		})]
 	});
 });
-//#endregion
 export { TextField };
 //# sourceMappingURL=TextField.js.map

package/dist/components/TextField/TextField.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextField.js","names":[],"sources":["../../../components/TextField/TextField.tsx"],"sourcesContent":["import {\n CrossCircledIcon,\n ExclamationTriangleIcon,\n EyeClosedIcon,\n EyeOpenIcon,\n} from '@radix-ui/react-icons';\nimport React from 'react';\n\nimport { styled } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Input, InputHandle, InputProps, InputVariants } from '../Input';\nimport { Label } from '../Label';\nimport { Tooltip } from '../Tooltip';\n\n// TYPES\nexport interface TextFieldLabelProps {\n variant: 'invalid' \| 'subtle' \| 'contrast' \| 'default';\n htmlFor?: string;\n}\nexport type TextFieldProps = InputProps & {\n type?: string;\n clearable?: boolean;\n label?: string \| ((props: TextFieldLabelProps) => JSX.Element);\n};\n\nexport type TextFieldVariants = InputVariants;\n\n// COMPONENTS\nconst AdornmentGroup = styled('div', {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n});\n\nconst StyledExclamationTriangleIcon = styled(ExclamationTriangleIcon, {\n '& + *': {\n marginLeft: '$1',\n },\n});\n\nconst StyledEyeOpenIcon = styled(EyeOpenIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nconst StyledEyeClosedIcon = styled(EyeClosedIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nconst StyledCrossCircledIcon = styled(CrossCircledIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nexport const TextField = React.forwardRef<React.ElementRef<typeof Input>, TextFieldProps>(\n (\n {\n state,\n clearable,\n label: LabelOrComponent,\n id,\n type,\n disabled,\n readOnly,\n onBlur,\n onFocus,\n css,\n ...props\n },\n forwardedRef\n ) => {\n const inputRef = React.useRef<InputHandle \| null>(null);\n React.useImperativeHandle(forwardedRef, () => inputRef.current as InputHandle);\n\n const [inputHasFocus, setInputHasFocus] = React.useState(false);\n const [innerType, setInnerType] = React.useState(type);\n const isPasswordVisible = React.useMemo(() => innerType !== 'password', [innerType]);\n\n const invalid = React.useMemo(() => state === 'invalid', [state]);\n\n const labelVariant = React.useMemo(() => {\n if (disabled) {\n return 'subtle';\n }\n if (invalid) {\n return 'invalid';\n }\n if (inputHasFocus) {\n return 'contrast';\n }\n return 'default';\n }, [invalid, disabled, inputHasFocus]);\n\n const LabelNode = React.useMemo(() => {\n if (LabelOrComponent === undefined \|\| LabelOrComponent === null) {\n return null;\n }\n if (typeof LabelOrComponent === 'string') {\n return (\n <Label variant={labelVariant} htmlFor={id}>\n {LabelOrComponent}\n </Label>\n );\n }\n return <LabelOrComponent variant={labelVariant} htmlFor={id} />;\n }, [LabelOrComponent, labelVariant, id]);\n\n const isPasswordType = React.useMemo(() => type === 'password', [type]);\n\n const typeOrInnerType = React.useMemo(\n () => (isPasswordType ? innerType : type),\n [isPasswordType, type, innerType]\n );\n\n const hasInnerAdornment = React.useMemo(\n () => clearable \|\| isPasswordType \|\| invalid,\n [clearable, isPasswordType, invalid]\n );\n\n const hasAdornmentGroup = React.useMemo(\n () => (clearable && invalid) \|\| (clearable && isPasswordType) \|\| (invalid && isPasswordType),\n [clearable, invalid, isPasswordType]\n );\n\n const clearDisabled = React.useMemo(() => readOnly \|\| disabled, [readOnly, disabled]);\n\n const handleClear = React.useCallback(() => {\n const { current } = inputRef;\n if (current) {\n current.clear();\n }\n }, [inputRef]);\n\n const handleFocus = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n if (onFocus) {\n onFocus(e);\n }\n setInputHasFocus(true);\n },\n [onFocus, setInputHasFocus]\n );\n\n const handleBlur = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n if (onBlur) {\n onBlur(e);\n }\n setInputHasFocus(false);\n },\n [onBlur, setInputHasFocus]\n );\n\n const togglePasswordVisibility = React.useCallback(() => {\n setInnerType((prevInnerType) => (prevInnerType === 'password' ? undefined : 'password'));\n }, [setInnerType]);\n\n const EndAdornmentWrapper = React.useMemo(\n () => (hasAdornmentGroup ? AdornmentGroup : React.Fragment),\n [hasAdornmentGroup]\n );\n\n const PasswordVisibilityToggleIcon = React.useMemo(\n () => (isPasswordVisible ? StyledEyeClosedIcon : StyledEyeOpenIcon),\n [isPasswordVisible]\n );\n\n const passwordAction = React.useMemo(\n () => (isPasswordVisible ? 'Hide password' : 'Show password'),\n [isPasswordVisible]\n );\n\n return (\n <Box css={css}>\n {LabelNode}\n <Input\n id={id}\n ref={inputRef}\n endAdornment={\n hasInnerAdornment && (\n <EndAdornmentWrapper>\n {invalid && <StyledExclamationTriangleIcon role=\"alert\" aria-label=\"Invalid\" />}\n {isPasswordType && (\n <Tooltip content={passwordAction}>\n <PasswordVisibilityToggleIcon\n aria-label={passwordAction}\n onClick={togglePasswordVisibility}\n />\n </Tooltip>\n )}\n {clearable && !clearDisabled && (\n <Tooltip content=\"Clear\">\n <StyledCrossCircledIcon aria-label=\"Clear\" onClick={handleClear} />\n </Tooltip>\n )}\n </EndAdornmentWrapper>\n )\n }\n state={state}\n type={typeOrInnerType}\n disabled={disabled}\n readOnly={readOnly}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...props}\n />\n </Box>\n );\n }\n);\n"],"mappings":";;;;;;;;;AA4BA,IAAM,iBAAiB,OAAO,OAAO;CACnC,SAAS;CACT,eAAe;CACf,YAAY;AACd,CAAC;AAED,IAAM,gCAAgC,OAAO,yBAAyB,EACpE,SAAS,EACP,YAAY,KACd,EACF,CAAC;AAED,IAAM,oBAAoB,OAAO,aAAa,EAC5C,UAAU,EACR,WAAW,EACT,QAAQ,UACV,EACF,EACF,CAAC;AAED,IAAM,sBAAsB,OAAO,eAAe,EAChD,UAAU,EACR,WAAW,EACT,QAAQ,UACV,EACF,EACF,CAAC;AAED,IAAM,yBAAyB,OAAO,kBAAkB,EACtD,UAAU,EACR,WAAW,EACT,QAAQ,UACV,EACF,EACF,CAAC;AAED,IAAa,YAAY,MAAM,YAE3B,EACE,OACA,WACA,OAAO,kBACP,IACA,MACA,UACA,UACA,QACA,SACA,KACA,GAAG,SAEL,iBACG;CACH,MAAM,WAAW,MAAM,OAA2B,IAAI;CACtD,MAAM,oBAAoB,oBAAoB,SAAS,OAAsB;CAE7E,MAAM,CAAC,eAAe,oBAAoB,MAAM,SAAS,KAAK;CAC9D,MAAM,CAAC,WAAW,gBAAgB,MAAM,SAAS,IAAI;CACrD,MAAM,oBAAoB,MAAM,cAAc,cAAc,YAAY,CAAC,SAAS,CAAC;CAEnF,MAAM,UAAU,MAAM,cAAc,UAAU,WAAW,CAAC,KAAK,CAAC;CAEhE,MAAM,eAAe,MAAM,cAAc;EACvC,IAAI,UACF,OAAO;EAET,IAAI,SACF,OAAO;EAET,IAAI,eACF,OAAO;EAET,OAAO;CACT,GAAG;EAAC;EAAS;EAAU;CAAa,CAAC;CAErC,MAAM,YAAY,MAAM,cAAc;EACpC,IAAI,qBAAqB,KAAA,KAAa,qBAAqB,MACzD,OAAO;EAET,IAAI,OAAO,qBAAqB,UAC9B,OACE,oBAAC,OAAD;GAAO,SAAS;GAAc,SAAS;~~aACpC~~;EACI,CAAA;EAGX,OAAO,oBAAC,kBAAD;GAAkB,SAAS;GAAc,SAAS;EAAK,CAAA;CAChE,GAAG;EAAC;EAAkB;EAAc;CAAE,CAAC;CAEvC,MAAM,iBAAiB,MAAM,cAAc,SAAS,YAAY,CAAC,IAAI,CAAC;CAEtE,MAAM,kBAAkB,MAAM,cACrB,iBAAiB,YAAY,MACpC;EAAC;EAAgB;EAAM;CAAS,CAClC;CAEA,MAAM,oBAAoB,MAAM,cACxB,aAAa,kBAAkB,SACrC;EAAC;EAAW;EAAgB;CAAO,CACrC;CAEA,MAAM,oBAAoB,MAAM,cACvB,aAAa,WAAa,aAAa,kBAAoB,WAAW,gBAC7E;EAAC;EAAW;EAAS;CAAc,CACrC;CAEA,MAAM,gBAAgB,MAAM,cAAc,YAAY,UAAU,CAAC,UAAU,QAAQ,CAAC;CAEpF,MAAM,cAAc,MAAM,kBAAkB;EAC1C,MAAM,EAAE,YAAY;EACpB,IAAI,SACF,QAAQ,MAAM;CAElB,GAAG,CAAC,QAAQ,CAAC;CAEb,MAAM,cAAc,MAAM,aACvB,MAA0C;EACzC,IAAI,SACF,QAAQ,CAAC;EAEX,iBAAiB,IAAI;CACvB,GACA,CAAC,SAAS,gBAAgB,CAC5B;CAEA,MAAM,aAAa,MAAM,aACtB,MAA0C;EACzC,IAAI,QACF,OAAO,CAAC;EAEV,iBAAiB,KAAK;CACxB,GACA,CAAC,QAAQ,gBAAgB,CAC3B;CAEA,MAAM,2BAA2B,MAAM,kBAAkB;EACvD,cAAc,kBAAmB,kBAAkB,aAAa,KAAA,IAAY,UAAW;CACzF,GAAG,CAAC,YAAY,CAAC;CAEjB,MAAM,sBAAsB,MAAM,cACzB,oBAAoB,iBAAiB,MAAM,UAClD,CAAC,iBAAiB,CACpB;CAEA,MAAM,+BAA+B,MAAM,cAClC,oBAAoB,sBAAsB,mBACjD,CAAC,iBAAiB,CACpB;CAEA,MAAM,iBAAiB,MAAM,cACpB,oBAAoB,kBAAkB,iBAC7C,CAAC,iBAAiB,CACpB;CAEA,OACE,qBAAC,KAAD;EAAU;~~YAAV~~,CACG,WACD,oBAAC,OAAD;GACM;GACJ,KAAK;GACL,cACE,qBACE,qBAAC,qBAAD,EAAA,UAAA;IACG,WAAW,oBAAC,+BAAD;KAA+B,MAAK;KAAQ,cAAW;IAAW,CAAA;IAC7E,kBACC,oBAAC,SAAD;KAAS,SAAS;~~eAChB~~,oBAAC,8BAAD;MACE,cAAY;MACZ,SAAS;KACV,CAAA;IACM,CAAA;IAEV,aAAa,CAAC,iBACb,oBAAC,SAAD;KAAS,SAAQ;~~eACf~~,oBAAC,wBAAD;MAAwB,cAAW;MAAQ,SAAS;KAAc,CAAA;IAC3D,CAAA;GAEQ,EAAA,CAAA;GAGlB;GACP,MAAM;GACI;GACA;GACV,SAAS;GACT,QAAQ;GACR,GAAI;EACL,CAAA,CACE;;AAET,CACF"}
1	+ {"version":3,"file":"TextField.js","names":[],"sources":["../../../components/TextField/TextField.tsx"],"sourcesContent":["import {\n CrossCircledIcon,\n ExclamationTriangleIcon,\n EyeClosedIcon,\n EyeOpenIcon,\n} from '@radix-ui/react-icons';\nimport React from 'react';\n\nimport { styled } from '../../stitches.config';\nimport { Box } from '../Box';\nimport { Input, InputHandle, InputProps, InputVariants } from '../Input';\nimport { Label } from '../Label';\nimport { Tooltip } from '../Tooltip';\n\n// TYPES\nexport interface TextFieldLabelProps {\n variant: 'invalid' \| 'subtle' \| 'contrast' \| 'default';\n htmlFor?: string;\n}\nexport type TextFieldProps = InputProps & {\n type?: string;\n clearable?: boolean;\n label?: string \| ((props: TextFieldLabelProps) => JSX.Element);\n};\n\nexport type TextFieldVariants = InputVariants;\n\n// COMPONENTS\nconst AdornmentGroup = styled('div', {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'center',\n});\n\nconst StyledExclamationTriangleIcon = styled(ExclamationTriangleIcon, {\n '& + *': {\n marginLeft: '$1',\n },\n});\n\nconst StyledEyeOpenIcon = styled(EyeOpenIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nconst StyledEyeClosedIcon = styled(EyeClosedIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nconst StyledCrossCircledIcon = styled(CrossCircledIcon, {\n '@hover': {\n '&:hover': {\n cursor: 'pointer',\n },\n },\n});\n\nexport const TextField = React.forwardRef<React.ElementRef<typeof Input>, TextFieldProps>(\n (\n {\n state,\n clearable,\n label: LabelOrComponent,\n id,\n type,\n disabled,\n readOnly,\n onBlur,\n onFocus,\n css,\n ...props\n },\n forwardedRef\n ) => {\n const inputRef = React.useRef<InputHandle \| null>(null);\n React.useImperativeHandle(forwardedRef, () => inputRef.current as InputHandle);\n\n const [inputHasFocus, setInputHasFocus] = React.useState(false);\n const [innerType, setInnerType] = React.useState(type);\n const isPasswordVisible = React.useMemo(() => innerType !== 'password', [innerType]);\n\n const invalid = React.useMemo(() => state === 'invalid', [state]);\n\n const labelVariant = React.useMemo(() => {\n if (disabled) {\n return 'subtle';\n }\n if (invalid) {\n return 'invalid';\n }\n if (inputHasFocus) {\n return 'contrast';\n }\n return 'default';\n }, [invalid, disabled, inputHasFocus]);\n\n const LabelNode = React.useMemo(() => {\n if (LabelOrComponent === undefined \|\| LabelOrComponent === null) {\n return null;\n }\n if (typeof LabelOrComponent === 'string') {\n return (\n <Label variant={labelVariant} htmlFor={id}>\n {LabelOrComponent}\n </Label>\n );\n }\n return <LabelOrComponent variant={labelVariant} htmlFor={id} />;\n }, [LabelOrComponent, labelVariant, id]);\n\n const isPasswordType = React.useMemo(() => type === 'password', [type]);\n\n const typeOrInnerType = React.useMemo(\n () => (isPasswordType ? innerType : type),\n [isPasswordType, type, innerType]\n );\n\n const hasInnerAdornment = React.useMemo(\n () => clearable \|\| isPasswordType \|\| invalid,\n [clearable, isPasswordType, invalid]\n );\n\n const hasAdornmentGroup = React.useMemo(\n () => (clearable && invalid) \|\| (clearable && isPasswordType) \|\| (invalid && isPasswordType),\n [clearable, invalid, isPasswordType]\n );\n\n const clearDisabled = React.useMemo(() => readOnly \|\| disabled, [readOnly, disabled]);\n\n const handleClear = React.useCallback(() => {\n const { current } = inputRef;\n if (current) {\n current.clear();\n }\n }, [inputRef]);\n\n const handleFocus = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n if (onFocus) {\n onFocus(e);\n }\n setInputHasFocus(true);\n },\n [onFocus, setInputHasFocus]\n );\n\n const handleBlur = React.useCallback(\n (e: React.FocusEvent<HTMLInputElement>) => {\n if (onBlur) {\n onBlur(e);\n }\n setInputHasFocus(false);\n },\n [onBlur, setInputHasFocus]\n );\n\n const togglePasswordVisibility = React.useCallback(() => {\n setInnerType((prevInnerType) => (prevInnerType === 'password' ? undefined : 'password'));\n }, [setInnerType]);\n\n const EndAdornmentWrapper = React.useMemo(\n () => (hasAdornmentGroup ? AdornmentGroup : React.Fragment),\n [hasAdornmentGroup]\n );\n\n const PasswordVisibilityToggleIcon = React.useMemo(\n () => (isPasswordVisible ? StyledEyeClosedIcon : StyledEyeOpenIcon),\n [isPasswordVisible]\n );\n\n const passwordAction = React.useMemo(\n () => (isPasswordVisible ? 'Hide password' : 'Show password'),\n [isPasswordVisible]\n );\n\n return (\n <Box css={css}>\n {LabelNode}\n <Input\n id={id}\n ref={inputRef}\n endAdornment={\n hasInnerAdornment && (\n <EndAdornmentWrapper>\n {invalid && <StyledExclamationTriangleIcon role=\"alert\" aria-label=\"Invalid\" />}\n {isPasswordType && (\n <Tooltip content={passwordAction}>\n <PasswordVisibilityToggleIcon\n aria-label={passwordAction}\n onClick={togglePasswordVisibility}\n />\n </Tooltip>\n )}\n {clearable && !clearDisabled && (\n <Tooltip content=\"Clear\">\n <StyledCrossCircledIcon aria-label=\"Clear\" onClick={handleClear} />\n </Tooltip>\n )}\n </EndAdornmentWrapper>\n )\n }\n state={state}\n type={typeOrInnerType}\n disabled={disabled}\n readOnly={readOnly}\n onFocus={handleFocus}\n onBlur={handleBlur}\n {...props}\n />\n </Box>\n );\n }\n);\n"],"mappings":"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"}

package/dist/components/TextField/TextField.vanilla.cjs CHANGED Viewed

@@ -8,7 +8,7 @@ let _radix_ui_react_icons = require("@radix-ui/react-icons");
 let react = require("react");
 react = require_runtime.__toESM(react, 1);
 let react_jsx_runtime = require("react/jsx-runtime");
-//#region components/TextField/TextField.vanilla.tsx
+// components/TextField/TextField.vanilla.tsx
 var AdornmentGroup = require_stitches_config.styled("div", {
 	display: "flex",
 	flexDirection: "row",
@@ -122,7 +122,6 @@ var TextFieldVanilla = react.default.forwardRef(({ state, clearable, label: Labe
 	});
 });
 TextFieldVanilla.displayName = "TextFieldVanilla";
-//#endregion
 exports.TextFieldVanilla = TextFieldVanilla;
 //# sourceMappingURL=TextField.vanilla.cjs.map