npm - @audius/harmony - Versions diffs - 0.0.25 → 0.0.28 - Mend

@audius/harmony 0.0.25 → 0.0.28

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

package/README.md CHANGED Viewed

@@ -1,6 +1,6 @@
 <p align="center">
-  <img height="288px" src="./src/storybook/assets/harmonyLogoDark.png#gh-dark-mode-only">
-  <img height="288px" src="./src/storybook/assets/harmonyLogo.png#gh-light-mode-only">
+  <img height="288px" src="https://github.com/AudiusProject/audius-protocol/blob/main/packages/harmony/src/storybook/assets/harmonyLogoDark.png#gh-dark-mode-only">
+  <img height="288px" src="https://github.com/AudiusProject/audius-protocol/blob/main/packages/harmony/src/storybook/assets/harmonyLogo.png?raw=true#gh-light-mode-only">
   <p align="center">
     Harmony is design system focused on collaboration, reusability, and scalability.
@@ -48,18 +48,15 @@ Setup the ThemeProvider exported by Harmony
 import { ThemeProvider as HarmonyThemeProvider } from '@audius/harmony'
 const App = () => {
-  return (
-    <HarmonyThemeProvider theme='day'>
-        ...
-    </HarmonyThemeProvider>
-  )
+  return <HarmonyThemeProvider theme='day'>...</HarmonyThemeProvider>
 }
 ```
 In order use emotion yourself, follow their documentation for [setting up the css-prop](https://emotion.sh/docs/css-prop)
-If using typescript add an emotion.d.ts file and include the following for access to harmony's theme type
+If using typescript you will need to:
+1. Add an emotion.d.ts file and include the following for access to harmony's theme type
 ```ts
 import '@emotion/react'
@@ -68,18 +65,28 @@ import type { HarmonyTheme } from '@audius/harmony'
 declare module '@emotion/react' {
   export interface Theme extends HarmonyTheme {}
 }
+```
+2. Update your tsconfig to specify the jsxImportLocation:
+```ts
+{
+  "compilerOptions": {
+    "jsxImportSource": "@emotion/react",
+    ...
+  }
+}
 ```
 ## Usage
 ```tsx
-import { Button, ButtonType, Flex } from '@audius/harmony'
+import { Button, Flex } from '@audius/harmony'
 const App = () => {
   return (
     <Flex gap='m'>
-      <Button variant={ButtonType.SECONDARY}>Click This!</Button>
+      <Button variant='secondary'>Click This!</Button>
       <Button>Click That!</Button>
     </Flex>
   )
@@ -97,4 +104,3 @@ npm run storybook
 ## Contribution
 A Contribution Guide is [available here](https://www.notion.so/audiusproject/Submitting-for-Design-Updates-52a8bc3bb68747818a96d2721bace27f).

package/dist/components/hint/Hint.d.ts CHANGED Viewed

@@ -1,7 +1,9 @@
+import { ReactNode } from 'react';
 import type { IconComponent } from "../icon";
 import { PaperProps } from "../layout/Paper";
 type HintProps = {
     icon: IconComponent;
+    actions?: ReactNode;
 } & PaperProps;
 export declare const Hint: (props: HintProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/hint/Hint.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Hint.d.ts","sourceRoot":"","sources":["../../../src/components/hint/Hint.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,gBAAuB;~~AACpD~~,OAAO,EAAS,UAAU,EAAE,wBAA+B;AAG3D,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,aAAa,CAAA;CACpB,GAAG,UAAU,CAAA;AAKd,eAAO,MAAM,IAAI,UAAW,SAAS,~~qDAoBpC~~,CAAA"}
1	+ {"version":3,"file":"Hint.d.ts","sourceRoot":"","sources":["../../../src/components/hint/Hint.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,KAAK,EAAE,aAAa,EAAE,gBAAuB;AAEpD,OAAO,EAAS,UAAU,EAAE,wBAA+B;AAG3D,KAAK,SAAS,GAAG;IACf,IAAI,EAAE,aAAa,CAAA;IACnB,OAAO,CAAC,EAAE,SAAS,CAAA;CACpB,GAAG,UAAU,CAAA;AAKd,eAAO,MAAM,IAAI,UAAW,SAAS,qDA2BpC,CAAA"}

package/dist/components/hint/Hint.js CHANGED Viewed

@@ -1,14 +1,18 @@
 import { __rest, __assign } from '../../_virtual/_tslib.js';
 import { jsxs, jsx } from '@emotion/react/jsx-runtime';
+import '../layout/Box/Box.js';
+import '@emotion/react';
+import { Flex } from '../layout/Flex/Flex.js';
 import { Paper } from '../layout/Paper/Paper.js';
+import '../layout/Popup/Popup.js';
 import { Text } from '../text/Text/Text.js';
 /*
  * A way of informing the user of important details in line in a prominent way.
  */
 var Hint = function (props) {
-    var Icon = props.icon, children = props.children, other = __rest(props, ["icon", "children"]);
-    return (jsxs(Paper, __assign({ role: 'alert', ph: 'l', pv: 'm', backgroundColor: 'surface2', alignItems: 'center', gap: 'l', shadow: 'flat', border: 'strong' }, other, { children: [jsx(Icon, { size: 'l', color: 'default' }), jsx(Text, __assign({ variant: 'body', color: 'default' }, { children: children }))] })));
+    var Icon = props.icon, children = props.children, actions = props.actions, other = __rest(props, ["icon", "children", "actions"]);
+    return (jsxs(Paper, __assign({ role: 'alert', backgroundColor: 'surface2', ph: 'l', pv: 'm', direction: 'column', gap: 'm', shadow: 'flat', border: 'strong' }, other, { children: [jsxs(Flex, __assign({ gap: 'l', alignItems: 'center' }, { children: [jsx(Icon, { size: 'l', color: 'default' }), jsx(Text, __assign({ variant: 'body', color: 'default' }, { children: children }))] })), actions ? (jsx(Flex, __assign({ pl: 'unit10', gap: 'l' }, { children: actions }))) : null] })));
 };
 export { Hint };

package/dist/components/hint/Hint.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Hint.js","sources":["../../../src/components/hint/Hint.tsx"],"sourcesContent":["import type { IconComponent } from 'components/icon'\nimport { Paper, PaperProps } from 'components/layout/Paper'\nimport { Text } from 'components/text'\n\ntype HintProps = {\n icon: IconComponent\n} & PaperProps\n\n/\n A way of informing the user of important details in line in a prominent way.\n */\nexport const Hint = (props: HintProps) => {\n const { icon: Icon, children, ...other } = props\n return (\n <Paper\n role='alert'\n ph='l'\n pv='m'\n ~~backgroundColor~~='~~surface2~~'\n ~~alignItems~~='~~center~~'\n gap='l'\n shadow='flat'\n border='strong'\n {...other}\n >\n <Icon size='l' color='default' />\n <Text variant='body' color='default'>\n {children}\n </Text>\n </Paper>\n )\n}\n"],"names":["_jsxs","_jsx"],"mappings":"~~;;;;;AAQA~~;;AAEG;AACI,IAAM,IAAI,GAAG,UAAC,KAAgB,EAAA;~~AAC3B~~,~~IAAA,~~IAAM,IAAI,~~GAAyB~~,KAAK,~~CAA9B~~,~~IAAA~~,EAAE,QAAQ,~~GAAe~~,KAAK,~~CAApB~~,QAAA,~~EAAK~~,KAAK,~~GAAK~~,~~MAAA~~,~~CAAA~~,KAAK,~~EAA1C~~,~~CAAA~~,MAAA,EAAA,UAAA,~~CAAkC~~,CAAF,CAAU;~~AAChD~~,~~IAAA,~~QACEA,~~IAAA~~,~~CAAC,~~KAAK,EAAA,QAAA,CAAA,EACJ,IAAI,EAAC,OAAO,EACZ,~~EAAE~~,EAAC,~~GAAG~~,~~EACN~~,EAAE,EAAC,GAAG,EACN,~~eAAe~~,EAAC,~~UAAU~~,~~EAC1B~~,~~UAAU~~,EAAC,QAAQ,~~EACnB~~,GAAG,EAAC,GAAG,EACP,MAAM,EAAC,MAAM,EACb,MAAM,EAAC,QAAQ,EAAA,~~EACX,~~KAAK,EAAA,EAAA,QAAA,EAAA,~~CAETC~~,~~GAAC~~,~~CAAA~~,IAAI,EAAC,EAAA,IAAI,EAAC,GAAG,EAAC,KAAK,EAAC,SAAS,~~EAAA~~,~~CAAG~~,EACjCA,~~GAAA~~,~~CAAC~~,IAAI,~~EAAA~~,~~QAAA,CAAA,EAAC,~~OAAO,EAAC,MAAM,EAAC,KAAK,EAAC,SAAS,~~EACjC~~,EAAA,EAAA,QAAA,~~EAAA~~,QAAQ,~~EACJ~~,CAAA,CAAA,CAAA,EAAA,CAAA,~~CACD~~,EACT;AACH;;;;"}
1	+ {"version":3,"file":"Hint.js","sources":["../../../src/components/hint/Hint.tsx"],"sourcesContent":["import { ReactNode } from 'react'\n\nimport type { IconComponent } from 'components/icon'\nimport { Flex } from 'components/layout'\nimport { Paper, PaperProps } from 'components/layout/Paper'\nimport { Text } from 'components/text'\n\ntype HintProps = {\n icon: IconComponent\n actions?: ReactNode\n} & PaperProps\n\n/\n A way of informing the user of important details in line in a prominent way.\n */\nexport const Hint = (props: HintProps) => {\n const { icon: Icon, children, actions, ...other } = props\n return (\n <Paper\n role='alert'\n backgroundColor='surface2'\n ph='l'\n pv='m'\n direction='column'\n gap='m'\n shadow='flat'\n border='strong'\n {...other}\n >\n <Flex gap='l' alignItems='center'>\n <Icon size='l' color='default' />\n <Text variant='body' color='default'>\n {children}\n </Text>\n </Flex>\n {actions ? (\n <Flex pl='unit10' gap='l'>\n {actions}\n </Flex>\n ) : null}\n </Paper>\n )\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;;;;;;AAYA;;AAEG;AACI,IAAM,IAAI,GAAG,UAAC,KAAgB,EAAA;IAC3B,IAAM,IAAI,GAAkC,KAAK,CAAA,IAAvC,EAAE,QAAQ,GAAwB,KAAK,CAA7B,QAAA,EAAE,OAAO,GAAe,KAAK,QAApB,EAAK,KAAK,UAAK,KAAK,EAAnD,CAA2C,MAAA,EAAA,UAAA,EAAA,SAAA,CAAA,CAAF,CAAU;IACzD,QACEA,KAAC,KAAK,EAAA,QAAA,CAAA,EACJ,IAAI,EAAC,OAAO,EACZ,eAAe,EAAC,UAAU,EAC1B,EAAE,EAAC,GAAG,EACN,EAAE,EAAC,GAAG,EACN,SAAS,EAAC,QAAQ,EAClB,GAAG,EAAC,GAAG,EACP,MAAM,EAAC,MAAM,EACb,MAAM,EAAC,QAAQ,EACX,EAAA,KAAK,eAETA,IAAC,CAAA,IAAI,aAAC,GAAG,EAAC,GAAG,EAAC,UAAU,EAAC,QAAQ,EAC/B,EAAA,EAAA,QAAA,EAAA,CAAAC,GAAA,CAAC,IAAI,EAAC,EAAA,IAAI,EAAC,GAAG,EAAC,KAAK,EAAC,SAAS,EAAG,CAAA,EACjCA,GAAC,CAAA,IAAI,aAAC,OAAO,EAAC,MAAM,EAAC,KAAK,EAAC,SAAS,EAAA,EAAA,EAAA,QAAA,EACjC,QAAQ,EAAA,CAAA,CACJ,CACF,EAAA,CAAA,CAAA,EACN,OAAO,IACNA,GAAA,CAAC,IAAI,EAAC,QAAA,CAAA,EAAA,EAAE,EAAC,QAAQ,EAAC,GAAG,EAAC,GAAG,EAAA,EAAA,EAAA,QAAA,EACtB,OAAO,EAAA,CAAA,CACH,IACL,IAAI,CACF,EAAA,CAAA,CAAA,EACT;AACH;;;;"}

package/dist/components/icon.d.ts CHANGED Viewed

@@ -1,8 +1,7 @@
 import type { ComponentType, SVGProps } from 'react';
 import type { IconColors } from '../foundations/color/semantic';
 import type { ShadowOptions } from '../foundations/shadows';
-import { iconSizes } from '../foundations/spacing';
-type IconSize = keyof typeof iconSizes;
+import { IconSize } from '../foundations/spacing';
 type SVGBaseProps = SVGProps<SVGSVGElement>;
 export type IconProps = {
     color?: IconColors;

package/dist/components/icon.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../src/components/icon.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEpD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAA;AAC/D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAA;AAC3D,OAAO,EAAE,~~SAAS~~,EAAE,MAAM,wBAAwB,CAAA;~~AAElD~~,KAAK,~~QAAQ,GAAG,MAAM,OAAO,SAAS,CAAA;AAEtC,KAAK,~~YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAA;AAE3C,MAAM,MAAM,SAAS,GAAG;IACtB,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,KAAK,CAAC,EAAE,QAAQ,CAAA;IAChB,KAAK,CAAC,EAAE,QAAQ,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,aAAa,CAAA;CACvB,CAAA;AAED,KAAK,YAAY,GAAG,YAAY,GAAG,SAAS,CAAA;AAE5C,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC,YAAY,GAAG,YAAY,CAAC,CAAA"}
1	+ {"version":3,"file":"icon.d.ts","sourceRoot":"","sources":["../../src/components/icon.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAEpD,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAA;AAC/D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AAEjD,KAAK,YAAY,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAA;AAE3C,MAAM,MAAM,SAAS,GAAG;IACtB,KAAK,CAAC,EAAE,UAAU,CAAA;IAClB,IAAI,CAAC,EAAE,QAAQ,CAAA;IACf,KAAK,CAAC,EAAE,QAAQ,CAAA;IAChB,KAAK,CAAC,EAAE,QAAQ,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,MAAM,CAAC,EAAE,aAAa,CAAA;CACvB,CAAA;AAED,KAAK,YAAY,GAAG,YAAY,GAAG,SAAS,CAAA;AAE5C,MAAM,MAAM,aAAa,GAAG,aAAa,CAAC,YAAY,GAAG,YAAY,CAAC,CAAA"}

package/dist/components/input/PasswordInput/PasswordInput.js CHANGED Viewed

@@ -11,6 +11,7 @@ import '../../button/FollowButton/FollowButton.js';
 import '../../button/FilterButton/FilterButton.js';
 import { IconButton } from '../../button/IconButton/IconButton.js';
 import { TextInput } from '../TextInput/TextInput.js';
+import '../TextInput/types.js';
 var messages = {
     hidePasswordInput: 'Hide password input',

package/dist/components/input/PasswordInput/PasswordInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PasswordInput.js","sources":["../../../../src/components/input/PasswordInput/PasswordInput.tsx"],"sourcesContent":["import { forwardRef } from 'react'\n\nimport { useToggle } from 'react-use'\n\nimport { IconButton } from 'components/button'\nimport { IconVisibilityHidden, IconVisibilityPublic } from 'icons'\n\nimport { TextInput } from '../TextInput'\n\nimport type { PasswordInputProps } from './types'\n\nconst messages = {\n hidePasswordInput: 'Hide password input',\n showPasswordInput: 'Show password input'\n}\n\nexport const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(\n (props, ref) => {\n const { hideVisibilityToggle, ...restProps } = props\n const [isPasswordVisible, toggleIsPasswordVisible] = useToggle(false)\n const VisibilityIcon = isPasswordVisible\n ? IconVisibilityPublic\n : IconVisibilityHidden\n\n return (\n <TextInput\n ref={ref}\n type={isPasswordVisible ? 'text' : 'password'}\n endAdornment={\n hideVisibilityToggle ? null : (\n <IconButton\n icon={VisibilityIcon}\n color='subdued'\n onClick={toggleIsPasswordVisible}\n aria-label={\n isPasswordVisible\n ? messages.hidePasswordInput\n : messages.showPasswordInput\n }\n ripple\n />\n )\n }\n {...restProps}\n />\n )\n }\n)\n"],"names":["_jsx"],"mappings":"~~;;;;;;;;;;;;;;~~AAWA,IAAM,QAAQ,GAAG;AACf,IAAA,iBAAiB,EAAE,qBAAqB;AACxC,IAAA,iBAAiB,EAAE,qBAAqB;CACzC,CAAA;IAEY,aAAa,GAAG,UAAU,CACrC,UAAC,KAAK,EAAE,GAAG,EAAA;IACD,IAAA,oBAAoB,GAAmB,KAAK,CAAxB,oBAAA,EAAK,SAAS,GAAA,MAAA,CAAK,KAAK,EAA9C,CAAsC,sBAAA,CAAA,CAAF,CAAU;IAC9C,IAAA,EAAA,GAA+C,SAAS,CAAC,KAAK,CAAC,EAA9D,iBAAiB,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,uBAAuB,GAAA,EAAA,CAAA,CAAA,CAAoB,CAAA;IACrE,IAAM,cAAc,GAAG,iBAAiB;AACtC,UAAE,oBAAoB;UACpB,oBAAoB,CAAA;IAExB,QACEA,IAAC,SAAS,EAAA,QAAA,CAAA,EACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,iBAAiB,GAAG,MAAM,GAAG,UAAU,EAC7C,YAAY,EACV,oBAAoB,GAAG,IAAI,IACzBA,GAAA,CAAC,UAAU,EACT,EAAA,IAAI,EAAE,cAAc,EACpB,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,uBAAuB,EAAA,YAAA,EAE9B,iBAAiB;kBACb,QAAQ,CAAC,iBAAiB;AAC5B,kBAAE,QAAQ,CAAC,iBAAiB,EAEhC,MAAM,EACN,IAAA,EAAA,CAAA,CACH,EAEC,EAAA,SAAS,CACb,CAAA,EACH;AACH,CAAC;;;;"}
1	+ {"version":3,"file":"PasswordInput.js","sources":["../../../../src/components/input/PasswordInput/PasswordInput.tsx"],"sourcesContent":["import { forwardRef } from 'react'\n\nimport { useToggle } from 'react-use'\n\nimport { IconButton } from 'components/button'\nimport { IconVisibilityHidden, IconVisibilityPublic } from 'icons'\n\nimport { TextInput } from '../TextInput'\n\nimport type { PasswordInputProps } from './types'\n\nconst messages = {\n hidePasswordInput: 'Hide password input',\n showPasswordInput: 'Show password input'\n}\n\nexport const PasswordInput = forwardRef<HTMLInputElement, PasswordInputProps>(\n (props, ref) => {\n const { hideVisibilityToggle, ...restProps } = props\n const [isPasswordVisible, toggleIsPasswordVisible] = useToggle(false)\n const VisibilityIcon = isPasswordVisible\n ? IconVisibilityPublic\n : IconVisibilityHidden\n\n return (\n <TextInput\n ref={ref}\n type={isPasswordVisible ? 'text' : 'password'}\n endAdornment={\n hideVisibilityToggle ? null : (\n <IconButton\n icon={VisibilityIcon}\n color='subdued'\n onClick={toggleIsPasswordVisible}\n aria-label={\n isPasswordVisible\n ? messages.hidePasswordInput\n : messages.showPasswordInput\n }\n ripple\n />\n )\n }\n {...restProps}\n />\n )\n }\n)\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;;;;AAWA,IAAM,QAAQ,GAAG;AACf,IAAA,iBAAiB,EAAE,qBAAqB;AACxC,IAAA,iBAAiB,EAAE,qBAAqB;CACzC,CAAA;IAEY,aAAa,GAAG,UAAU,CACrC,UAAC,KAAK,EAAE,GAAG,EAAA;IACD,IAAA,oBAAoB,GAAmB,KAAK,CAAxB,oBAAA,EAAK,SAAS,GAAA,MAAA,CAAK,KAAK,EAA9C,CAAsC,sBAAA,CAAA,CAAF,CAAU;IAC9C,IAAA,EAAA,GAA+C,SAAS,CAAC,KAAK,CAAC,EAA9D,iBAAiB,GAAA,EAAA,CAAA,CAAA,CAAA,EAAE,uBAAuB,GAAA,EAAA,CAAA,CAAA,CAAoB,CAAA;IACrE,IAAM,cAAc,GAAG,iBAAiB;AACtC,UAAE,oBAAoB;UACpB,oBAAoB,CAAA;IAExB,QACEA,IAAC,SAAS,EAAA,QAAA,CAAA,EACR,GAAG,EAAE,GAAG,EACR,IAAI,EAAE,iBAAiB,GAAG,MAAM,GAAG,UAAU,EAC7C,YAAY,EACV,oBAAoB,GAAG,IAAI,IACzBA,GAAA,CAAC,UAAU,EACT,EAAA,IAAI,EAAE,cAAc,EACpB,KAAK,EAAC,SAAS,EACf,OAAO,EAAE,uBAAuB,EAAA,YAAA,EAE9B,iBAAiB;kBACb,QAAQ,CAAC,iBAAiB;AAC5B,kBAAE,QAAQ,CAAC,iBAAiB,EAEhC,MAAM,EACN,IAAA,EAAA,CAAA,CACH,EAEC,EAAA,SAAS,CACb,CAAA,EACH;AACH,CAAC;;;;"}

package/dist/components/input/SelectablePill/SelectablePill.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SelectablePill.d.ts","sourceRoot":"","sources":["../../../../src/components/input/SelectablePill/SelectablePill.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;~~AAkBlD~~,eAAO,MAAM,cAAc,UAAW,mBAAmB,~~qDAqIxD~~,CAAA"}
1	+ {"version":3,"file":"SelectablePill.d.ts","sourceRoot":"","sources":["../../../../src/components/input/SelectablePill/SelectablePill.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AASlD,eAAO,MAAM,cAAc,UAAW,mBAAmB,qDAuIxD,CAAA"}

package/dist/components/input/SelectablePill/SelectablePill.js CHANGED Viewed

@@ -7,12 +7,15 @@ import { Text } from '../../text/Text/Text.js';
 var RadioInput = function (props) {
     var _a = useRadioGroup(props), name = _a.name, checked = _a.checked, onChange = _a.onChange;
-    var isSelected = props.isSelected;
-    return (jsx(HiddenInput, __assign({}, props, { name: name, checked: checked !== null && checked !== void 0 ? checked : isSelected, onChange: onChange })));
+    return (jsx(HiddenInput, __assign({}, props, { name: name, checked: checked, onChange: onChange })));
 };
 var SelectablePill = function (props) {
-    var isSelected = props.isSelected, _a = props.size, size = _a === void 0 ? 'small' : _a, _isHovered = props._isHovered, Icon = props.icon, className = props.className, other = __rest(props, ["isSelected", "size", "_isHovered", "icon", "className"]);
+    var _a;
+    var isSelectedProp = props.isSelected, _b = props.size, size = _b === void 0 ? 'small' : _b, _isHovered = props._isHovered, Icon = props.icon, className = props.className, other = __rest(props, ["isSelected", "size", "_isHovered", "icon", "className"]);
     var disabled = other.disabled, type = other.type;
+    var isSelected = type === 'checkbox' || type === 'radio'
+        ? (_a = other.checked) !== null && _a !== void 0 ? _a : isSelectedProp
+        : isSelectedProp;
     var theme = useTheme();
     var spacing = theme.spacing;
     var hoverCss = __assign({ backgroundColor: theme.color.secondary.s200, color: theme.color.static.white, border: "1px solid ".concat(theme.color.secondary.secondary) }, (size === 'large' && {
@@ -51,11 +54,10 @@ var SelectablePill = function (props) {
     var pillContent = (jsxs(Fragment, { children: [Icon ? jsx(Icon, { css: iconCss }) : null, 'label' in other ? (jsx(Text, __assign({ variant: size === 'oversized' ? 'heading' : 'body', tag: 'span', css: size === 'oversized' && { textTransform: 'uppercase' } }, { children: other.label }))) : null] }));
     switch (type) {
         case 'checkbox': {
-            var checked = other.checked, rest = __rest(other, ["checked"]);
-            return (jsxs("label", __assign({}, rootProps, { children: [pillContent, jsx(HiddenInput, __assign({}, rest, { checked: checked !== null && checked !== void 0 ? checked : isSelected }))] })));
+            return (jsxs("label", __assign({}, rootProps, { children: [pillContent, jsx(HiddenInput, __assign({}, other, { checked: isSelected }))] })));
         }
         case 'radio': {
-            return (jsxs("label", __assign({}, rootProps, { children: [pillContent, jsx(RadioInput, __assign({}, other, { isSelected: isSelected }))] })));
+            return (jsxs("label", __assign({}, rootProps, { children: [pillContent, jsx(RadioInput, __assign({}, other, { checked: isSelected }))] })));
         }
         case 'button':
         case 'reset':

package/dist/components/input/SelectablePill/SelectablePill.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"SelectablePill.js","sources":["../../../../src/components/input/SelectablePill/SelectablePill.tsx"],"sourcesContent":["import { ComponentProps } from 'react'\n\nimport { CSSObject, useTheme } from '@emotion/react'\n\nimport { HiddenInput } from 'components/common/HiddenInput'\nimport { useRadioGroup } from 'components/radio-group/useRadioGroup'\nimport { Text } from 'components/text'\n\nimport type { SelectablePillProps } from './types'\n\nconst RadioInput = (\n props: ComponentProps<'input'> ~~& { isSelected?: boolean }\n~~) => {\n const { name, checked, onChange } = useRadioGroup(props)\n ~~const { isSelected } = props\n\n~~ return (\n <HiddenInput\n {...props}\n name={name}\n checked={checked ~~?? isSelected}\n~~ onChange={onChange}\n />\n )\n}\n\nexport const SelectablePill = (props: SelectablePillProps) => {\n const {\n isSelected,\n size = 'small',\n _isHovered,\n icon: Icon,\n className,\n ...other\n } = props\n\n const { disabled, type } = other\n\n const theme = useTheme()\n const { spacing } = theme\n\n const hoverCss: CSSObject = {\n backgroundColor: theme.color.secondary.s200,\n color: theme.color.static.white,\n border: `1px solid ${theme.color.secondary.secondary}`,\n ...(size === 'large' && {\n backgroundColor: theme.color.secondary.s100,\n border: `1px solid ${theme.color.secondary.s200}`,\n boxShadow: 'none'\n })\n }\n\n const activeCss: CSSObject = {\n backgroundColor: theme.color.secondary.s400,\n color: theme.color.static.white,\n border: `1px solid ${theme.color.secondary.s400}`,\n\n ...(size === 'large' && {\n boxShadow: 'none'\n })\n }\n\n const rootCss: CSSObject = {\n display: 'inline-flex',\n position: 'relative',\n alignItems: 'center',\n justifyContent: 'center',\n gap: theme.spacing.xs,\n color: theme.color.text.default,\n backgroundColor: theme.color.background.white,\n cursor: 'pointer',\n userSelect: 'none',\n transition: 'all 0.12s ease-out',\n textWrap: 'nowrap',\n border: `1px solid ${theme.color.border.strong}`,\n borderRadius: theme.cornerRadius['2xl'],\n ...(size === 'small' && {\n height: theme.spacing.xl,\n paddingInline: theme.spacing.m\n }),\n ...(size === 'large' && {\n height: theme.spacing['2xl'],\n paddingInline: theme.spacing.l,\n boxShadow: theme.shadows.near\n }),\n ...(size === 'oversized' && {\n height: spacing.unit12,\n padding: spacing.m,\n borderWidth: 2\n }),\n ...(disabled && { opacity: 0.45 }),\n ...(_isHovered && hoverCss),\n ...(isSelected && activeCss),\n ...((disabled \|\| _isHovered) && {\n pointerEvents: 'none'\n }),\n ':hover': hoverCss,\n ':active': activeCss\n }\n\n const iconCss = {\n width: spacing.l,\n height: spacing.l,\n\n '& path': {\n fill: 'currentColor'\n }\n }\n\n const rootProps = {\n css: rootCss,\n className\n }\n\n const pillContent = (\n <>\n {Icon ? <Icon css={iconCss} /> : null}\n {'label' in other ? (\n <Text\n variant={size === 'oversized' ? 'heading' : 'body'}\n tag='span'\n css={size === 'oversized' && { textTransform: 'uppercase' }}\n >\n {other.label}\n </Text>\n ) : null}\n </>\n )\n\n switch (type) {\n case 'checkbox': {\n ~~const { checked, ...rest } = other\n\n~~ return (\n <label {...rootProps}>\n {pillContent}\n <HiddenInput {...~~rest~~} checked={~~checked ??~~ isSelected} />\n </label>\n )\n }\n case 'radio': {\n return (\n <label {...rootProps}>\n {pillContent}\n <RadioInput {...other} ~~isSelected~~={isSelected} />\n </label>\n )\n }\n case 'button':\n case 'reset':\n case 'submit':\n default: {\n return (\n <button {...rootProps} {...other}>\n {pillContent}\n </button>\n )\n }\n }\n}\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":";;;;;;;AAUA,IAAM,UAAU,GAAG,~~UACjB~~,~~KAAyD~~,EAAA;~~AAEnD~~,IAAA,IAAA,EAA8B,GAAA,aAAa,CAAC,KAAK,CAAC,EAAhD,IAAI,GAAA,EAAA,CAAA,IAAA,EAAE,OAAO,GAAA,EAAA,CAAA,OAAA,EAAE,QAAQ,cAAyB,CAAA;~~AAChD~~,IAAA,~~IAAA,UAAU,GAAK,KAAK,CAAA,UAAV,CAAU;IAE5B,~~QACEA,GAAC,CAAA,WAAW,~~EACN~~,~~QAAA~~,~~CAAA,~~EAAA,~~EAAA~~,~~KAAK,IACT,~~IAAI,EAAE,IAAI,~~EACV~~,OAAO,EAAE,OAAO,~~KAAP~~,~~IAAA,IAAA,OAAO,KAAP,KAAA,CAAA,GAAA,OAAO,GAAI,UAAU,EAC9B,~~QAAQ,EAAE,QAAQ,~~EAClB~~,CAAA,~~CAAA~~,~~EACH~~;AACH,CAAC,CAAA;AAEM,IAAM,cAAc,GAAG,UAAC,KAA0B,EAAA;AAErD,IAAA,~~IAAA~~,~~UAAU~~,~~GAMR~~,KAAK,CAAA,~~UANG~~,~~EACV~~,EAKE,GAAA,KAAK,CALO,IAAA,EAAd,IAAI,GAAG,EAAA,KAAA,KAAA,CAAA,GAAA,OAAO,GAAA,EAAA,EACd,UAAU,GAIR,KAAK,CAJG,UAAA,EACJ,IAAI,GAGR,KAAK,CAHG,IAAA,EACV,SAAS,GAEP,KAAK,CAFE,SAAA,EACN,KAAK,GACN,MAAA,CAAA,KAAK,EAPH,CAAA,YAAA,EAAA,MAAA,EAAA,YAAA,EAAA,MAAA,EAAA,WAAA,CAOL,CADS,CACD;IAED,IAAA,QAAQ,GAAW,KAAK,CAAA,QAAhB,EAAE,IAAI,GAAK,KAAK,CAAA,IAAV,CAAU;~~AAEhC~~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~~YACP~~,~~IAAA~~,~~OAAO~~,~~GAAc~~,~~KAAK~~,~~CAAnB,~~OAAA,~~EAAK~~,~~IAAI~~,~~GAAA,MAAA,CAAK,KAAK,EAA5B,CAAoB,SAAA,~~CAAA,~~CAAF~~,~~CAAU;YAElC~~,~~QACEC,2BAAW,~~SAAS,~~EAAA~~,EAAA,QAAA,EAAA,~~CACjB~~,WAAW,EACZD,~~GAAA~~,~~CAAC~~,WAAW,~~EAAA~~,QAAA,CAAA,EAAA,~~EAAK~~,~~IAAI~~,~~EAAA~~,~~EAAE,~~OAAO,EAAE,~~OAAO~~,~~KAAP~~,~~IAAA~~,~~IAAA,OAAO,KAAP,KAAA,~~CAAA,~~GAAA,OAAO,GAAI,UAAU,EAAA,~~CAAA,~~CAAI,CACnD,~~EAAA,CAAA,~~CAAA~~,EACT;AACF,SAAA;QACD,KAAK,OAAO,EAAE;AACZ,YAAA,QACEC,IAAW,CAAA,OAAA,EAAA,QAAA,CAAA,EAAA,EAAA,SAAS,EACjB,EAAA,QAAA,EAAA,CAAA,WAAW,EACZD,GAAC,CAAA,UAAU,EAAK,QAAA,CAAA,EAAA,EAAA,KAAK,IAAE,~~UAAU~~,EAAE,UAAU,EAAI,CAAA,CAAA,CAAA,EAAA,CAAA,~~CAC3C~~,EACT;AACF,SAAA;AACD,QAAA,KAAK,QAAQ,CAAC;AACd,QAAA,KAAK,OAAO,CAAC;AACb,QAAA,KAAK,QAAQ,CAAC;AACd,QAAA,SAAS;YACP,QACEA,2BAAY,SAAS,EAAM,KAAK,EAC7B,EAAA,QAAA,EAAA,WAAW,EACL,CAAA,CAAA,EACV;AACF,SAAA;AACF,KAAA;AACH;;;;"}
1	+ {"version":3,"file":"SelectablePill.js","sources":["../../../../src/components/input/SelectablePill/SelectablePill.tsx"],"sourcesContent":["import { ComponentProps } from 'react'\n\nimport { CSSObject, useTheme } from '@emotion/react'\n\nimport { HiddenInput } from 'components/common/HiddenInput'\nimport { useRadioGroup } from 'components/radio-group/useRadioGroup'\nimport { Text } from 'components/text'\n\nimport type { SelectablePillProps } from './types'\n\nconst RadioInput = (props: ComponentProps<'input'>) => {\n const { name, checked, onChange } = useRadioGroup(props)\n return (\n <HiddenInput {...props} name={name} checked={checked} onChange={onChange} />\n )\n}\n\nexport const SelectablePill = (props: SelectablePillProps) => {\n const {\n isSelected: isSelectedProp,\n size = 'small',\n _isHovered,\n icon: Icon,\n className,\n ...other\n } = props\n\n const { disabled, type } = other\n const isSelected =\n type === 'checkbox' \|\| type === 'radio'\n ? other.checked ?? isSelectedProp\n : isSelectedProp\n\n const theme = useTheme()\n const { spacing } = theme\n\n const hoverCss: CSSObject = {\n backgroundColor: theme.color.secondary.s200,\n color: theme.color.static.white,\n border: `1px solid ${theme.color.secondary.secondary}`,\n ...(size === 'large' && {\n backgroundColor: theme.color.secondary.s100,\n border: `1px solid ${theme.color.secondary.s200}`,\n boxShadow: 'none'\n })\n }\n\n const activeCss: CSSObject = {\n backgroundColor: theme.color.secondary.s400,\n color: theme.color.static.white,\n border: `1px solid ${theme.color.secondary.s400}`,\n\n ...(size === 'large' && {\n boxShadow: 'none'\n })\n }\n\n const rootCss: CSSObject = {\n display: 'inline-flex',\n position: 'relative',\n alignItems: 'center',\n justifyContent: 'center',\n gap: theme.spacing.xs,\n color: theme.color.text.default,\n backgroundColor: theme.color.background.white,\n cursor: 'pointer',\n userSelect: 'none',\n transition: 'all 0.12s ease-out',\n textWrap: 'nowrap',\n border: `1px solid ${theme.color.border.strong}`,\n borderRadius: theme.cornerRadius['2xl'],\n ...(size === 'small' && {\n height: theme.spacing.xl,\n paddingInline: theme.spacing.m\n }),\n ...(size === 'large' && {\n height: theme.spacing['2xl'],\n paddingInline: theme.spacing.l,\n boxShadow: theme.shadows.near\n }),\n ...(size === 'oversized' && {\n height: spacing.unit12,\n padding: spacing.m,\n borderWidth: 2\n }),\n ...(disabled && { opacity: 0.45 }),\n ...(_isHovered && hoverCss),\n ...(isSelected && activeCss),\n ...((disabled \|\| _isHovered) && {\n pointerEvents: 'none'\n }),\n ':hover': hoverCss,\n ':active': activeCss\n }\n\n const iconCss = {\n width: spacing.l,\n height: spacing.l,\n\n '& path': {\n fill: 'currentColor'\n }\n }\n\n const rootProps = {\n css: rootCss,\n className\n }\n\n const pillContent = (\n <>\n {Icon ? <Icon css={iconCss} /> : null}\n {'label' in other ? (\n <Text\n variant={size === 'oversized' ? 'heading' : 'body'}\n tag='span'\n css={size === 'oversized' && { textTransform: 'uppercase' }}\n >\n {other.label}\n </Text>\n ) : null}\n </>\n )\n\n switch (type) {\n case 'checkbox': {\n return (\n <label {...rootProps}>\n {pillContent}\n <HiddenInput {...other} checked={isSelected} />\n </label>\n )\n }\n case 'radio': {\n return (\n <label {...rootProps}>\n {pillContent}\n <RadioInput {...other} checked={isSelected} />\n </label>\n )\n }\n case 'button':\n case 'reset':\n case 'submit':\n default: {\n return (\n <button {...rootProps} {...other}>\n {pillContent}\n </button>\n )\n }\n }\n}\n"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/dist/components/input/TextInput/index.d.ts CHANGED Viewed

@@ -1,3 +1,3 @@
 export * from './TextInput';
-export { TextInputProps } from './types';
+export { TextInputProps, TextInputSize } from './types';
 //# sourceMappingURL=index.d.ts.map

package/dist/components/input/TextInput/index.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/input/TextInput/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,OAAO,EAAE,cAAc,EAAE,MAAM,SAAS,CAAA"}
1	+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/input/TextInput/index.ts"],"names":[],"mappings":"AAAA,cAAc,aAAa,CAAA;AAC3B,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA"}

package/dist/components/input/TextInput/types.d.ts CHANGED Viewed

@@ -50,7 +50,7 @@ export type TextInputProps = Omit<ComponentPropsWithoutRef<'input'>, 'size' | 'r
      */
     hideLabel?: boolean;
     /**
-     * Label Text. Required to provide due to accessibility. If the hideLabel is true, the label used via aria-label
+     * Label Text. Required due to accessibility. If hideLabel is true, the label is set via aria-label
      */
     label: string;
     /**

package/dist/components/input/TextInput/types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"types.js","sources":["../../../../src/components/input/TextInput/types.ts"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport type { IconComponent, IconProps } from '../../icon'\n\nexport enum TextInputSize {\n SMALL = 'small',\n DEFAULT = 'default'\n}\n\ntype InternalProps = {\n /*\n @ignore\n * This prop is for internal use only.\n * Toggles the incorrect error state for the storybook docs\n /\n _incorrectError?: boolean\n /\n @ignore\n * This prop is for internal use only.\n * Toggles the hover state for the storybook docs\n /\n _isHovered?: boolean\n /\n @ignore\n * This prop is for internal use only.\n * Toggles the focus state for the storybook docs\n /\n _isFocused?: boolean\n /\n @ignore\n * This prop is for internal use only.\n * Disabled pointer events for storybook docs\n /\n _disablePointerEvents?: boolean\n}\n\nexport type TextInputProps = Omit<\n ComponentPropsWithoutRef<'input'>,\n // Omitting required purely for storybook docs\n 'size' \| 'required'\n> & {\n /\n Input sizes. NOTE: small inputs will not show the label\n * @default default\n /\n size?: TextInputSize\n /\n Toggles warning state (turns border warning color). NOTE: this is not used any where at the moment\n /\n warning?: boolean\n /\n Toggles error state\n /\n error?: boolean\n /\n Hides the label. If the label is hidden the placeholder will show by default instead.\n * @default false\n /\n hideLabel?: boolean\n /\n Label Text. Required ~~to provide~~ due to accessibility. If ~~the~~ hideLabel is true, the label ~~used~~ via aria-label\n /\n label: string\n /\n ClassName on the div wrapping the whole input container (doesn't include assistive text)\n /\n inputRootClassName?: string\n /\n Helper text (or JSX) that shows up below the input\n /\n helperText?: string \| ReactNode\n /\n Floating text on the lefthand side of the input.\n /\n startAdornmentText?: string\n /\n Floating text on the righthand side of the input\n /\n endAdornmentText?: string\n /\n Floating icon on the lefthand side of the input. Note: will float to the left of the label & content\n /\n startIcon?: IconComponent\n /\n Floating icon on the righthand side of the input\n /\n endIcon?: IconComponent\n /\n Override props to supply the start or end Icon\n /\n IconProps?: Partial<IconProps>\n /\n @hidden\n * Floating component on the righthand side of the input. Meant for internal use only.\n /\n endAdornment?: ReactNode\n /\n Required or not. Will add an * to the label if required\n /\n required?: boolean\n /\n 0-1 number representating a percentage threshold to show the max character text. Default is 0.7 (70%)\n * @default 0.7\n /\n showMaxLengthThreshold?: number\n /\n 0-1 number representating a percentage threshold to turn the character limit text orange. Default is 0.9 (90%)\n * @default 0.9\n */\n maxLengthWarningThreshold?: number\n} & InternalProps\n"],"names":[],"mappings":"IAIY,cAGX;AAHD,CAAA,UAAY,aAAa,EAAA;AACvB,IAAA,aAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AACf,IAAA,aAAA,CAAA,SAAA,CAAA,GAAA,SAAmB,CAAA;AACrB,CAAC,EAHW,aAAa,KAAb,aAAa,GAGxB,EAAA,CAAA,CAAA;;;;"}
1	+ {"version":3,"file":"types.js","sources":["../../../../src/components/input/TextInput/types.ts"],"sourcesContent":["import type { ComponentPropsWithoutRef, ReactNode } from 'react'\n\nimport type { IconComponent, IconProps } from '../../icon'\n\nexport enum TextInputSize {\n SMALL = 'small',\n DEFAULT = 'default'\n}\n\ntype InternalProps = {\n /*\n @ignore\n * This prop is for internal use only.\n * Toggles the incorrect error state for the storybook docs\n /\n _incorrectError?: boolean\n /\n @ignore\n * This prop is for internal use only.\n * Toggles the hover state for the storybook docs\n /\n _isHovered?: boolean\n /\n @ignore\n * This prop is for internal use only.\n * Toggles the focus state for the storybook docs\n /\n _isFocused?: boolean\n /\n @ignore\n * This prop is for internal use only.\n * Disabled pointer events for storybook docs\n /\n _disablePointerEvents?: boolean\n}\n\nexport type TextInputProps = Omit<\n ComponentPropsWithoutRef<'input'>,\n // Omitting required purely for storybook docs\n 'size' \| 'required'\n> & {\n /\n Input sizes. NOTE: small inputs will not show the label\n * @default default\n /\n size?: TextInputSize\n /\n Toggles warning state (turns border warning color). NOTE: this is not used any where at the moment\n /\n warning?: boolean\n /\n Toggles error state\n /\n error?: boolean\n /\n Hides the label. If the label is hidden the placeholder will show by default instead.\n * @default false\n /\n hideLabel?: boolean\n /\n Label Text. Required due to accessibility. If hideLabel is true, the label is set via aria-label\n /\n label: string\n /\n ClassName on the div wrapping the whole input container (doesn't include assistive text)\n /\n inputRootClassName?: string\n /\n Helper text (or JSX) that shows up below the input\n /\n helperText?: string \| ReactNode\n /\n Floating text on the lefthand side of the input.\n /\n startAdornmentText?: string\n /\n Floating text on the righthand side of the input\n /\n endAdornmentText?: string\n /\n Floating icon on the lefthand side of the input. Note: will float to the left of the label & content\n /\n startIcon?: IconComponent\n /\n Floating icon on the righthand side of the input\n /\n endIcon?: IconComponent\n /\n Override props to supply the start or end Icon\n /\n IconProps?: Partial<IconProps>\n /\n @hidden\n * Floating component on the righthand side of the input. Meant for internal use only.\n /\n endAdornment?: ReactNode\n /\n Required or not. Will add an * to the label if required\n /\n required?: boolean\n /\n 0-1 number representating a percentage threshold to show the max character text. Default is 0.7 (70%)\n * @default 0.7\n /\n showMaxLengthThreshold?: number\n /\n 0-1 number representating a percentage threshold to turn the character limit text orange. Default is 0.9 (90%)\n * @default 0.9\n */\n maxLengthWarningThreshold?: number\n} & InternalProps\n"],"names":[],"mappings":"IAIY,cAGX;AAHD,CAAA,UAAY,aAAa,EAAA;AACvB,IAAA,aAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AACf,IAAA,aAAA,CAAA,SAAA,CAAA,GAAA,SAAmB,CAAA;AACrB,CAAC,EAHW,aAAa,KAAb,aAAa,GAGxB,EAAA,CAAA,CAAA;;;;"}

package/dist/components/input/TokenAmountInput/TokenAmountInput.js CHANGED Viewed

@@ -4,6 +4,7 @@ import { forwardRef, useCallback } from 'react';
 import BN from 'bn.js';
 import { useControlled } from '../../../hooks/useControlled.js';
 import { TextInput } from '../TextInput/TextInput.js';
+import '../TextInput/types.js';
 /**
  * Format a number to have commas

package/dist/components/input/TokenAmountInput/TokenAmountInput.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TokenAmountInput.js","sources":["../../../../src/components/input/TokenAmountInput/TokenAmountInput.tsx"],"sourcesContent":["import { ChangeEventHandler, Ref, forwardRef, useCallback } from 'react'\n\nimport BN from 'bn.js'\n\nimport { useControlled } from 'hooks/useControlled'\n\nimport { TextInput } from '../TextInput'\n\nimport { TokenAmountInputProps } from './types'\n\n/*\n Format a number to have commas\n /\nconst formatNumberCommas = (num: number \| string) => {\n const parts = num.toString().split('.')\n return (\n parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',') +\n (parts[1] !== undefined ? '.' + parts[1] : '')\n )\n}\n\nexport const TokenAmountInput = forwardRef(\n (props: TokenAmountInputProps, ref: Ref<HTMLInputElement>) => {\n const {\n tokenLabel,\n decimals = 0,\n isWhole = false,\n value: valueProp,\n onChange,\n ...other\n } = props\n\n const [value, setValueState] = useControlled({\n controlledProp: valueProp ? formatNumberCommas(valueProp) : valueProp,\n defaultValue: '',\n componentName: 'TokenAmountInput'\n })\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n const input = e.target.value.replace(/[^0-9.]+/g, '')\n // Regex to grab the whole and decimal parts of the number, stripping duplicate '.' characters\n const match = input.match(/^(?<whole>\\d)(?<dot>.)?(?<decimal>\\d)/)\n const { whole, decimal, dot } = match?.groups \|\| {}\n\n // Conditionally render the decimal part, and only for the number of decimals specified\n const stringAmount =\n dot && decimals && !isWhole\n ? `${whole}.${decimal.substring(0, decimals)}`\n : whole\n\n // Also add the BN to the onChange event for convenience\n let amount = new BN(whole)\n amount = amount.mul(new BN(10 * decimals))\n amount = amount.add(new BN(decimal.padEnd(decimals, '0')))\n setValueState(formatNumberCommas(stringAmount))\n if (onChange) {\n onChange(stringAmount, amount)\n }\n },\n [decimals, isWhole, setValueState, onChange]\n )\n return (\n <TextInput\n ref={ref}\n {...other}\n value={value}\n onChange={handleChange}\n endAdornmentText={tokenLabel}\n />\n )\n }\n)\n"],"names":["_jsx"],"mappings":"~~;;;;;;;~~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"}
1	+ {"version":3,"file":"TokenAmountInput.js","sources":["../../../../src/components/input/TokenAmountInput/TokenAmountInput.tsx"],"sourcesContent":["import { ChangeEventHandler, Ref, forwardRef, useCallback } from 'react'\n\nimport BN from 'bn.js'\n\nimport { useControlled } from 'hooks/useControlled'\n\nimport { TextInput } from '../TextInput'\n\nimport { TokenAmountInputProps } from './types'\n\n/*\n Format a number to have commas\n /\nconst formatNumberCommas = (num: number \| string) => {\n const parts = num.toString().split('.')\n return (\n parts[0].replace(/\\B(?=(\\d{3})+(?!\\d))/g, ',') +\n (parts[1] !== undefined ? '.' + parts[1] : '')\n )\n}\n\nexport const TokenAmountInput = forwardRef(\n (props: TokenAmountInputProps, ref: Ref<HTMLInputElement>) => {\n const {\n tokenLabel,\n decimals = 0,\n isWhole = false,\n value: valueProp,\n onChange,\n ...other\n } = props\n\n const [value, setValueState] = useControlled({\n controlledProp: valueProp ? formatNumberCommas(valueProp) : valueProp,\n defaultValue: '',\n componentName: 'TokenAmountInput'\n })\n\n const handleChange: ChangeEventHandler<HTMLInputElement> = useCallback(\n (e) => {\n const input = e.target.value.replace(/[^0-9.]+/g, '')\n // Regex to grab the whole and decimal parts of the number, stripping duplicate '.' characters\n const match = input.match(/^(?<whole>\\d)(?<dot>.)?(?<decimal>\\d)/)\n const { whole, decimal, dot } = match?.groups \|\| {}\n\n // Conditionally render the decimal part, and only for the number of decimals specified\n const stringAmount =\n dot && decimals && !isWhole\n ? `${whole}.${decimal.substring(0, decimals)}`\n : whole\n\n // Also add the BN to the onChange event for convenience\n let amount = new BN(whole)\n amount = amount.mul(new BN(10 * decimals))\n amount = amount.add(new BN(decimal.padEnd(decimals, '0')))\n setValueState(formatNumberCommas(stringAmount))\n if (onChange) {\n onChange(stringAmount, amount)\n }\n },\n [decimals, isWhole, setValueState, onChange]\n )\n return (\n <TextInput\n ref={ref}\n {...other}\n value={value}\n onChange={handleChange}\n endAdornmentText={tokenLabel}\n />\n )\n }\n)\n"],"names":["_jsx"],"mappings":"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"}

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

	@@ -1 +1 @@
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"}
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,4WAoEhB,CAAA"}

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

@@ -8,10 +8,10 @@ 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 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, ellipses = props.ellipses, other = __rest(props, ["children", "variant", "strength", "size", "color", "shadow", "tag", "asChild", "textAlign", "ellipses"]);
     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 &&
+    var css = __assign(__assign(__assign(__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',
@@ -19,19 +19,23 @@ var Text = forwardRef(function (props, ref) {
         WebkitTextFillColor: 'transparent',
         backgroundClip: 'text',
         backgroundImage: theme.color.text.heading
-    })), (color && color !== 'heading' && { color: theme.color.text[color] })), (variantConfig && __assign(__assign(__assign({
+    })), (color && color !== 'heading' && { color: theme.color.text[color] })), (variantConfig && __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 && {
+        fontWeight: typography.weight[variantConfig.fontWeight[strength]] }, ('css' in variantConfig && variantConfig.css)))), (shadow && {
         textShadow: typography.shadow[shadow]
-    })), { textAlign: textAlign })));
+    })), { textAlign: textAlign }), (ellipses && {
+        overflow: 'hidden',
+        textOverflow: 'ellipsis',
+        whiteSpace: 'nowrap'
+    }));
     // @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 })));
+    var Tag = asChild ? Slot : (_b = tag !== null && tag !== void 0 ? tag : variantTag) !== null && _b !== void 0 ? _b : 'span';
+    return (jsx(Tag, __assign({ ref: ref, css: css }, other, { children: children })));
 });
 export { Text };

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

	@@ -1 +1 @@
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;;;;"}
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 ellipses,\n ...other\n } = props\n\n const theme = useTheme()\n\n const variantConfig = variant && variantStylesMap[variant]\n const css = {\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 }),\n ...(shadow && {\n textShadow: typography.shadow[shadow]\n }),\n textAlign,\n ...(ellipses && {\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap'\n })\n }\n\n // @ts-ignore\n const variantTag = variant && variantTagMap[variant]?.[size]\n\n const Tag: ElementType = asChild ? Slot : tag ?? variantTag ?? 'span'\n\n return (\n <Tag ref={ref} css={css} {...other}>\n {children}\n </Tag>\n )\n }\n)\n"],"names":["_jsx"],"mappings":"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"}

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

@@ -11,6 +11,7 @@ export type BaseTextProps<TextComponentType extends ElementType = 'p'> = {
     shadow?: TextShadow;
     asChild?: boolean;
     textAlign?: CSSProperties['textAlign'];
+    ellipses?: boolean;
 };
 export type TextProps<TextComponentType extends ElementType = 'p'> = BaseTextProps<TextComponentType> & Omit<ComponentProps<TextComponentType>, keyof BaseTextProps | 'ref'>;
 export type TextStrength = 'weak' | 'default' | 'strong';

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

	@@ -1 +1 @@
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"}
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;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,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-link/TextLink.d.ts CHANGED Viewed

@@ -1,6 +1,18 @@
-import type { TextLinkProps } from './types';
+/// <reference types="react" />
 /**
  * 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;
+export declare const TextLink: (props: {
+    [x: string]: any;
+    [x: number]: any;
+    [x: symbol]: any;
+} & Omit<import("react").HTMLProps<HTMLAnchorElement>, "size" | "color" | "ref"> & {
+    asChild?: boolean | undefined;
+    variant?: "default" | "subdued" | "visible" | "inverted" | "secondary" | undefined;
+    textVariant?: import("../text/Text").TextVariant | undefined;
+    showUnderline?: boolean | undefined;
+    isActive?: boolean | undefined;
+    isExternal?: boolean | undefined;
+    applyHoverStylesToInnerSvg?: boolean | undefined;
+} & import("react").RefAttributes<"a">) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
 //# sourceMappingURL=TextLink.d.ts.map

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

	@@ -1 +1 @@
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"}
1	+ {"version":3,"file":"TextLink.d.ts","sourceRoot":"","sources":["../../../src/components/text-link/TextLink.tsx"],"names":[],"mappings":";AASA;;GAEG;AACH,eAAO,MAAM,QAAQ;;;;;;;;;;;;wIA2EnB,CAAA"}

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

@@ -1,5 +1,6 @@
 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 { Text } from '../text/Text/Text.js';
@@ -7,20 +8,22 @@ 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 TextLink = forwardRef(function (props, ref) {
+    var _a = props.asChild, asChild = _a === void 0 ? false : _a, children = props.children, _b = props.variant, variant = _b === void 0 ? 'default' : _b, isActive = props.isActive, _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", "isActive", "isExternal", "onClick", "textVariant", "showUnderline", "applyHoverStylesToInnerSvg"]);
+    var _d = useTheme(), color = _d.color, spacing = _d.spacing;
     var variantColors = {
         default: color.link.default,
         subdued: color.link.subdued,
         visible: color.link.visible,
-        inverted: color.static.white
+        inverted: color.static.white,
+        secondary: color.secondary.secondary
     };
     var variantHoverColors = {
         default: color.primary.p300,
         subdued: color.primary.p300,
         visible: color.link.visible,
-        inverted: color.static.white
+        inverted: color.static.white,
+        secondary: color.secondary.secondary
     };
     var hoverStyles = __assign({ textDecoration: 'underline', color: variantHoverColors[variant] }, (applyHoverStylesToInnerSvg
         ? {
@@ -29,8 +32,8 @@ var TextLink = function (props) {
             }
         }
         : {}));
-    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 }))) })));
-};
+    return (jsx(Text, __assign({ ref: ref, asChild: true, onClick: onClick, tag: 'a', css: __assign(__assign({ display: 'inline-flex', gap: spacing.s, color: variantColors[variant], textDecoration: 'none', transition: 'none', ':hover': hoverStyles }, (isActive && __assign(__assign({}, hoverStyles), { textDecoration: 'none' }))), (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 CHANGED Viewed

	@@ -1 +1 @@
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;;;;"}
1	+ {"version":3,"file":"TextLink.js","sources":["../../../src/components/text-link/TextLink.tsx"],"sourcesContent":["import { Ref, forwardRef } from 'react'\n\nimport { 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 = forwardRef((props: TextLinkProps, ref: Ref<'a'>) => {\n const {\n asChild = false,\n children,\n variant = 'default',\n isActive,\n isExternal = false,\n onClick,\n textVariant,\n showUnderline,\n applyHoverStylesToInnerSvg,\n ...other\n } = props\n\n const { color, spacing } = 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 secondary: color.secondary.secondary\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 secondary: color.secondary.secondary\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 ref={ref}\n asChild\n onClick={onClick}\n tag='a'\n css={{\n display: 'inline-flex',\n gap: spacing.s,\n color: variantColors[variant],\n textDecoration: 'none',\n transition: 'none',\n ':hover': hoverStyles,\n ...(isActive && { ...hoverStyles, textDecoration: 'none' }),\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":"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"}

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

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

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

	@@ -1 +1 @@
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"}
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;AACrC,YAAY,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA"}

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

@@ -1,6 +1,6 @@
 import type { HTMLProps } from 'react';
 import type { TextProps } from "../text/Text";
-type TextLinkTextProps = Omit<TextProps, 'variant' | 'color'>;
+type TextLinkTextProps = Omit<TextProps<any>, 'variant' | 'color' | 'onClick'>;
 export type TextLinkProps = TextLinkTextProps & Omit<HTMLProps<HTMLAnchorElement>, 'size' | 'color' | 'ref'> & {
     /**
      * Change the default rendered element for the one passed as a child,
@@ -11,7 +11,7 @@ export type TextLinkProps = TextLinkTextProps & Omit<HTMLProps<HTMLAnchorElement
      * Which variant to display.
      * @default default
      */
-    variant?: 'default' | 'subdued' | 'visible' | 'inverted';
+    variant?: 'default' | 'subdued' | 'visible' | 'inverted' | 'secondary';
     /**
      * Which text variant to display.
      */
@@ -21,6 +21,10 @@ export type TextLinkProps = TextLinkTextProps & Omit<HTMLProps<HTMLAnchorElement
      * a text-link is present when next to other text.
      */
     showUnderline?: boolean;
+    /**
+     * When `true`, render link in active style (e.g. hover color)
+     */
+    isActive?: boolean;
     /**
      * Mark as true if the link destination is outside of the app. Causes the
      * link to open in a new tab.

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

	@@ -1 +1 @@
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"}
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,CAAC,GAAG,CAAC,EAAE,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC,CAAA;AAE9E,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,GAAG,WAAW,CAAA;IAEtE;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAA;IAElC;;;OAGG;IACH,aAAa,CAAC,EAAE,OAAO,CAAA;IAEvB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB;;;;OAIG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB;;;;OAIG;IACH,0BAA0B,CAAC,EAAE,OAAO,CAAA;CACrC,CAAA"}

package/dist/foundations/spacing/spacing.d.ts CHANGED Viewed

@@ -48,4 +48,5 @@ export declare const iconSizes: {
 };
 export type Spacing = typeof spacing;
 export type SpacingOptions = keyof Spacing;
+export type IconSize = keyof typeof iconSizes;
 //# sourceMappingURL=spacing.d.ts.map

package/dist/foundations/spacing/spacing.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spacing.d.ts","sourceRoot":"","sources":["../../../src/foundations/spacing/spacing.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2CnB,CAAA;AAED,eAAO,MAAM,SAAS;;;;;;;;CAQrB,CAAA;AAED,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAA;AACpC,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,CAAA"}
1	+ {"version":3,"file":"spacing.d.ts","sourceRoot":"","sources":["../../../src/foundations/spacing/spacing.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2CnB,CAAA;AAED,eAAO,MAAM,SAAS;;;;;;;;CAQrB,CAAA;AAED,MAAM,MAAM,OAAO,GAAG,OAAO,OAAO,CAAA;AACpC,MAAM,MAAM,cAAc,GAAG,MAAM,OAAO,CAAA;AAC1C,MAAM,MAAM,QAAQ,GAAG,MAAM,OAAO,SAAS,CAAA"}

package/dist/foundations/spacing/spacing.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"spacing.js","sources":["../../../src/foundations/spacing/spacing.ts"],"sourcesContent":["export const spacing = {\n /* --- Base Unit Variables --- /\n unit: 4,\n unitHalf: 2,\n negativeUnit: -4,\n\n / --- 4n Unit Variables --- /\n unit1: 4,\n unit2: 8,\n unit3: 12,\n unit4: 16,\n unit5: 20,\n unit6: 24,\n unit7: 28,\n unit8: 32,\n unit9: 36,\n unit10: 40,\n unit11: 44,\n unit12: 48,\n unit13: 52,\n unit14: 56,\n unit15: 60,\n unit16: 64,\n unit17: 68,\n unit18: 72,\n unit19: 76,\n unit20: 80,\n unit21: 84,\n unit22: 88,\n unit23: 92,\n unit24: 96,\n\n /* --- Spacing Variables --- */\n '2xs': 2,\n xs: 4,\n s: 8,\n m: 12,\n l: 16,\n xl: 24,\n '2xl': 32,\n '3xl': 48,\n '4xl': 64,\n '5xl': 128\n}\n\nexport const iconSizes = {\n xs: 14,\n s: 16,\n m: 20,\n l: 24,\n xl: 30,\n '2xl': 32,\n '3xl': 40\n}\n\nexport type Spacing = typeof spacing\nexport type SpacingOptions = keyof Spacing\n"],"names":[],"mappings":"AAAa,IAAA,OAAO,GAAG;;AAErB,IAAA,IAAI,EAAE,CAAC;AACP,IAAA,QAAQ,EAAE,CAAC;IACX,YAAY,EAAE,CAAC,CAAC;;AAGhB,IAAA,KAAK,EAAE,CAAC;AACR,IAAA,KAAK,EAAE,CAAC;AACR,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;;AAGV,IAAA,KAAK,EAAE,CAAC;AACR,IAAA,EAAE,EAAE,CAAC;AACL,IAAA,CAAC,EAAE,CAAC;AACJ,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,EAAE,EAAE,EAAE;AACN,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,GAAG;EACX;AAEY,IAAA,SAAS,GAAG;AACvB,IAAA,EAAE,EAAE,EAAE;AACN,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,EAAE,EAAE,EAAE;AACN,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;;;;;"}
1	+ {"version":3,"file":"spacing.js","sources":["../../../src/foundations/spacing/spacing.ts"],"sourcesContent":["export const spacing = {\n /* --- Base Unit Variables --- /\n unit: 4,\n unitHalf: 2,\n negativeUnit: -4,\n\n / --- 4n Unit Variables --- /\n unit1: 4,\n unit2: 8,\n unit3: 12,\n unit4: 16,\n unit5: 20,\n unit6: 24,\n unit7: 28,\n unit8: 32,\n unit9: 36,\n unit10: 40,\n unit11: 44,\n unit12: 48,\n unit13: 52,\n unit14: 56,\n unit15: 60,\n unit16: 64,\n unit17: 68,\n unit18: 72,\n unit19: 76,\n unit20: 80,\n unit21: 84,\n unit22: 88,\n unit23: 92,\n unit24: 96,\n\n /* --- Spacing Variables --- */\n '2xs': 2,\n xs: 4,\n s: 8,\n m: 12,\n l: 16,\n xl: 24,\n '2xl': 32,\n '3xl': 48,\n '4xl': 64,\n '5xl': 128\n}\n\nexport const iconSizes = {\n xs: 14,\n s: 16,\n m: 20,\n l: 24,\n xl: 30,\n '2xl': 32,\n '3xl': 40\n}\n\nexport type Spacing = typeof spacing\nexport type SpacingOptions = keyof Spacing\nexport type IconSize = keyof typeof iconSizes\n"],"names":[],"mappings":"AAAa,IAAA,OAAO,GAAG;;AAErB,IAAA,IAAI,EAAE,CAAC;AACP,IAAA,QAAQ,EAAE,CAAC;IACX,YAAY,EAAE,CAAC,CAAC;;AAGhB,IAAA,KAAK,EAAE,CAAC;AACR,IAAA,KAAK,EAAE,CAAC;AACR,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;AACV,IAAA,MAAM,EAAE,EAAE;;AAGV,IAAA,KAAK,EAAE,CAAC;AACR,IAAA,EAAE,EAAE,CAAC;AACL,IAAA,CAAC,EAAE,CAAC;AACJ,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,EAAE,EAAE,EAAE;AACN,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,GAAG;EACX;AAEY,IAAA,SAAS,GAAG;AACvB,IAAA,EAAE,EAAE,EAAE;AACN,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,CAAC,EAAE,EAAE;AACL,IAAA,EAAE,EAAE,EAAE;AACN,IAAA,KAAK,EAAE,EAAE;AACT,IAAA,KAAK,EAAE,EAAE;;;;;"}

package/dist/foundations/theme/ThemeProvider.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../src/foundations/theme/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;~~AAStC~~,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;~~AAOpC~~,KAAK,kBAAkB,GAAG;IACxB,KAAK,EAAE,KAAK,CAAA;IACZ,QAAQ,EAAE,SAAS,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,aAAa,UAAW,kBAAkB,~~qDAUtD~~,CAAA"}
1	+ {"version":3,"file":"ThemeProvider.d.ts","sourceRoot":"","sources":["../../../src/foundations/theme/ThemeProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAKtC,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,SAAS,CAAA;AAEpC,KAAK,kBAAkB,GAAG;IACxB,KAAK,EAAE,KAAK,CAAA;IACZ,QAAQ,EAAE,SAAS,CAAA;CACpB,CAAA;AAED,eAAO,MAAM,aAAa,UAAW,kBAAkB,qDAQtD,CAAA"}

package/dist/foundations/theme/ThemeProvider.js CHANGED Viewed

@@ -1,16 +1,11 @@
 import { __assign } from '../../_virtual/_tslib.js';
 import { jsx } from '@emotion/react/jsx-runtime';
-import createCache from '@emotion/cache';
-import { CacheProvider, ThemeProvider as ThemeProvider$1 } from '@emotion/react';
+import { ThemeProvider as ThemeProvider$1 } from '@emotion/react';
 import { themes } from './theme.js';
-var harmonyCache = createCache({
-    key: 'harmony',
-    prepend: true
-});
 var ThemeProvider = function (props) {
     var children = props.children, theme = props.theme;
-    return (jsx(CacheProvider, __assign({ value: harmonyCache }, { children: jsx(ThemeProvider$1, __assign({ theme: themes[theme] }, { children: children })) })));
+    return (jsx(ThemeProvider$1, __assign({ theme: themes[theme] }, { children: children })));
 };
 export { ThemeProvider };

package/dist/foundations/theme/ThemeProvider.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ThemeProvider.js","sources":["../../../src/foundations/theme/ThemeProvider.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\n\nimport ~~createCache~~ ~~from '@emotion/cache'\nimport {\n CacheProvider,\n~~ ThemeProvider as EmotionThemeProvider\n} from '@emotion/react'\n\nimport { themes } from './theme'\nimport type { Theme } from './types'\n\~~nconst harmonyCache = createCache({\n key: 'harmony',\n prepend: true\n})\n\~~ntype ThemeProviderProps = {\n theme: Theme\n children: ReactNode\n}\n\nexport const ThemeProvider = (props: ThemeProviderProps) => {\n const { children, theme } = props\n\n return (\n <~~CacheProvider value={harmonyCache}>\n <~~EmotionThemeProvider theme={themes[theme]}>\n {children}\n </EmotionThemeProvider>\n ~~</CacheProvider>\n~~ )\n}\n"],"names":["_jsx","EmotionThemeProvider"],"mappings":"~~;;;;;;AAWA~~,IAAM,~~YAAY,GAAG,WAAW,CAAC;AAC/B,IAAA,GAAG,EAAE,SAAS;AACd,IAAA,OAAO,EAAE,IAAI;AACd,CAAA,CAAC,CAAA;AAOK,IAAM,~~aAAa,GAAG,UAAC,KAAyB,EAAA;IAC7C,IAAA,QAAQ,GAAY,KAAK,CAAA,QAAjB,EAAE,KAAK,GAAK,KAAK,CAAA,KAAV,CAAU;~~IAEjC~~,QACEA,~~IAAC,aAAa,EAAA,QAAA,CAAA,EAAC,KAAK,EAAE,YAAY,EAChC,EAAA,EAAA,QAAA,EAAAA,~~GAAA,CAACC,eAAoB,EAAA,QAAA,CAAA,EAAC,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,~~gBACvC~~,~~QAAQ~~,EAAA,~~CAAA~~,~~CACY~~,~~EACT~~,~~CAAA~~,CAAA,~~EACjB~~;AACH;;;;"}
1	+ {"version":3,"file":"ThemeProvider.js","sources":["../../../src/foundations/theme/ThemeProvider.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\n\nimport { ThemeProvider as EmotionThemeProvider } from '@emotion/react'\n\nimport { themes } from './theme'\nimport type { Theme } from './types'\n\ntype ThemeProviderProps = {\n theme: Theme\n children: ReactNode\n}\n\nexport const ThemeProvider = (props: ThemeProviderProps) => {\n const { children, theme } = props\n\n return (\n <EmotionThemeProvider theme={themes[theme]}>\n {children}\n </EmotionThemeProvider>\n )\n}\n"],"names":["_jsx","EmotionThemeProvider"],"mappings":";;;;;AAYO,IAAM,aAAa,GAAG,UAAC,KAAyB,EAAA;IAC7C,IAAA,QAAQ,GAAY,KAAK,CAAA,QAAjB,EAAE,KAAK,GAAK,KAAK,CAAA,KAAV,CAAU;AAEjC,IAAA,QACEA,GAAA,CAACC,eAAoB,EAAA,QAAA,CAAA,EAAC,KAAK,EAAE,MAAM,CAAC,KAAK,CAAC,EAAA,EAAA,EAAA,QAAA,EACvC,QAAQ,EAAA,CAAA,CACY,EACxB;AACH;;;;"}

package/dist/index.js CHANGED Viewed

@@ -12,6 +12,7 @@ export { iconSizes, spacing } from './foundations/spacing/spacing.js';
 export { Avatar } from './components/avatar/Avatar.js';
 export { SelectablePill } from './components/input/SelectablePill/SelectablePill.js';
 export { TextInput } from './components/input/TextInput/TextInput.js';
+export { TextInputSize } from './components/input/TextInput/types.js';
 export { useFocusState } from './components/input/useFocusState.js';
 export { PasswordInput } from './components/input/PasswordInput/PasswordInput.js';
 export { TokenAmountInput } from './components/input/TokenAmountInput/TokenAmountInput.js';

package/dist/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@audius/harmony",
-  "version": "0.0.25",
+  "version": "0.0.28",
   "description": "The Audius Design System",
   "license": "ISC",
   "author": "Audius",
@@ -76,7 +76,7 @@
     "react-merge-refs": "2.0.1",
     "react-perfect-scrollbar": "1.5.8",
     "react-spring": "8.0.27",
-    "react-use": "15.3.8",
+    "react-use": "17.5.0",
     "react-use-measure": "2.1.1",
     "remark-gfm": "3.0.1",
     "rollup": "4.3.0",
@@ -104,7 +104,7 @@
     "react-merge-refs": "^2.0.1",
     "react-perfect-scrollbar": "^1.5.8",
     "react-spring": "^8.0.27",
-    "react-use": "^15.3.8",
+    "react-use": "^17.5.0",
     "react-use-measure": "^2.1.1"
   },
   "dependencies": {