@audius/harmony 0.0.25

package/dist/components/tag/Tag.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.d.ts","sourceRoot":"","sources":["../../../src/components/tag/Tag.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAA;AAclC,MAAM,MAAM,QAAQ,GAAG;IACrB,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,CAAC,WAAW,CAAC,KAAK,IAAI,CAAA;IAC9C,OAAO,CAAC,EAAE,SAAS,GAAG,UAAU,CAAA;IAChC,WAAW,CAAC,EAAE,OAAO,CAAA;CACtB,CAAA;AAED,eAAO,MAAM,GAAG,UAAW,QAAQ,qDAgElC,CAAA"}

package/dist/components/tag/Tag.js

@@ -0,0 +1,52 @@
+import { __rest, __assign } from '../../_virtual/_tslib.js';
+import { jsxs, jsx } from '@emotion/react/jsx-runtime';
+import { useTheme } from '@emotion/react';
+import '../button/Button/Button.js';
+import '../button/PlainButton/PlainButton.js';
+import { IconPlus, IconCloseAlt } from '../../icons/utilityIcons.js';
+import 'react';
+import '@emotion/css';
+import '../button/FollowButton/FollowButton.js';
+import '../button/FilterButton/FilterButton.js';
+import { IconButton } from '../button/IconButton/IconButton.js';
+import { Text } from '../text/Text/Text.js';
+
+var messages = {
+    add: 'Add Tag',
+    remove: 'Remove Tag'
+};
+var Tag = function (props) {
+    var children = props.children, variant = props.variant, multiselect = props.multiselect, onClick = props.onClick, other = __rest(props, ["children", "variant", "multiselect", "onClick"]);
+    var _a = useTheme(), color = _a.color, motion = _a.motion, cornerRadius = _a.cornerRadius, spacing = _a.spacing;
+    var rootCss = {
+        all: 'unset',
+        cursor: multiselect && variant === 'composed' ? 'pointer' : undefined,
+        display: 'inline-flex',
+        alignItems: 'center',
+        height: 23,
+        boxSizing: 'border-box',
+        padding: '5.5px 8px',
+        // gap: spacing.xs,
+        borderRadius: cornerRadius.xs,
+        backgroundColor: variant === 'composed' ? color.secondary.s300 : color.neutral.n400,
+        transition: "transform ".concat(motion.hover, ", background-color ").concat(motion.hover, ", color ").concat(motion.hover),
+        ':hover': {
+            backgroundColor: variant === 'composed' ? color.secondary.s100 : color.secondary.s300,
+            transform: 'scale(1.04)'
+        },
+        ':active': {
+            transform: 'scale(0.98)'
+        }
+    };
+    var Icon = multiselect
+        ? variant === 'composed'
+            ? IconPlus
+            : IconCloseAlt
+        : null;
+    var Root = multiselect && variant === 'composed' ? 'button' : 'span';
+    var isDefaultMultiselect = multiselect && variant === 'default';
+    return (jsxs(Root, __assign({ css: rootCss, onClick: isDefaultMultiselect ? undefined : onClick }, other, { children: [jsx(Text, __assign({ variant: 'label', size: 'xs', color: 'staticWhite', css: { lineHeight: '8px' } }, { children: children })), Icon ? (jsx(IconButton, { icon: Icon, color: 'staticWhite', onClick: isDefaultMultiselect ? onClick : undefined, "aria-label": variant === 'composed' ? messages.add : messages.remove, height: spacing.unit2, width: spacing.unit2, css: { paddingRight: 0 } })) : null] })));
+};
+
+export { Tag };
+//# sourceMappingURL=Tag.js.map

package/dist/components/tag/Tag.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.js","sources":["../../../src/components/tag/Tag.tsx"],"sourcesContent":["import { MouseEvent } from 'react'\n\nimport { CSSObject, useTheme } from '@emotion/react'\n\nimport { IconButton } from 'components/button'\n\nimport { IconCloseAlt, IconPlus } from '../../icons'\nimport { Text } from '../text'\n\nconst messages = {\n  add: 'Add Tag',\n  remove: 'Remove Tag'\n}\n\nexport type TagProps = {\n  children: string\n  className?: string\n  onClick?: (e: MouseEvent<HTMLElement>) => void\n  variant?: 'default' | 'composed'\n  multiselect?: boolean\n}\n\nexport const Tag = (props: TagProps) => {\n  const { children, variant, multiselect, onClick, ...other } = props\n  const { color, motion, cornerRadius, spacing } = useTheme()\n\n  const rootCss: CSSObject = {\n    all: 'unset',\n    cursor: multiselect && variant === 'composed' ? 'pointer' : undefined,\n    display: 'inline-flex',\n    alignItems: 'center',\n    height: 23,\n    boxSizing: 'border-box',\n    padding: '5.5px 8px',\n    // gap: spacing.xs,\n    borderRadius: cornerRadius.xs,\n    backgroundColor:\n      variant === 'composed' ? color.secondary.s300 : color.neutral.n400,\n    transition: `transform ${motion.hover}, background-color ${motion.hover}, color ${motion.hover}`,\n\n    ':hover': {\n      backgroundColor:\n        variant === 'composed' ? color.secondary.s100 : color.secondary.s300,\n      transform: 'scale(1.04)'\n    },\n    ':active': {\n      transform: 'scale(0.98)'\n    }\n  }\n\n  const Icon = multiselect\n    ? variant === 'composed'\n      ? IconPlus\n      : IconCloseAlt\n    : null\n\n  const Root = multiselect && variant === 'composed' ? 'button' : 'span'\n  const isDefaultMultiselect = multiselect && variant === 'default'\n\n  return (\n    <Root\n      css={rootCss}\n      onClick={isDefaultMultiselect ? undefined : onClick}\n      {...other}\n    >\n      <Text\n        variant='label'\n        size='xs'\n        color='staticWhite'\n        css={{ lineHeight: '8px' }}\n      >\n        {children}\n      </Text>\n      {Icon ? (\n        <IconButton\n          icon={Icon}\n          color='staticWhite'\n          onClick={isDefaultMultiselect ? onClick : undefined}\n          aria-label={variant === 'composed' ? messages.add : messages.remove}\n          height={spacing.unit2}\n          width={spacing.unit2}\n          css={{ paddingRight: 0 }}\n        />\n      ) : null}\n    </Root>\n  )\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/components/tag/Tag.stories.d.ts

@@ -0,0 +1,9 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { Tag } from './Tag';
+declare const meta: Meta<typeof Tag>;
+export default meta;
+type Story = StoryObj<typeof Tag>;
+export declare const TagInput: Story;
+export declare const TopTags: Story;
+export declare const Variants: Story;
+//# sourceMappingURL=Tag.stories.d.ts.map

package/dist/components/tag/Tag.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Tag.stories.d.ts","sourceRoot":"","sources":["../../../src/components/tag/Tag.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAKjD,OAAO,EAAE,GAAG,EAAE,MAAM,OAAO,CAAA;AAE3B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,GAAG,CAG1B,CAAA;AAED,eAAe,IAAI,CAAA;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,GAAG,CAAC,CAAA;AAEjC,eAAO,MAAM,QAAQ,EAAE,KAUtB,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAkBrB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAetB,CAAA"}

package/dist/components/tag/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Tag';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/tag/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/tag/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAA"}

package/dist/components/text/Text/Text.d.ts

@@ -0,0 +1,3 @@
+import { ElementType } from 'react';
+export declare const Text: <TextComponentType extends ElementType = "p">(props: import("./types").BaseTextProps<TextComponentType> & Omit<import("react").ComponentProps<TextComponentType>, keyof import("./types").BaseTextProps<"p"> | "ref"> & import("react").RefAttributes<TextComponentType>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
+//# sourceMappingURL=Text.d.ts.map

package/dist/components/text/Text/Text.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.d.ts","sourceRoot":"","sources":["../../../../src/components/text/Text/Text.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAA4B,MAAM,OAAO,CAAA;AAU7D,eAAO,MAAM,IAAI,4WA8DhB,CAAA"}

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

@@ -0,0 +1,38 @@
+import { __rest, __assign } from '../../../_virtual/_tslib.js';
+import { jsx } from '@emotion/react/jsx-runtime';
+import { forwardRef } from 'react';
+import { useTheme } from '@emotion/react';
+import { Slot } from '@radix-ui/react-slot';
+import { typography } from '../../../foundations/typography/typography.js';
+import { variantTagMap, variantStylesMap } from './constants.js';
+
+var Text = forwardRef(function (props, ref) {
+    var _a, _b;
+    var children = props.children, variant = props.variant, _c = props.strength, strength = _c === void 0 ? 'default' : _c, _d = props.size, size = _d === void 0 ? 'm' : _d, color = props.color, shadow = props.shadow, tag = props.tag, asChild = props.asChild, textAlign = props.textAlign, other = __rest(props, ["children", "variant", "strength", "size", "color", "shadow", "tag", "asChild", "textAlign"]);
+    var theme = useTheme();
+    var variantConfig = variant && variantStylesMap[variant];
+    var styles = __assign(__assign(__assign({ fontFamily: "'Avenir Next LT Pro', 'Helvetica Neue', Helvetica,\n    Arial, sans-serif", position: 'relative', boxSizing: 'border-box' }, (color &&
+        color === 'heading' && {
+        // inline is necessary to prevent text clipping
+        display: 'inline',
+        color: theme.color.secondary.secondary,
+        WebkitTextFillColor: 'transparent',
+        backgroundClip: 'text',
+        backgroundImage: theme.color.text.heading
+    })), (color && color !== 'heading' && { color: theme.color.text[color] })), (variantConfig && __assign(__assign(__assign({ 
+        // @ts-ignore
+        fontSize: typography.size[variantConfig.fontSize[size]], 
+        // @ts-ignore
+        lineHeight: typography.lineHeight[variantConfig.lineHeight[size]], 
+        // @ts-ignore
+        fontWeight: typography.weight[variantConfig.fontWeight[strength]] }, ('css' in variantConfig && variantConfig.css)), (shadow && {
+        textShadow: typography.shadow[shadow]
+    })), { textAlign: textAlign })));
+    // @ts-ignore
+    var variantTag = variant && ((_a = variantTagMap[variant]) === null || _a === void 0 ? void 0 : _a[size]);
+    var Tag = asChild ? Slot : (_b = tag !== null && tag !== void 0 ? tag : variantTag) !== null && _b !== void 0 ? _b : 'p';
+    return (jsx(Tag, __assign({ ref: ref, css: styles }, other, { children: children })));
+});
+
+export { Text };
+//# sourceMappingURL=Text.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Text.js","sources":["../../../../src/components/text/Text/Text.tsx"],"sourcesContent":["import { ElementType, ForwardedRef, forwardRef } from 'react'\n\nimport { useTheme } from '@emotion/react'\nimport { Slot } from '@radix-ui/react-slot'\n\nimport { typography } from '../../../foundations/typography'\n\nimport { variantStylesMap, variantTagMap } from './constants'\nimport type { TextProps } from './types'\n\nexport const Text = forwardRef(\n  <TextComponentType extends ElementType = 'p'>(\n    props: TextProps<TextComponentType>,\n    ref: ForwardedRef<TextComponentType>\n  ) => {\n    const {\n      children,\n      variant,\n      strength = 'default',\n      size = 'm',\n      color,\n      shadow,\n      tag,\n      asChild,\n      textAlign,\n      ...other\n    } = props\n\n    const theme = useTheme()\n\n    const variantConfig = variant && variantStylesMap[variant]\n    const styles = {\n      fontFamily: `'Avenir Next LT Pro', 'Helvetica Neue', Helvetica,\n    Arial, sans-serif`,\n      position: 'relative',\n      boxSizing: 'border-box',\n      ...(color &&\n        color === 'heading' && {\n          // inline is necessary to prevent text clipping\n          display: 'inline',\n          color: theme.color.secondary.secondary,\n          WebkitTextFillColor: 'transparent',\n          backgroundClip: 'text',\n          backgroundImage: theme.color.text.heading\n        }),\n      ...(color && color !== 'heading' && { color: theme.color.text[color] }),\n      ...(variantConfig && {\n        // @ts-ignore\n        fontSize: typography.size[variantConfig.fontSize[size]],\n        // @ts-ignore\n        lineHeight: typography.lineHeight[variantConfig.lineHeight[size]],\n        // @ts-ignore\n        fontWeight: typography.weight[variantConfig.fontWeight[strength]],\n        ...('css' in variantConfig && variantConfig.css),\n        ...(shadow && {\n          textShadow: typography.shadow[shadow]\n        }),\n        textAlign\n      })\n    }\n\n    // @ts-ignore\n    const variantTag = variant && variantTagMap[variant]?.[size]\n\n    const Tag: ElementType = asChild ? Slot : tag ?? variantTag ?? 'p'\n\n    return (\n      <Tag ref={ref} css={styles} {...other}>\n        {children}\n      </Tag>\n    )\n  }\n)\n"],"names":["_jsx"],"mappings":";;;;;;;;IAUa,IAAI,GAAG,UAAU,CAC5B,UACE,KAAmC,EACnC,GAAoC,EAAA;;IAGlC,IAAA,QAAQ,GAUN,KAAK,CAVC,QAAA,EACR,OAAO,GASL,KAAK,CAAA,OATA,EACP,EAAA,GAQE,KAAK,CAAA,QARa,EAApB,QAAQ,GAAG,EAAA,KAAA,KAAA,CAAA,GAAA,SAAS,GAAA,EAAA,EACpB,EAOE,GAAA,KAAK,CAPG,IAAA,EAAV,IAAI,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,GAAG,GAAA,EAAA,EACV,KAAK,GAMH,KAAK,CANF,KAAA,EACL,MAAM,GAKJ,KAAK,CAAA,MALD,EACN,GAAG,GAID,KAAK,CAJJ,GAAA,EACH,OAAO,GAGL,KAAK,CAAA,OAHA,EACP,SAAS,GAEP,KAAK,CAFE,SAAA,EACN,KAAK,GAAA,MAAA,CACN,KAAK,EAXH,CAWL,UAAA,EAAA,SAAA,EAAA,UAAA,EAAA,MAAA,EAAA,OAAA,EAAA,QAAA,EAAA,KAAA,EAAA,SAAA,EAAA,WAAA,CAAA,CADS,CACD;AAET,IAAA,IAAM,KAAK,GAAG,QAAQ,EAAE,CAAA;IAExB,IAAM,aAAa,GAAG,OAAO,IAAI,gBAAgB,CAAC,OAAO,CAAC,CAAA;AAC1D,IAAA,IAAM,MAAM,GAAA,QAAA,CAAA,QAAA,CAAA,QAAA,CAAA,EACV,UAAU,EAAE,2EACI,EAChB,QAAQ,EAAE,UAAU,EACpB,SAAS,EAAE,YAAY,EAAA,GACnB,KAAK;QACP,KAAK,KAAK,SAAS,IAAI;;AAErB,QAAA,OAAO,EAAE,QAAQ;AACjB,QAAA,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,SAAS,CAAC,SAAS;AACtC,QAAA,mBAAmB,EAAE,aAAa;AAClC,QAAA,cAAc,EAAE,MAAM;AACtB,QAAA,eAAe,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO;KAC1C,EAAC,GACA,KAAK,IAAI,KAAK,KAAK,SAAS,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,EACnE,GAAC,aAAa,IAAA,QAAA,CAAA,QAAA,CAAA,QAAA,CAAA;;QAEf,QAAQ,EAAE,UAAU,CAAC,IAAI,CAAC,aAAa,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;;QAEvD,UAAU,EAAE,UAAU,CAAC,UAAU,CAAC,aAAa,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;;QAEjE,UAAU,EAAE,UAAU,CAAC,MAAM,CAAC,aAAa,CAAC,UAAU,CAAC,QAAQ,CAAC,CAAC,KAC7D,KAAK,IAAI,aAAa,IAAI,aAAa,CAAC,GAAG,EAAC,GAC5C,MAAM,IAAI;AACZ,QAAA,UAAU,EAAE,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC;AACtC,KAAA,MACD,SAAS,EAAA,SAAA,EACV,CAAA,EACF,CAAA;;AAGD,IAAA,IAAM,UAAU,GAAG,OAAO,KAAI,CAAA,EAAA,GAAA,aAAa,CAAC,OAAO,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAG,IAAI,CAAC,CAAA,CAAA;IAE5D,IAAM,GAAG,GAAgB,OAAO,GAAG,IAAI,GAAG,MAAA,GAAG,KAAA,IAAA,IAAH,GAAG,KAAH,KAAA,CAAA,GAAA,GAAG,GAAI,UAAU,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,GAAG,CAAA;AAElE,IAAA,QACEA,GAAC,CAAA,GAAG,EAAC,QAAA,CAAA,EAAA,GAAG,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,EAAM,EAAA,KAAK,cAClC,QAAQ,EAAA,CAAA,CACL,EACP;AACH,CAAC;;;;"}

package/dist/components/text/Text/Text.stories.d.ts

@@ -0,0 +1,12 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { Text } from './Text';
+declare const meta: Meta<typeof Text>;
+export default meta;
+type Story = StoryObj<typeof Text>;
+export declare const Default: Story;
+export declare const Body: Story;
+export declare const Disabled: Story;
+export declare const StrongDisplay: Story;
+export declare const LargeTitle: Story;
+export declare const SubduedLabel: Story;
+//# sourceMappingURL=Text.stories.d.ts.map

package/dist/components/text/Text/Text.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/text/Text/Text.stories.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAGtD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAO7B,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,IAAI,CA0B3B,CAAA;AAED,eAAe,IAAI,CAAA;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAElC,eAAO,MAAM,OAAO,EAAE,KAAU,CAAA;AAEhC,eAAO,MAAM,IAAI,EAAE,KAIlB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAKtB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAa3B,CAAA;AAED,eAAO,MAAM,UAAU,EAAE,KAKxB,CAAA;AAED,eAAO,MAAM,YAAY,EAAE,KAK1B,CAAA"}

package/dist/components/text/Text/constants.d.ts

@@ -0,0 +1,114 @@
+export declare const variantTagMap: {
+    display: {
+        xl: string;
+        l: string;
+        m: string;
+        s: string;
+    };
+    heading: {
+        xl: string;
+        l: string;
+        m: string;
+        s: string;
+    };
+};
+export declare const variantStylesMap: {
+    display: {
+        fontSize: {
+            s: string;
+            m: string;
+            l: string;
+            xl: string;
+        };
+        lineHeight: {
+            s: string;
+            m: string;
+            l: string;
+            xl: string;
+        };
+        fontWeight: {
+            default: string;
+            strong: string;
+        };
+    };
+    heading: {
+        fontSize: {
+            s: string;
+            m: string;
+            l: string;
+            xl: string;
+        };
+        lineHeight: {
+            s: string;
+            m: string;
+            l: string;
+            xl: string;
+        };
+        fontWeight: {
+            default: string;
+            strong: string;
+        };
+    };
+    title: {
+        fontSize: {
+            xs: string;
+            s: string;
+            m: string;
+            l: string;
+        };
+        lineHeight: {
+            xs: string;
+            s: string;
+            m: string;
+            l: string;
+        };
+        fontWeight: {
+            weak: string;
+            default: string;
+            strong: string;
+        };
+    };
+    label: {
+        fontSize: {
+            xs: string;
+            s: string;
+            m: string;
+            l: string;
+            xl: string;
+        };
+        lineHeight: {
+            xs: string;
+            s: string;
+            m: string;
+            l: string;
+            xl: string;
+        };
+        fontWeight: {
+            default: string;
+            strong: string;
+        };
+        css: {
+            textTransform: "uppercase";
+            letterSpacing: number;
+        };
+    };
+    body: {
+        fontSize: {
+            xs: string;
+            s: string;
+            m: string;
+            l: string;
+        };
+        lineHeight: {
+            xs: string;
+            s: string;
+            m: string;
+            l: string;
+        };
+        fontWeight: {
+            default: string;
+            strong: string;
+        };
+    };
+};
+//# sourceMappingURL=constants.d.ts.map

package/dist/components/text/Text/constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../src/components/text/Text/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,aAAa;;;;;;;;;;;;;CAazB,CAAA;AAED,eAAO,MAAM,gBAAgB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2B5B,CAAA"}

package/dist/components/text/Text/constants.js

@@ -0,0 +1,45 @@
+var variantTagMap = {
+    display: {
+        xl: 'h1',
+        l: 'h1',
+        m: 'h1',
+        s: 'h1'
+    },
+    heading: {
+        xl: 'h1',
+        l: 'h2',
+        m: 'h3',
+        s: 'h4'
+    }
+};
+var variantStylesMap = {
+    display: {
+        fontSize: { s: '6xl', m: '7xl', l: '8xl', xl: '9xl' },
+        lineHeight: { s: '3xl', m: '4xl', l: '5xl', xl: '6xl' },
+        fontWeight: { default: 'bold', strong: 'heavy' }
+    },
+    heading: {
+        fontSize: { s: 'xl', m: '2xl', l: '3xl', xl: '5xl' },
+        lineHeight: { s: 'l', m: 'xl', l: 'xl', xl: '2xl' },
+        fontWeight: { default: 'bold', strong: 'heavy' }
+    },
+    title: {
+        fontSize: { xs: 'xs', s: 's', m: 'm', l: 'l' },
+        lineHeight: { xs: 's', s: 's', m: 'm', l: 'l' },
+        fontWeight: { weak: 'demiBold', default: 'bold', strong: 'heavy' }
+    },
+    label: {
+        fontSize: { xs: '2xs', s: 'xs', m: 's', l: 'm', xl: 'xl' },
+        lineHeight: { xs: 'xs', s: 's', m: 's', l: 'm', xl: 'l' },
+        fontWeight: { default: 'bold', strong: 'heavy' },
+        css: { textTransform: 'uppercase', letterSpacing: 0.5 }
+    },
+    body: {
+        fontSize: { xs: 'xs', s: 's', m: 'm', l: 'l' },
+        lineHeight: { xs: 's', s: 'm', m: 'm', l: 'l' },
+        fontWeight: { default: 'medium', strong: 'demiBold' }
+    }
+};
+
+export { variantStylesMap, variantTagMap };
+//# sourceMappingURL=constants.js.map

package/dist/components/text/Text/constants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"constants.js","sources":["../../../../src/components/text/Text/constants.ts"],"sourcesContent":["export const variantTagMap = {\n  display: {\n    xl: 'h1',\n    l: 'h1',\n    m: 'h1',\n    s: 'h1'\n  },\n  heading: {\n    xl: 'h1',\n    l: 'h2',\n    m: 'h3',\n    s: 'h4'\n  }\n}\n\nexport const variantStylesMap = {\n  display: {\n    fontSize: { s: '6xl', m: '7xl', l: '8xl', xl: '9xl' },\n    lineHeight: { s: '3xl', m: '4xl', l: '5xl', xl: '6xl' },\n    fontWeight: { default: 'bold', strong: 'heavy' }\n  },\n  heading: {\n    fontSize: { s: 'xl', m: '2xl', l: '3xl', xl: '5xl' },\n    lineHeight: { s: 'l', m: 'xl', l: 'xl', xl: '2xl' },\n    fontWeight: { default: 'bold', strong: 'heavy' }\n  },\n  title: {\n    fontSize: { xs: 'xs', s: 's', m: 'm', l: 'l' },\n    lineHeight: { xs: 's', s: 's', m: 'm', l: 'l' },\n    fontWeight: { weak: 'demiBold', default: 'bold', strong: 'heavy' }\n  },\n  label: {\n    fontSize: { xs: '2xs', s: 'xs', m: 's', l: 'm', xl: 'xl' },\n    lineHeight: { xs: 'xs', s: 's', m: 's', l: 'm', xl: 'l' },\n    fontWeight: { default: 'bold', strong: 'heavy' },\n    css: { textTransform: 'uppercase' as const, letterSpacing: 0.5 }\n  },\n  body: {\n    fontSize: { xs: 'xs', s: 's', m: 'm', l: 'l' },\n    lineHeight: { xs: 's', s: 'm', m: 'm', l: 'l' },\n    fontWeight: { default: 'medium', strong: 'demiBold' }\n  }\n}\n"],"names":[],"mappings":"AAAa,IAAA,aAAa,GAAG;AAC3B,IAAA,OAAO,EAAE;AACP,QAAA,EAAE,EAAE,IAAI;AACR,QAAA,CAAC,EAAE,IAAI;AACP,QAAA,CAAC,EAAE,IAAI;AACP,QAAA,CAAC,EAAE,IAAI;AACR,KAAA;AACD,IAAA,OAAO,EAAE;AACP,QAAA,EAAE,EAAE,IAAI;AACR,QAAA,CAAC,EAAE,IAAI;AACP,QAAA,CAAC,EAAE,IAAI;AACP,QAAA,CAAC,EAAE,IAAI;AACR,KAAA;EACF;AAEY,IAAA,gBAAgB,GAAG;AAC9B,IAAA,OAAO,EAAE;AACP,QAAA,QAAQ,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE;AACrD,QAAA,UAAU,EAAE,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE;QACvD,UAAU,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE;AACjD,KAAA;AACD,IAAA,OAAO,EAAE;AACP,QAAA,QAAQ,EAAE,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE,KAAK,EAAE;AACpD,QAAA,UAAU,EAAE,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,KAAK,EAAE;QACnD,UAAU,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE;AACjD,KAAA;AACD,IAAA,KAAK,EAAE;AACL,QAAA,QAAQ,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE;AAC9C,QAAA,UAAU,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE;AAC/C,QAAA,UAAU,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE;AACnE,KAAA;AACD,IAAA,KAAK,EAAE;QACL,QAAQ,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,IAAI,EAAE;QAC1D,UAAU,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE;QACzD,UAAU,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,EAAE;QAChD,GAAG,EAAE,EAAE,aAAa,EAAE,WAAoB,EAAE,aAAa,EAAE,GAAG,EAAE;AACjE,KAAA;AACD,IAAA,IAAI,EAAE;AACJ,QAAA,QAAQ,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE;AAC9C,QAAA,UAAU,EAAE,EAAE,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE;QAC/C,UAAU,EAAE,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,EAAE;AACtD,KAAA;;;;;"}

package/dist/components/text/Text/index.d.ts

@@ -0,0 +1,4 @@
+export { Text } from './Text';
+export * from './types';
+export * from './constants';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/text/Text/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/text/Text/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,cAAc,SAAS,CAAA;AACvB,cAAc,aAAa,CAAA"}

package/dist/components/text/Text/types.d.ts

@@ -0,0 +1,21 @@
+import type { CSSProperties, ComponentProps, ElementType, ReactNode } from 'react';
+import type { TextColors } from '../../../foundations/color/semantic';
+export type BaseTextProps<TextComponentType extends ElementType = 'p'> = {
+    tag?: TextComponentType;
+    className?: string;
+    children?: ReactNode;
+    variant?: TextVariant;
+    size?: TextSize;
+    strength?: TextStrength;
+    color?: TextColors;
+    shadow?: TextShadow;
+    asChild?: boolean;
+    textAlign?: CSSProperties['textAlign'];
+};
+export type TextProps<TextComponentType extends ElementType = 'p'> = BaseTextProps<TextComponentType> & Omit<ComponentProps<TextComponentType>, keyof BaseTextProps | 'ref'>;
+export type TextStrength = 'weak' | 'default' | 'strong';
+export type TextSize = 'xl' | 'l' | 'm' | 's' | 'xs';
+export type TextVariant = 'display' | 'heading' | 'title' | 'label' | 'body';
+export type TextShadow = 'emphasis';
+export type VariantSizeTagMap = Partial<Record<TextSize, ElementType>>;
+//# sourceMappingURL=types.d.ts.map

package/dist/components/text/Text/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/text/Text/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,aAAa,EACb,cAAc,EACd,WAAW,EACX,SAAS,EACV,MAAM,OAAO,CAAA;AAEd,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAA;AAErE,MAAM,MAAM,aAAa,CAAC,iBAAiB,SAAS,WAAW,GAAG,GAAG,IAAI;IACvE,GAAG,CAAC,EAAE,iBAAiB,CAAA;IACvB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,OAAO,CAAC,EAAE,WAAW,CAAA;IACrB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,QAAQ,CAAC,EAAE,YAAY,CAAA;IACvB,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,MAAM,CAAC,EAAE,UAAU,CAAA;IACnB,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB,SAAS,CAAC,EAAE,aAAa,CAAC,WAAW,CAAC,CAAA;CACvC,CAAA;AAED,MAAM,MAAM,SAAS,CAAC,iBAAiB,SAAS,WAAW,GAAG,GAAG,IAC/D,aAAa,CAAC,iBAAiB,CAAC,GAC9B,IAAI,CAAC,cAAc,CAAC,iBAAiB,CAAC,EAAE,MAAM,aAAa,GAAG,KAAK,CAAC,CAAA;AAExE,MAAM,MAAM,YAAY,GAAG,MAAM,GAAG,SAAS,GAAG,QAAQ,CAAA;AAExD,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,IAAI,CAAA;AAEpD,MAAM,MAAM,WAAW,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,GAAG,MAAM,CAAA;AAC5E,MAAM,MAAM,UAAU,GAAG,UAAU,CAAA;AACnC,MAAM,MAAM,iBAAiB,GAAG,OAAO,CAAC,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,CAAC,CAAA"}

package/dist/components/text/Text/typography.module.css.js

@@ -0,0 +1,4 @@
+var styles = {"text":"typography-module_text__cNBgj","colorHeading":"typography-module_colorHeading__s0WDE","colorDefault":"typography-module_colorDefault__GX0d0","colorSubdued":"typography-module_colorSubdued__TcGJp","colorDisabled":"typography-module_colorDisabled__qZtFQ","colorDanger":"typography-module_colorDanger__sY9bm","colorWarning":"typography-module_colorWarning__Pn6B0","display":"typography-module_display__1rLzy","displayStrong":"typography-module_displayStrong__pS3ex","displayXl":"typography-module_displayXl__CG2RS","displayL":"typography-module_displayL__O5wnF","displayM":"typography-module_displayM__gURn5","displayS":"typography-module_displayS__Jjcma","heading":"typography-module_heading__vL2uZ","headingStrong":"typography-module_headingStrong__XHnj8","headingXl":"typography-module_headingXl__88DSf","headingL":"typography-module_headingL__c6TY-","headingM":"typography-module_headingM__Wl42b","headingS":"typography-module_headingS__e7lGP","title":"typography-module_title__dCP70","titleStrong":"typography-module_titleStrong__QjRGe","titleWeak":"typography-module_titleWeak__MRwcs","titleL":"typography-module_titleL__X47Ie","titleM":"typography-module_titleM__-O3K-","titleS":"typography-module_titleS__dhRMc","titleXs":"typography-module_titleXs__ALpTQ","label":"typography-module_label__0QmgP","labelStrong":"typography-module_labelStrong__avMSk","labelWeak":"typography-module_labelWeak__H5uat","labelXl":"typography-module_labelXl__s1ZJg","labelL":"typography-module_labelL__kxfAY","labelM":"typography-module_labelM__r-0ca","labelS":"typography-module_labelS__740V9","labelXs":"typography-module_labelXs__1S2b7","body":"typography-module_body__s9wpv","bodyStrong":"typography-module_bodyStrong__6wXjW","bodyWeak":"typography-module_bodyWeak__yV4Rw","bodyL":"typography-module_bodyL__u-CBt","bodyM":"typography-module_bodyM__-tER2","bodyS":"typography-module_bodyS__C8T-o","bodyXs":"typography-module_bodyXs__j2CZ7","link":"typography-module_link__iRLA2"};
+
+export { styles as default };
+//# sourceMappingURL=typography.module.css.js.map

package/dist/components/text/Text/typography.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/components/text/index.d.ts

@@ -0,0 +1,2 @@
+export * from './Text';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/text/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/text/index.ts"],"names":[],"mappings":"AAAA,cAAc,QAAQ,CAAA"}

package/dist/components/text-link/TextLink.d.ts

@@ -0,0 +1,6 @@
+import type { TextLinkProps } from './types';
+/**
+ * Also known as hyperlinks, these are words or phrases that can be clicked to navigate to a linked webpage.
+ */
+export declare const TextLink: (props: TextLinkProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=TextLink.d.ts.map

package/dist/components/text-link/TextLink.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextLink.d.ts","sourceRoot":"","sources":["../../../src/components/text-link/TextLink.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAE5C;;GAEG;AACH,eAAO,MAAM,QAAQ,UAAW,aAAa,qDAoE5C,CAAA"}

package/dist/components/text-link/TextLink.js

@@ -0,0 +1,36 @@
+import { __rest, __assign } from '../../_virtual/_tslib.js';
+import { jsx } from '@emotion/react/jsx-runtime';
+import { useTheme } from '@emotion/react';
+import { Slot } from '@radix-ui/react-slot';
+import { Text } from '../text/Text/Text.js';
+
+/**
+ * Also known as hyperlinks, these are words or phrases that can be clicked to navigate to a linked webpage.
+ */
+var TextLink = function (props) {
+    var _a = props.asChild, asChild = _a === void 0 ? false : _a, children = props.children, _b = props.variant, variant = _b === void 0 ? 'default' : _b, _c = props.isExternal, isExternal = _c === void 0 ? false : _c, onClick = props.onClick, textVariant = props.textVariant, showUnderline = props.showUnderline, applyHoverStylesToInnerSvg = props.applyHoverStylesToInnerSvg, other = __rest(props, ["asChild", "children", "variant", "isExternal", "onClick", "textVariant", "showUnderline", "applyHoverStylesToInnerSvg"]);
+    var color = useTheme().color;
+    var variantColors = {
+        default: color.link.default,
+        subdued: color.link.subdued,
+        visible: color.link.visible,
+        inverted: color.static.white
+    };
+    var variantHoverColors = {
+        default: color.primary.p300,
+        subdued: color.primary.p300,
+        visible: color.link.visible,
+        inverted: color.static.white
+    };
+    var hoverStyles = __assign({ textDecoration: 'underline', color: variantHoverColors[variant] }, (applyHoverStylesToInnerSvg
+        ? {
+            path: {
+                fill: variantHoverColors[variant]
+            }
+        }
+        : {}));
+    return (jsx(Text, __assign({ asChild: true, onClick: onClick, tag: 'a', css: __assign({ color: variantColors[variant], textDecoration: 'none', transition: 'none', ':hover': hoverStyles }, (showUnderline && hoverStyles)), variant: textVariant }, other, { children: asChild ? (jsx(Slot, { children: children })) : (jsx("a", __assign({ target: isExternal ? '_blank' : undefined, rel: isExternal ? 'noreferrer' : undefined }, { children: children }))) })));
+};
+
+export { TextLink };
+//# sourceMappingURL=TextLink.js.map

package/dist/components/text-link/TextLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextLink.js","sources":["../../../src/components/text-link/TextLink.tsx"],"sourcesContent":["import { useTheme } from '@emotion/react'\nimport { Slot } from '@radix-ui/react-slot'\n\nimport { Text } from 'components/text/Text'\n\nimport type { TextLinkProps } from './types'\n\n/**\n * Also known as hyperlinks, these are words or phrases that can be clicked to navigate to a linked webpage.\n */\nexport const TextLink = (props: TextLinkProps) => {\n  const {\n    asChild = false,\n    children,\n    variant = 'default',\n    isExternal = false,\n    onClick,\n    textVariant,\n    showUnderline,\n    applyHoverStylesToInnerSvg,\n    ...other\n  } = props\n\n  const { color } = useTheme()\n\n  const variantColors = {\n    default: color.link.default,\n    subdued: color.link.subdued,\n    visible: color.link.visible,\n    inverted: color.static.white\n  }\n\n  const variantHoverColors = {\n    default: color.primary.p300,\n    subdued: color.primary.p300,\n    visible: color.link.visible,\n    inverted: color.static.white\n  }\n\n  const hoverStyles = {\n    textDecoration: 'underline',\n    color: variantHoverColors[variant],\n    ...(applyHoverStylesToInnerSvg\n      ? {\n          path: {\n            fill: variantHoverColors[variant]\n          }\n        }\n      : {})\n  }\n\n  return (\n    <Text\n      asChild\n      onClick={onClick}\n      tag='a'\n      css={{\n        color: variantColors[variant],\n        textDecoration: 'none',\n        transition: 'none',\n        ':hover': hoverStyles,\n        ...(showUnderline && hoverStyles)\n      }}\n      variant={textVariant}\n      {...other}\n    >\n      {asChild ? (\n        <Slot>{children}</Slot>\n      ) : (\n        <a\n          target={isExternal ? '_blank' : undefined}\n          rel={isExternal ? 'noreferrer' : undefined}\n        >\n          {children}\n        </a>\n      )}\n    </Text>\n  )\n}\n"],"names":["_jsx"],"mappings":";;;;;;AAOA;;AAEG;AACI,IAAM,QAAQ,GAAG,UAAC,KAAoB,EAAA;IAEzC,IAAA,EAAA,GASE,KAAK,CAAA,OATQ,EAAf,OAAO,GAAG,EAAA,KAAA,KAAA,CAAA,GAAA,KAAK,GAAA,EAAA,EACf,QAAQ,GAQN,KAAK,CAAA,QARC,EACR,EAAA,GAOE,KAAK,CAAA,OAPY,EAAnB,OAAO,GAAG,EAAA,KAAA,KAAA,CAAA,GAAA,SAAS,GAAA,EAAA,EACnB,EAME,GAAA,KAAK,CANW,UAAA,EAAlB,UAAU,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAK,GAAA,EAAA,EAClB,OAAO,GAKL,KAAK,CAAA,OALA,EACP,WAAW,GAIT,KAAK,CAJI,WAAA,EACX,aAAa,GAGX,KAAK,CAAA,aAHM,EACb,0BAA0B,GAExB,KAAK,CAFmB,0BAAA,EACvB,KAAK,GAAA,MAAA,CACN,KAAK,EAVH,CAUL,SAAA,EAAA,UAAA,EAAA,SAAA,EAAA,YAAA,EAAA,SAAA,EAAA,aAAA,EAAA,eAAA,EAAA,4BAAA,CAAA,CADS,CACD;AAED,IAAA,IAAA,KAAK,GAAK,QAAQ,EAAE,MAAf,CAAe;AAE5B,IAAA,IAAM,aAAa,GAAG;AACpB,QAAA,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;AAC3B,QAAA,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;AAC3B,QAAA,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;AAC3B,QAAA,QAAQ,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK;KAC7B,CAAA;AAED,IAAA,IAAM,kBAAkB,GAAG;AACzB,QAAA,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI;AAC3B,QAAA,OAAO,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI;AAC3B,QAAA,OAAO,EAAE,KAAK,CAAC,IAAI,CAAC,OAAO;AAC3B,QAAA,QAAQ,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK;KAC7B,CAAA;AAED,IAAA,IAAM,WAAW,GAAA,QAAA,CAAA,EACf,cAAc,EAAE,WAAW,EAC3B,KAAK,EAAE,kBAAkB,CAAC,OAAO,CAAC,EAAA,GAC9B,0BAA0B;AAC5B,UAAE;AACE,YAAA,IAAI,EAAE;AACJ,gBAAA,IAAI,EAAE,kBAAkB,CAAC,OAAO,CAAC;AAClC,aAAA;AACF,SAAA;AACH,UAAE,EAAE,EACP,CAAA;IAED,QACEA,IAAC,IAAI,EAAA,QAAA,CAAA,EACH,OAAO,EACP,IAAA,EAAA,OAAO,EAAE,OAAO,EAChB,GAAG,EAAC,GAAG,EACP,GAAG,EAAA,QAAA,CAAA,EACD,KAAK,EAAE,aAAa,CAAC,OAAO,CAAC,EAC7B,cAAc,EAAE,MAAM,EACtB,UAAU,EAAE,MAAM,EAClB,QAAQ,EAAE,WAAW,KACjB,aAAa,IAAI,WAAW,IAElC,OAAO,EAAE,WAAW,EAChB,EAAA,KAAK,cAER,OAAO,IACNA,IAAC,IAAI,EAAA,EAAA,QAAA,EAAE,QAAQ,EAAQ,CAAA,KAEvBA,GACE,CAAA,GAAA,EAAA,QAAA,CAAA,EAAA,MAAM,EAAE,UAAU,GAAG,QAAQ,GAAG,SAAS,EACzC,GAAG,EAAE,UAAU,GAAG,YAAY,GAAG,SAAS,EAEzC,EAAA,EAAA,QAAA,EAAA,QAAQ,IACP,CACL,EAAA,CAAA,CACI,EACR;AACH;;;;"}

package/dist/components/text-link/TextLink.stories.d.ts

@@ -0,0 +1,13 @@
+import type { Meta, StoryObj } from '@storybook/react';
+import { TextLink } from './TextLink';
+declare const meta: Meta<typeof TextLink>;
+export default meta;
+type Story = StoryObj<typeof TextLink>;
+export declare const Primary: Story;
+export declare const Default: Story;
+export declare const Visible: Story;
+export declare const Inverted: Story;
+export declare const External: Story;
+export declare const MatchesTextStyle: Story;
+export declare const AsChild: Story;
+//# sourceMappingURL=TextLink.stories.d.ts.map

package/dist/components/text-link/TextLink.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TextLink.stories.d.ts","sourceRoot":"","sources":["../../../src/components/text-link/TextLink.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAMtD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CAe/B,CAAA;AAED,eAAe,IAAI,CAAA;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAA;AAEtC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAIrB,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAkBtB,CAAA;AAED,eAAO,MAAM,QAAQ,EAAE,KAMtB,CAAA;AAED,eAAO,MAAM,gBAAgB,EAAE,KAO9B,CAAA;AAED,eAAO,MAAM,OAAO,EAAE,KAMrB,CAAA"}

package/dist/components/text-link/index.d.ts

@@ -0,0 +1,2 @@
+export { TextLink } from './TextLink';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/text-link/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/text-link/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA"}

package/dist/components/text-link/types.d.ts

@@ -0,0 +1,38 @@
+import type { HTMLProps } from 'react';
+import type { TextProps } from "../text/Text";
+type TextLinkTextProps = Omit<TextProps, 'variant' | 'color'>;
+export type TextLinkProps = TextLinkTextProps & Omit<HTMLProps<HTMLAnchorElement>, 'size' | 'color' | 'ref'> & {
+    /**
+     * Change the default rendered element for the one passed as a child,
+     *  merging their props and behavior.
+     */
+    asChild?: boolean;
+    /**
+     * Which variant to display.
+     * @default default
+     */
+    variant?: 'default' | 'subdued' | 'visible' | 'inverted';
+    /**
+     * Which text variant to display.
+     */
+    textVariant?: TextProps['variant'];
+    /**
+     * When true, always show the link underline. This can help emphasize that
+     * a text-link is present when next to other text.
+     */
+    showUnderline?: boolean;
+    /**
+     * Mark as true if the link destination is outside of the app. Causes the
+     * link to open in a new tab.
+     * @default false
+     */
+    isExternal?: boolean;
+    /**
+     * Whether or not to apply styling to inner svgs.
+     * Some text links may include an icon that you wish to style similarly to the text
+     * (e.g. hover change colors/animations)
+     */
+    applyHoverStylesToInnerSvg?: boolean;
+};
+export {};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/text-link/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/text-link/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEtC,OAAO,KAAK,EAAE,SAAS,EAAE,qBAA4B;AAErD,KAAK,iBAAiB,GAAG,IAAI,CAAC,SAAS,EAAE,SAAS,GAAG,OAAO,CAAC,CAAA;AAE7D,MAAM,MAAM,aAAa,GAAG,iBAAiB,GAC3C,IAAI,CACF,SAAS,CAAC,iBAAiB,CAAC,EAE5B,MAAM,GAAG,OAAO,GAAG,KAAK,CACzB,GAAG;IACF;;;OAGG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IAEjB;;;OAGG;IACH,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,UAAU,CAAA;IAExD;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAElC;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAA;IAEvB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB;;;;OAIG;IACH,0BAA0B,CAAC,EAAE,OAAO,CAAA;CACrC,CAAA"}

package/dist/components/typography/Icons/Icon.d.ts

@@ -0,0 +1,22 @@
+import type { ComponentType, SVGProps } from 'react';
+import type { ColorValue } from 'types/colors';
+type IconSize = 'xxSmall' | 'xSmall' | 'small' | 'medium' | 'large' | 'xLarge' | 'xxLarge' | 'xxxLarge';
+type IconProps = {
+    color?: ColorValue;
+    size?: IconSize;
+} & SVGProps<SVGSVGElement>;
+export type IconComponent = ComponentType<IconProps>;
+/** Renders a harmony Icon component
+ * Ex: `<Icon icon={IconKebabHorizontal} color='accentGreen' />`
+ * Use `size` to render one of the standard sizes:
+ * - xSmall: 14
+ * - small: 16
+ * - medium: 20
+ * - large: 24
+ * - xLarge: 30
+ * - xxLarge: 32
+ * - xxxLarge: 40
+ */
+export declare const Icon: (props: IconProps) => JSX.Element;
+export {};
+//# sourceMappingURL=Icon.d.ts.map

package/dist/components/typography/Icons/Icon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.d.ts","sourceRoot":"","sources":["../../../../src/components/typography/Icons/Icon.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAIpD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAA;AAO9C,KAAK,QAAQ,GACT,SAAS,GACT,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,OAAO,GACP,QAAQ,GACR,SAAS,GACT,UAAU,CAAA;AAEd,KAAK,SAAS,GAAG;IACf,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,IAAI,CAAC,EAAE,QAAQ,CAAA;CAChB,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAA;AAE3B,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC,SAAS,CAAC,CAAA;AAEpD;;;;;;;;;;GAUG;AACH,eAAO,MAAM,IAAI,UAAW,SAAS,gBA6BpC,CAAA"}

package/dist/components/typography/Icons/Icon.js

@@ -0,0 +1,34 @@
+import { jsx } from 'react/jsx-runtime';
+import cn from 'classnames';
+import { toCSSVariableName } from '../../../utils/styles.js';
+import styles from './Icon.module.css.js';
+
+/** Renders a harmony Icon component
+ * Ex: `<Icon icon={IconKebabHorizontal} color='accentGreen' />`
+ * Use `size` to render one of the standard sizes:
+ * - xSmall: 14
+ * - small: 16
+ * - medium: 20
+ * - large: 24
+ * - xLarge: 30
+ * - xxLarge: 32
+ * - xxxLarge: 40
+ */
+const Icon = (props) => {
+    const { className, color, children, size = 'large', style: styleProp, ...iconProps } = props;
+    const style = color
+        ? {
+            ...styleProp,
+            '--icon-color': `var(${toCSSVariableName(color)})`
+        }
+        : styleProp;
+    const childProps = {
+        ...iconProps,
+        className: cn(styles.icon, { [styles.iconColor]: color }, styles[size], className),
+        style
+    };
+    return jsx("svg", { ...childProps, children: children });
+};
+
+export { Icon };
+//# sourceMappingURL=Icon.js.map

package/dist/components/typography/Icons/Icon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.js","sources":["../../../../src/components/typography/Icons/Icon.tsx"],"sourcesContent":["import type { ComponentType, SVGProps } from 'react'\n\nimport cn from 'classnames'\n\nimport type { ColorValue } from 'types/colors'\nimport { toCSSVariableName } from 'utils/styles'\n\nimport styles from './Icon.module.css'\n\n// TODO use emotion theme's spacing and colors to generate the types here\n\ntype IconSize =\n  | 'xxSmall' // 12\n  | 'xSmall' // 14\n  | 'small' // 16\n  | 'medium' // 20\n  | 'large' // 24\n  | 'xLarge' // 30\n  | 'xxLarge' // 32\n  | 'xxxLarge' // 40\n\ntype IconProps = {\n  color?: ColorValue\n  size?: IconSize\n} & SVGProps<SVGSVGElement>\n\nexport type IconComponent = ComponentType<IconProps>\n\n/** Renders a harmony Icon component\n * Ex: `<Icon icon={IconKebabHorizontal} color='accentGreen' />`\n * Use `size` to render one of the standard sizes:\n * - xSmall: 14\n * - small: 16\n * - medium: 20\n * - large: 24\n * - xLarge: 30\n * - xxLarge: 32\n * - xxxLarge: 40\n */\nexport const Icon = (props: IconProps) => {\n  const {\n    className,\n    color,\n    children,\n    size = 'large',\n    style: styleProp,\n    ...iconProps\n  } = props\n\n  const style = color\n    ? {\n        ...styleProp,\n        '--icon-color': `var(${toCSSVariableName(color)})`\n      }\n    : styleProp\n\n  const childProps = {\n    ...iconProps,\n    className: cn(\n      styles.icon,\n      { [styles.iconColor]: color },\n      styles[size],\n      className\n    ),\n    style\n  }\n\n  return <svg {...childProps}>{children}</svg>\n}\n"],"names":["_jsx"],"mappings":";;;;;AA4BA;;;;;;;;;;AAUG;AACU,MAAA,IAAI,GAAG,CAAC,KAAgB,KAAI;IACvC,MAAM,EACJ,SAAS,EACT,KAAK,EACL,QAAQ,EACR,IAAI,GAAG,OAAO,EACd,KAAK,EAAE,SAAS,EAChB,GAAG,SAAS,EACb,GAAG,KAAK,CAAA;IAET,MAAM,KAAK,GAAG,KAAK;AACjB,UAAE;AACE,YAAA,GAAG,SAAS;AACZ,YAAA,cAAc,EAAE,CAAO,IAAA,EAAA,iBAAiB,CAAC,KAAK,CAAC,CAAG,CAAA,CAAA;AACnD,SAAA;UACD,SAAS,CAAA;AAEb,IAAA,MAAM,UAAU,GAAG;AACjB,QAAA,GAAG,SAAS;QACZ,SAAS,EAAE,EAAE,CACX,MAAM,CAAC,IAAI,EACX,EAAE,CAAC,MAAM,CAAC,SAAS,GAAG,KAAK,EAAE,EAC7B,MAAM,CAAC,IAAI,CAAC,EACZ,SAAS,CACV;QACD,KAAK;KACN,CAAA;AAED,IAAA,OAAOA,GAAS,CAAA,KAAA,EAAA,EAAA,GAAA,UAAU,EAAG,QAAA,EAAA,QAAQ,GAAO,CAAA;AAC9C;;;;"}

package/dist/components/typography/Icons/Icon.module.css.js

@@ -0,0 +1,4 @@
+var styles = {"icon":"Icon-module_icon__X1zBa","iconColor":"Icon-module_iconColor__5ktH2","xSmall":"Icon-module_xSmall__Ald8V","small":"Icon-module_small__F-OTf","medium":"Icon-module_medium__u5cZ7","large":"Icon-module_large__oNbgL","xLarge":"Icon-module_xLarge__YFouA","xxLarge":"Icon-module_xxLarge__JLs6x","xxxLarge":"Icon-module_xxxLarge__5R74d"};
+
+export { styles as default };
+//# sourceMappingURL=Icon.module.css.js.map

package/dist/components/typography/Icons/Icon.module.css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Icon.module.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}