@audius/harmony 0.1.0 → 0.3.0

package/dist/components/segmented-control/SegmentedControl.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl.js","sources":["../../../src/components/segmented-control/SegmentedControl.tsx"],"sourcesContent":["import { createRef, Fragment, useState, useRef, useEffect } from 'react'\n\nimport { ResizeObserver } from '@juggle/resize-observer'\nimport { useSpring, animated } from '@react-spring/web'\nimport cn from 'classnames'\nimport { mergeRefs } from 'react-merge-refs'\nimport useMeasure from 'react-use-measure'\n\nimport { Text } from 'components/text'\n\nimport styles from './SegmentedControl.module.css'\nimport { SegmentedControlProps } from './types'\n\n/**\n * A hybrid somewhere between a button group, radio buttons, and tabs;\n * segmented controls are used to switch between different options or views.\n */\nexport const SegmentedControl = <T extends string>(\n  props: SegmentedControlProps<T>\n) => {\n  const optionRefs = useRef(\n    props.options.map((_) => createRef<HTMLLabelElement>())\n  )\n  const [selected, setSelected] = useState(props.options[0].key)\n  const [maxOptionWidth, setMaxOptionWidth] = useState(0)\n\n  const selectedOption = props.selected || selected\n\n  const onSetSelected = (option: T) => {\n    // Call props function if controlled\n    if (props.onSelectOption) props.onSelectOption(option)\n    setSelected(option)\n  }\n\n  const [tabProps, tabApi] = useSpring(() => ({\n    to: { left: '0px', width: '0px' }\n  }))\n\n  useEffect(() => {\n    setMaxOptionWidth(\n      optionRefs.current.reduce((currentMax, ref) => {\n        const rect = ref.current?.getBoundingClientRect()\n        return Math.max(rect?.width ?? 0, currentMax)\n      }, 0)\n    )\n  }, [])\n\n  // Watch for resizes and repositions so that we move and resize the slider appropriately\n  const [selectedRef, bounds] = useMeasure({\n    offsetSize: true,\n    polyfill: ResizeObserver\n  })\n\n  const [forceRefresh, setForceRefresh] = useState(false)\n  useEffect(() => {\n    setTimeout(() => {\n      setForceRefresh(!forceRefresh)\n    }, props.forceRefreshAfterMs)\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n\n  useEffect(() => {\n    let selectedRefIdx = props.options.findIndex(\n      (option) => option.key === selectedOption\n    )\n    if (selectedRefIdx === -1) selectedRefIdx = 0\n\n    const { clientWidth: width, offsetLeft: left } = optionRefs.current[\n      selectedRefIdx\n    ]?.current ?? { clientWidth: 0, offsetLeft: 0 }\n\n    tabApi.start({\n      to: { left: `${left}px`, width: `${width}px` }\n    })\n  }, [\n    props.options,\n    props.equalWidth,\n    selectedOption,\n    props.selected,\n    tabApi,\n    selected,\n    optionRefs,\n    bounds,\n    forceRefresh\n  ])\n\n  return (\n    <div\n      className={cn(styles.tabs, props.className, {\n        [styles.containerFullWidth]: !!props.fullWidth,\n        [styles.isMobile]: props.isMobile,\n        [styles.disabled]: props.disabled\n      })}\n      role='radiogroup'\n      aria-label={props.label}\n      aria-labelledby={props['aria-labelledby']}\n    >\n      <animated.div className={styles.tabBackground} style={tabProps} />\n      {props.options.map((option, idx) => {\n        const isOptionDisabled = props.disabled || option.disabled\n        return (\n          <Fragment key={option.key}>\n            <label\n              ref={\n                option.key === selectedOption\n                  ? mergeRefs([optionRefs.current[idx], selectedRef])\n                  : optionRefs.current[idx]\n              }\n              className={cn(styles.tab, {\n                [styles.tabFullWidth]: !!props.fullWidth,\n                [styles.disabled]: !props.disabled && option.disabled,\n                [styles.isMobile]: props.isMobile\n              })}\n              style={\n                props.equalWidth && maxOptionWidth\n                  ? { width: `${maxOptionWidth}px` }\n                  : undefined\n              }\n            >\n              {option.icon}\n              <input\n                type='radio'\n                checked={option.key === selectedOption}\n                onChange={() => {\n                  onSetSelected(option.key)\n                }}\n                disabled={isOptionDisabled}\n              />\n              <Text\n                color={\n                  option.variant ?? (isOptionDisabled ? 'subdued' : 'default')\n                }\n                css={{\n                  cursor: isOptionDisabled ? 'auto' : 'pointer'\n                }}\n              >\n                {option.text}\n              </Text>\n            </label>\n            {idx !== props.options.length - 1 ? (\n              <div\n                className={cn(styles.separator, {\n                  [styles.invisible]:\n                    // Hide separator right of the selected option\n                    selectedOption === option.key ||\n                    // Hide separator right of the last option\n                    idx === props.options.length - 1 ||\n                    // Hide separator right of an option if the next one is selected\n                    selectedOption === props.options[idx + 1].key\n                })}\n              />\n            ) : null}\n          </Fragment>\n        )\n      })}\n    </div>\n  )\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"SegmentedControl.js","sources":["../../../src/components/segmented-control/SegmentedControl.tsx"],"sourcesContent":["import { createRef, Fragment, useState, useRef, useEffect } from 'react'\n\nimport { ResizeObserver } from '@juggle/resize-observer'\nimport { useSpring, animated } from '@react-spring/web'\nimport cn from 'classnames'\nimport { mergeRefs } from 'react-merge-refs'\nimport useMeasure from 'react-use-measure'\n\nimport { Text } from 'components/text'\n\nimport styles from './SegmentedControl.module.css'\nimport { SegmentedControlProps } from './types'\n\n/**\n * A hybrid somewhere between a button group, radio buttons, and tabs;\n * segmented controls are used to switch between different options or views.\n */\nexport const SegmentedControl = <T extends string>(\n  props: SegmentedControlProps<T>\n) => {\n  const optionRefs = useRef(\n    props.options.map((_) => createRef<HTMLLabelElement>())\n  )\n  const [selected, setSelected] = useState(props.options[0].key)\n  const [maxOptionWidth, setMaxOptionWidth] = useState(0)\n\n  const selectedOption = props.selected || selected\n\n  const onSetSelected = (option: T) => {\n    // Call props function if controlled\n    if (props.onSelectOption) props.onSelectOption(option)\n    setSelected(option)\n  }\n\n  const [tabProps, tabApi] = useSpring(() => ({\n    to: { left: '0px', width: '0px' }\n  }))\n\n  useEffect(() => {\n    setMaxOptionWidth(\n      optionRefs.current.reduce((currentMax, ref) => {\n        const rect = ref.current?.getBoundingClientRect()\n        return Math.max(rect?.width ?? 0, currentMax)\n      }, 0)\n    )\n  }, [])\n\n  // Watch for resizes and repositions so that we move and resize the slider appropriately\n  const [selectedRef, bounds] = useMeasure({\n    offsetSize: true,\n    polyfill: ResizeObserver\n  })\n\n  const [forceRefresh, setForceRefresh] = useState(false)\n  useEffect(() => {\n    setTimeout(() => {\n      setForceRefresh(!forceRefresh)\n    }, props.forceRefreshAfterMs)\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [])\n\n  useEffect(() => {\n    let selectedRefIdx = props.options.findIndex(\n      (option) => option.key === selectedOption\n    )\n    if (selectedRefIdx === -1) selectedRefIdx = 0\n\n    const { clientWidth: width, offsetLeft: left } = optionRefs.current[\n      selectedRefIdx\n    ]?.current ?? { clientWidth: 0, offsetLeft: 0 }\n\n    tabApi.start({\n      to: { left: `${left}px`, width: `${width}px` }\n    })\n  }, [\n    props.options,\n    props.equalWidth,\n    selectedOption,\n    props.selected,\n    tabApi,\n    selected,\n    optionRefs,\n    bounds,\n    forceRefresh\n  ])\n\n  return (\n    <div\n      className={cn(styles.tabs, props.className, {\n        [styles.containerFullWidth]: !!props.fullWidth,\n        [styles.isMobile]: props.isMobile,\n        [styles.disabled]: props.disabled\n      })}\n      role='radiogroup'\n      aria-label={props.label}\n      aria-labelledby={props['aria-labelledby']}\n    >\n      <animated.div className={styles.tabBackground} style={tabProps} />\n      {props.options.map((option, idx) => {\n        const isOptionDisabled = props.disabled || option.disabled\n        return (\n          <Fragment key={option.key}>\n            <label\n              ref={\n                option.key === selectedOption\n                  ? mergeRefs([optionRefs.current[idx], selectedRef])\n                  : optionRefs.current[idx]\n              }\n              className={cn(styles.tab, {\n                [styles.tabFullWidth]: !!props.fullWidth,\n                [styles.disabled]: !props.disabled && option.disabled,\n                [styles.isMobile]: props.isMobile\n              })}\n              style={\n                props.equalWidth && maxOptionWidth\n                  ? { width: `${maxOptionWidth}px` }\n                  : undefined\n              }\n            >\n              {option.icon}\n              <input\n                type='radio'\n                checked={option.key === selectedOption}\n                onChange={() => {\n                  onSetSelected(option.key)\n                }}\n                disabled={isOptionDisabled}\n              />\n              <Text\n                variant='body'\n                strength='strong'\n                css={(theme) => ({ lineHeight: theme.typography.lineHeight.s })}\n                color={\n                  option.variant ?? (isOptionDisabled ? 'subdued' : 'default')\n                }\n              >\n                {option.text}\n              </Text>\n            </label>\n            {idx !== props.options.length - 1 ? (\n              <div\n                className={cn(styles.separator, {\n                  [styles.invisible]:\n                    // Hide separator right of the selected option\n                    selectedOption === option.key ||\n                    // Hide separator right of the last option\n                    idx === props.options.length - 1 ||\n                    // Hide separator right of an option if the next one is selected\n                    selectedOption === props.options[idx + 1].key\n                })}\n              />\n            ) : null}\n          </Fragment>\n        )\n      })}\n    </div>\n  )\n}\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/components/select/Select/Select.d.ts

@@ -0,0 +1,21 @@
+/// <reference types="react" />
+import { MenuProps } from "../../internal/Menu";
+/**
+ * A form input used for selecting a value: when collapsed it shows the
+ * currently selected option and when expanded, it shows a scrollable list
+ * of predefined options for the user to choose from.
+ */
+export declare const Select: <Value extends string>(props: {
+    value: Value;
+    onChange?: ((value: Value) => void) | undefined;
+    options: import("./types").SelectOption<Value>[];
+    children?: ((props: {
+        onChange: (value: Value) => void;
+        options: import("react").ReactNode;
+    }) => import("react").ReactNode) | undefined;
+    optionsLabel?: string | undefined;
+    InputProps?: Partial<import("../../input").TextInputProps> | undefined;
+    menuProps?: (Partial<MenuProps> & Partial<import("../../internal/Menu").MenuContentProps>) | undefined;
+    clearable?: boolean | undefined;
+} & Omit<import("../../input").TextInputProps, "children" | "value" | "onChange"> & import("react").RefAttributes<HTMLInputElement>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>> | null;
+//# sourceMappingURL=Select.d.ts.map

package/dist/components/select/Select/Select.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/select/Select/Select.tsx"],"names":[],"mappings":";AAcA,OAAO,EAAqB,SAAS,EAAE,4BAAgC;AAmBvE;;;;GAIG;AACH,eAAO,MAAM,MAAM;;;;;;;;;;;;qOAkLjB,CAAA"}

package/dist/components/select/Select/Select.js

@@ -0,0 +1,115 @@
+import { __rest, __assign } from '../../../_virtual/_tslib.js';
+import { jsx, jsxs } from '@emotion/react/jsx-runtime';
+import { forwardRef, useState, useRef, useCallback, useEffect, useMemo } from 'react';
+import { mergeRefs } from 'react-merge-refs';
+import '@emotion/react';
+import '../../common/HiddenInput.js';
+import '../../radio-group/RadioGroupContext.js';
+import { Text } from '../../text/Text.js';
+import { TextInput } from '../../input/TextInput/TextInput.js';
+import '../../input/TextInput/types.js';
+import '../../input/PasswordInput/PasswordInput.js';
+import '../../input/TokenAmountInput/TokenAmountInput.js';
+import { Menu, MenuContent } from '../../internal/Menu.js';
+import { MenuItem } from '../../internal/MenuItem.js';
+import { OptionKeyHandler } from '../../internal/OptionKeyHandler.js';
+import '../../layout/Box/Box.js';
+import { Flex } from '../../layout/Flex/Flex.js';
+import '../../layout/Paper/Paper.js';
+import { useControlled } from '../../../hooks/useControlled.js';
+import { IconCloseAlt, IconCaretDown } from '../../../icons/utilityIcons.js';
+import '@emotion/css';
+
+var messages = {
+    noMatches: 'No matches'
+};
+var defaultMenuProps = {
+    anchorOrigin: { horizontal: 'left', vertical: 'bottom' },
+    transformOrigin: { horizontal: 'left', vertical: 'top' }
+};
+/**
+ * A form input used for selecting a value: when collapsed it shows the
+ * currently selected option and when expanded, it shows a scrollable list
+ * of predefined options for the user to choose from.
+ */
+var Select = forwardRef(function Select(props, ref) {
+    var _a, _b;
+    var valueProp = props.value, options = props.options, menuProps = props.menuProps, onChange = props.onChange, onClick = props.onClick, clearable = props.clearable, children = props.children, other = __rest(props, ["value", "options", "menuProps", "onChange", "onClick", "clearable", "children"]);
+    var label = other.label;
+    var _c = useControlled({
+        controlledProp: valueProp,
+        defaultValue: null,
+        stateName: 'selection',
+        componentName: 'Select'
+    }), value = _c[0], setValue = _c[1];
+    var _d = useState(false), isOpen = _d[0], setIsOpen = _d[1];
+    var _e = useState(''), inputValue = _e[0], setInputValue = _e[1];
+    var selectedOption = options.find(function (option) { return option.value === value; });
+    var selectedLabel = (_a = selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.label) !== null && _a !== void 0 ? _a : selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.value;
+    var anchorRef = useRef(null);
+    var inputRef = useRef(null);
+    var optionRefs = useRef([]);
+    var scrollRef = useRef(null);
+    var handleChange = useCallback(function (value) {
+        setValue(value);
+        setInputValue('');
+        onChange === null || onChange === void 0 ? void 0 : onChange(value);
+        setIsOpen(false);
+    }, [onChange, setValue]);
+    useEffect(function () {
+        if (isOpen) {
+            // Focus the input after the popup is open
+            setTimeout(function () {
+                var _a;
+                (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus({ preventScroll: true });
+            }, 0);
+        }
+    }, [isOpen]);
+    var filteredOptions = useMemo(function () {
+        return options.filter(function (_a) {
+            var value = _a.value, label = _a.label;
+            return (!inputValue ||
+                (label === null || label === void 0 ? void 0 : label.toLowerCase().includes(inputValue.toLowerCase())) ||
+                value.toLowerCase().includes(inputValue.toLowerCase()));
+        });
+    }, [options, inputValue]);
+    var handleClick = useCallback(function (e) {
+        setIsOpen(true);
+        onClick === null || onClick === void 0 ? void 0 : onClick(e);
+    }, [onClick]);
+    var handleClickIcon = useCallback(function (e) {
+        e.stopPropagation();
+        e.preventDefault();
+        if (value !== null && clearable) {
+            setValue(null);
+            // @ts-ignore
+            onChange === null || onChange === void 0 ? void 0 : onChange(null);
+        }
+        else {
+            setIsOpen(function (isOpen) { return !isOpen; });
+        }
+    }, [value, clearable, setValue, onChange]);
+    var Icon = value !== null && clearable ? IconCloseAlt : IconCaretDown;
+    var optionElements = (jsx(OptionKeyHandler, __assign({ options: filteredOptions, disabled: !isOpen, optionRefs: optionRefs, scrollRef: scrollRef, onChange: handleChange }, { children: function (activeValue) {
+            return filteredOptions.length === 0 ? (jsx(Flex, __assign({ justifyContent: 'center' }, { children: jsx(Text, __assign({ variant: 'body', color: 'subdued', size: 's' }, { children: messages.noMatches })) }))) : (filteredOptions === null || filteredOptions === void 0 ? void 0 : filteredOptions.map(function (option, index) { return (jsx(MenuItem, __assign({ ref: function (el) {
+                    if (optionRefs && optionRefs.current && el) {
+                        optionRefs.current[index] = el;
+                    }
+                }, variant: 'option' }, option, { onChange: handleChange, isActive: option.value === activeValue }), option.value)); }));
+        } })));
+    return (jsxs(Flex, __assign({ ref: anchorRef }, { children: [jsx(TextInput, __assign({ ref: mergeRefs([ref, inputRef]), value: inputValue, onChange: function (e) { return setInputValue(e.target.value); }, onClick: handleClick, "aria-haspopup": 'listbox', "aria-expanded": isOpen, autoComplete: 'off', endIcon: Icon, IconProps: { onClick: handleClickIcon }, elevateLabel: !!selectedOption, hidePlaceholder: !!selectedOption }, other)), selectedOption && !inputValue ? (jsx(MenuItem, __assign({ variant: 'option' }, selectedOption, { onChange: function () { }, css: function (_a) {
+                    var spacing = _a.spacing;
+                    return ({
+                        position: 'absolute',
+                        // Magic values to align the selected option with the input
+                        top: spacing.unit6 + 2,
+                        left: spacing.unit1,
+                        opacity: isOpen ? 0.5 : 1
+                    });
+                }, disabled: true }))) : null, jsx(Menu, __assign({ anchorRef: anchorRef, isVisible: isOpen, onClose: function () { return setIsOpen(false); } }, defaultMenuProps, { PaperProps: menuProps === null || menuProps === void 0 ? void 0 : menuProps.PaperProps }, { children: jsx(MenuContent, __assign({ maxHeight: menuProps === null || menuProps === void 0 ? void 0 : menuProps.maxHeight, width: menuProps === null || menuProps === void 0 ? void 0 : menuProps.width, scrollRef: scrollRef, MenuListProps: menuProps === null || menuProps === void 0 ? void 0 : menuProps.MenuListProps, "aria-label": (_b = selectedLabel !== null && selectedLabel !== void 0 ? selectedLabel : label) !== null && _b !== void 0 ? _b : props['aria-label'], "aria-activedescendant": selectedLabel }, { children: children
+                        ? children({ onChange: handleChange, options: optionElements })
+                        : optionElements })) }))] })));
+});
+
+export { Select };
+//# sourceMappingURL=Select.js.map

package/dist/components/select/Select/Select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.js","sources":["../../../../src/components/select/Select/Select.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useState,\n  useCallback,\n  useRef,\n  useMemo,\n  Ref,\n  useEffect,\n  MouseEvent\n} from 'react'\n\nimport { mergeRefs } from 'react-merge-refs'\n\nimport { TextInput } from 'components/input'\nimport { Menu, MenuContent, MenuProps } from 'components/internal/Menu'\nimport { MenuItem } from 'components/internal/MenuItem'\nimport { OptionKeyHandler } from 'components/internal/OptionKeyHandler'\nimport { Flex } from 'components/layout'\nimport { Text } from 'components/text'\nimport { useControlled } from 'hooks/useControlled'\nimport { IconCaretDown, IconCloseAlt } from 'icons'\n\nimport { SelectProps } from './types'\n\nconst messages = {\n  noMatches: 'No matches'\n}\n\nconst defaultMenuProps: Partial<MenuProps> = {\n  anchorOrigin: { horizontal: 'left', vertical: 'bottom' },\n  transformOrigin: { horizontal: 'left', vertical: 'top' }\n}\n\n/**\n * A form input used for selecting a value: when collapsed it shows the\n * currently selected option and when expanded, it shows a scrollable list\n * of predefined options for the user to choose from.\n */\nexport const Select = forwardRef(function Select<Value extends string>(\n  props: SelectProps<Value>,\n  ref: Ref<HTMLInputElement>\n) {\n  const {\n    value: valueProp,\n    options,\n    menuProps,\n    onChange,\n    onClick,\n    clearable,\n    children,\n    ...other\n  } = props\n\n  const { label } = other\n\n  const [value, setValue] = useControlled({\n    controlledProp: valueProp,\n    defaultValue: null,\n    stateName: 'selection',\n    componentName: 'Select'\n  })\n\n  const [isOpen, setIsOpen] = useState(false)\n  const [inputValue, setInputValue] = useState('')\n  const selectedOption = options.find((option) => option.value === value)\n  const selectedLabel = selectedOption?.label ?? selectedOption?.value\n  const anchorRef = useRef<HTMLDivElement>(null)\n  const inputRef = useRef<HTMLInputElement>(null)\n  const optionRefs = useRef<HTMLButtonElement[]>([])\n  const scrollRef = useRef<HTMLDivElement>(null)\n\n  const handleChange = useCallback(\n    (value: Value) => {\n      setValue(value)\n      setInputValue('')\n      onChange?.(value)\n      setIsOpen(false)\n    },\n    [onChange, setValue]\n  )\n\n  useEffect(() => {\n    if (isOpen) {\n      // Focus the input after the popup is open\n      setTimeout(() => {\n        inputRef.current?.focus({ preventScroll: true })\n      }, 0)\n    }\n  }, [isOpen])\n\n  const filteredOptions = useMemo(\n    () =>\n      options.filter(({ value, label }) => {\n        return (\n          !inputValue ||\n          label?.toLowerCase().includes(inputValue.toLowerCase()) ||\n          value.toLowerCase().includes(inputValue.toLowerCase())\n        )\n      }),\n    [options, inputValue]\n  )\n\n  const handleClick = useCallback(\n    (e: MouseEvent<HTMLInputElement>) => {\n      setIsOpen(true)\n      onClick?.(e)\n    },\n    [onClick]\n  )\n\n  const handleClickIcon = useCallback(\n    (e: MouseEvent<SVGSVGElement>) => {\n      e.stopPropagation()\n      e.preventDefault()\n      if (value !== null && clearable) {\n        setValue(null)\n        // @ts-ignore\n        onChange?.(null)\n      } else {\n        setIsOpen((isOpen: boolean) => !isOpen)\n      }\n    },\n    [value, clearable, setValue, onChange]\n  )\n\n  const Icon = value !== null && clearable ? IconCloseAlt : IconCaretDown\n\n  const optionElements = (\n    <OptionKeyHandler\n      options={filteredOptions}\n      disabled={!isOpen}\n      optionRefs={optionRefs}\n      scrollRef={scrollRef}\n      onChange={handleChange}\n    >\n      {(activeValue) =>\n        filteredOptions.length === 0 ? (\n          <Flex justifyContent='center'>\n            <Text variant='body' color='subdued' size='s'>\n              {messages.noMatches}\n            </Text>\n          </Flex>\n        ) : (\n          filteredOptions?.map((option, index) => (\n            <MenuItem\n              ref={(el) => {\n                if (optionRefs && optionRefs.current && el) {\n                  optionRefs.current[index] = el\n                }\n              }}\n              key={option.value}\n              variant='option'\n              {...option}\n              onChange={handleChange}\n              isActive={option.value === activeValue}\n            />\n          ))\n        )\n      }\n    </OptionKeyHandler>\n  )\n\n  return (\n    <Flex ref={anchorRef}>\n      <TextInput\n        ref={mergeRefs([ref, inputRef])}\n        value={inputValue}\n        onChange={(e) => setInputValue(e.target.value)}\n        onClick={handleClick}\n        aria-haspopup='listbox'\n        aria-expanded={isOpen}\n        autoComplete='off'\n        endIcon={Icon}\n        IconProps={{ onClick: handleClickIcon }}\n        elevateLabel={!!selectedOption}\n        hidePlaceholder={!!selectedOption}\n        {...other}\n      />\n      {/* Overlay selected option */}\n      {selectedOption && !inputValue ? (\n        <MenuItem\n          variant='option'\n          {...selectedOption}\n          onChange={() => {}}\n          css={({ spacing }) => ({\n            position: 'absolute',\n            // Magic values to align the selected option with the input\n            top: spacing.unit6 + 2,\n            left: spacing.unit1,\n            opacity: isOpen ? 0.5 : 1\n          })}\n          disabled\n        />\n      ) : null}\n      <Menu\n        anchorRef={anchorRef}\n        isVisible={isOpen}\n        onClose={() => setIsOpen(false)}\n        {...defaultMenuProps}\n        PaperProps={menuProps?.PaperProps}\n      >\n        <MenuContent\n          maxHeight={menuProps?.maxHeight}\n          width={menuProps?.width}\n          scrollRef={scrollRef}\n          MenuListProps={menuProps?.MenuListProps}\n          aria-label={selectedLabel ?? label ?? props['aria-label']}\n          aria-activedescendant={selectedLabel}\n        >\n          {children\n            ? children({ onChange: handleChange, options: optionElements })\n            : optionElements}\n        </MenuContent>\n      </Menu>\n    </Flex>\n  )\n})\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/dist/components/select/Select/Select.stories.d.ts

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

package/dist/components/select/Select/Select.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.stories.d.ts","sourceRoot":"","sources":["../../../../src/components/select/Select/Select.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAEtD,OAAO,EAAE,MAAM,EAAE,MAAM,UAAU,CAAA;AAEjC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,MAAM,CAY7B,CAAA;AAED,eAAe,IAAI,CAAA;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAA;AAEpC,eAAO,MAAM,OAAO,EAAE,KAErB,CAAA;AAED,eAAO,MAAM,aAAa,EAAE,KAE3B,CAAA"}

package/dist/components/select/Select/index.d.ts

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

package/dist/components/select/Select/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/select/Select/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA"}

package/dist/components/select/Select/types.d.ts

@@ -0,0 +1,46 @@
+import { ReactNode } from 'react';
+import { IconComponent } from "../../icon";
+import { TextInputProps } from "../../input";
+import { MenuContentProps, MenuProps } from "../../internal/Menu";
+export type SelectOption<Value extends string> = {
+    value: Value;
+    /**
+     * The label to display. If not provided, uses the value.
+     */
+    label?: string;
+    icon?: IconComponent;
+    leadingElement?: JSX.Element;
+};
+type ChildrenProps<Value> = {
+    /**
+     * A callback triggered when the value is changed
+     */
+    onChange: (value: Value) => void;
+    /**
+     * The rendered options, provided to the children render prop in case
+     * they want to be incorporated as-is.
+     */
+    options: ReactNode;
+};
+export type SelectProps<Value extends string = string> = {
+    value: Value;
+    /**
+     * A callback triggered when the value is changed
+     */
+    onChange?: (value: Value) => void;
+    /**
+     * Selection options
+     * e.g. { label: 'Option A', icon: IconRadar }
+     */
+    options: SelectOption<Value>[];
+    children?: (props: ChildrenProps<Value>) => ReactNode;
+    /**
+     * Label to display above options
+     */
+    optionsLabel?: string;
+    InputProps?: Partial<TextInputProps>;
+    menuProps?: Partial<MenuProps> & Partial<MenuContentProps>;
+    clearable?: boolean;
+} & Omit<TextInputProps, 'value' | 'onChange' | 'children'>;
+export {};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/select/Select/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/select/Select/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAEjC,OAAO,EAAE,aAAa,EAAE,mBAAuB;AAC/C,OAAO,EAAE,cAAc,EAAE,oBAAwB;AACjD,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,4BAAgC;AAEtE,MAAM,MAAM,YAAY,CAAC,KAAK,SAAS,MAAM,IAAI;IAC/C,KAAK,EAAE,KAAK,CAAA;IACZ;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,aAAa,CAAA;IACpB,cAAc,CAAC,EAAE,GAAG,CAAC,OAAO,CAAA;CAC7B,CAAA;AAED,KAAK,aAAa,CAAC,KAAK,IAAI;IAC1B;;OAEG;IACH,QAAQ,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAA;IAChC;;;OAGG;IACH,OAAO,EAAE,SAAS,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,WAAW,CAAC,KAAK,SAAS,MAAM,GAAG,MAAM,IAAI;IACvD,KAAK,EAAE,KAAK,CAAA;IACZ;;OAEG;IACH,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAA;IAEjC;;;OAGG;IACH,OAAO,EAAE,YAAY,CAAC,KAAK,CAAC,EAAE,CAAA;IAE9B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,aAAa,CAAC,KAAK,CAAC,KAAK,SAAS,CAAA;IAErD;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,CAAA;IACrB,UAAU,CAAC,EAAE,OAAO,CAAC,cAAc,CAAC,CAAA;IACpC,SAAS,CAAC,EAAE,OAAO,CAAC,SAAS,CAAC,GAAG,OAAO,CAAC,gBAAgB,CAAC,CAAA;IAC1D,SAAS,CAAC,EAAE,OAAO,CAAA;CACpB,GAAG,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,UAAU,GAAG,UAAU,CAAC,CAAA"}

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

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

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

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

package/dist/components/send-icon/SendIcon.d.ts

@@ -0,0 +1,3 @@
+import { SendIconProps } from './types';
+export declare const SendIcon: ({ disabled, onClick }: SendIconProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SendIcon.d.ts.map

package/dist/components/send-icon/SendIcon.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SendIcon.d.ts","sourceRoot":"","sources":["../../../src/components/send-icon/SendIcon.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAA;AAEvC,eAAO,MAAM,QAAQ,0BAAmC,aAAa,qDA0BpE,CAAA"}

package/dist/components/send-icon/SendIcon.js

@@ -0,0 +1,36 @@
+import { jsx } from '@emotion/react/jsx-runtime';
+import { useTheme } from '@emotion/react';
+import '../button/Button/Button.js';
+import '../button/PlainButton/PlainButton.js';
+import '../../_virtual/_tslib.js';
+import { IconPaperAirplane } from '../../icons/utilityIcons.js';
+import 'react';
+import '@emotion/css';
+import '../button/FollowButton/FollowButton.js';
+import { IconButton } from '../button/IconButton/IconButton.js';
+import '../button/UnstyledButton.js';
+import '../button/FilterButton/FilterButton.js';
+import '../button/FilterButton/FilterButtonOption.js';
+
+var SendIcon = function (_a) {
+    var _b = _a.disabled, disabled = _b === void 0 ? false : _b, onClick = _a.onClick;
+    var _c = useTheme(), color = _c.color, motion = _c.motion;
+    return (jsx(IconButton, { "aria-label": 'Send', icon: IconPaperAirplane, size: '2xl', onClick: onClick, css: {
+            cursor: 'pointer',
+            pointerEvents: disabled ? 'none' : 'all',
+            opacity: disabled ? 0.5 : 1,
+            path: {
+                fill: color.primary.primary,
+                transition: motion.quick
+            },
+            ':hover path': {
+                fill: color.primary.p100
+            },
+            ':active path': {
+                fill: color.primary.p500
+            }
+        } }));
+};
+
+export { SendIcon };
+//# sourceMappingURL=SendIcon.js.map

package/dist/components/send-icon/SendIcon.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SendIcon.js","sources":["../../../src/components/send-icon/SendIcon.tsx"],"sourcesContent":["import { useTheme } from '@emotion/react'\n\nimport { IconButton } from 'components/button'\nimport { IconPaperAirplane } from 'icons'\n\nimport { SendIconProps } from './types'\n\nexport const SendIcon = ({ disabled = false, onClick }: SendIconProps) => {\n  const { color, motion } = useTheme()\n\n  return (\n    <IconButton\n      aria-label='Send'\n      icon={IconPaperAirplane}\n      size='2xl'\n      onClick={onClick}\n      css={{\n        cursor: 'pointer',\n        pointerEvents: disabled ? 'none' : 'all',\n        opacity: disabled ? 0.5 : 1,\n        path: {\n          fill: color.primary.primary,\n          transition: motion.quick\n        },\n        ':hover path': {\n          fill: color.primary.p100\n        },\n        ':active path': {\n          fill: color.primary.p500\n        }\n      }}\n    />\n  )\n}\n"],"names":["_jsx"],"mappings":";;;;;;;;;;;;;;AAOO,IAAM,QAAQ,GAAG,UAAC,EAA4C,EAAA;AAA1C,IAAA,IAAA,EAAA,GAAA,EAAA,CAAA,QAAgB,EAAhB,QAAQ,GAAA,EAAA,KAAA,KAAA,CAAA,GAAG,KAAK,GAAA,EAAA,EAAE,OAAO,GAAA,EAAA,CAAA,OAAA,CAAA;IAC5C,IAAA,EAAA,GAAoB,QAAQ,EAAE,EAA5B,KAAK,GAAA,EAAA,CAAA,KAAA,EAAE,MAAM,GAAA,EAAA,CAAA,MAAe,CAAA;AAEpC,IAAA,QACEA,GAAC,CAAA,UAAU,kBACE,MAAM,EACjB,IAAI,EAAE,iBAAiB,EACvB,IAAI,EAAC,KAAK,EACV,OAAO,EAAE,OAAO,EAChB,GAAG,EAAE;AACH,YAAA,MAAM,EAAE,SAAS;YACjB,aAAa,EAAE,QAAQ,GAAG,MAAM,GAAG,KAAK;YACxC,OAAO,EAAE,QAAQ,GAAG,GAAG,GAAG,CAAC;AAC3B,YAAA,IAAI,EAAE;AACJ,gBAAA,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO;gBAC3B,UAAU,EAAE,MAAM,CAAC,KAAK;AACzB,aAAA;AACD,YAAA,aAAa,EAAE;AACb,gBAAA,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI;AACzB,aAAA;AACD,YAAA,cAAc,EAAE;AACd,gBAAA,IAAI,EAAE,KAAK,CAAC,OAAO,CAAC,IAAI;AACzB,aAAA;AACF,SAAA,EAAA,CACD,EACH;AACH;;;;"}

package/dist/components/send-icon/SendIcon.stories.d.ts

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

package/dist/components/send-icon/SendIcon.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SendIcon.stories.d.ts","sourceRoot":"","sources":["../../../src/components/send-icon/SendIcon.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,kBAAkB,CAAA;AAItD,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAA;AAErC,QAAA,MAAM,IAAI,EAAE,IAAI,CAAC,OAAO,QAAQ,CAG/B,CAAA;AAED,eAAe,IAAI,CAAA;AAEnB,KAAK,KAAK,GAAG,QAAQ,CAAC,OAAO,QAAQ,CAAC,CAAA;AAEtC,eAAO,MAAM,OAAO,EAAE,KAOrB,CAAA"}

package/dist/components/send-icon/index.d.ts

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

package/dist/components/send-icon/index.d.ts.map

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

package/dist/components/send-icon/types.d.ts

@@ -0,0 +1,5 @@
+export type SendIconProps = {
+    disabled?: boolean;
+    onClick?: () => void;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/send-icon/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/send-icon/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,aAAa,GAAG;IAC1B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CACrB,CAAA"}

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

@@ -1 +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"}
+{"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,qDAiElC,CAAA"}

package/dist/components/tag/Tag.js

@@ -40,7 +40,7 @@ var Tag = function (props) {
         : 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] })));
+    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, { asChild: true, 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 };

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

@@ -1 +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 IconCloseAlt from '../../assets/icons/CloseAlt.svg'\nimport IconPlus from '../../assets/icons/Plus.svg'\nimport { IconButton } from '../button/IconButton/IconButton'\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":["IconPlus","IconCloseAlt","_jsxs","_jsx"],"mappings":"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"}
+{"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 IconCloseAlt from '../../assets/icons/CloseAlt.svg'\nimport IconPlus from '../../assets/icons/Plus.svg'\nimport { IconButton } from '../button/IconButton/IconButton'\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          asChild\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":["IconPlus","IconCloseAlt","_jsxs","_jsx"],"mappings":"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"}

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

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

package/dist/components/text/Text.js

@@ -4,12 +4,12 @@ import { forwardRef, useContext } 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';
+import { bodyLineHeightMap, variantTagMap, variantStylesMap } from './constants.js';
 import { TextContext } from './textContext.js';
 
 var Text = forwardRef(function (props, ref) {
     var _a, _b, _c;
-    var children = props.children, variantProp = props.variant, strengthProp = props.strength, sizeProp = props.size, color = props.color, shadow = props.shadow, tag = props.tag, asChild = props.asChild, textAlign = props.textAlign, textTransform = props.textTransform, ellipses = props.ellipses, other = __rest(props, ["children", "variant", "strength", "size", "color", "shadow", "tag", "asChild", "textAlign", "textTransform", "ellipses"]);
+    var children = props.children, variantProp = props.variant, strengthProp = props.strength, sizeProp = props.size, color = props.color, shadow = props.shadow, tag = props.tag, asChild = props.asChild, textAlign = props.textAlign, textTransform = props.textTransform, ellipses = props.ellipses, maxLines = props.maxLines, lineHeight = props.lineHeight, other = __rest(props, ["children", "variant", "strength", "size", "color", "shadow", "tag", "asChild", "textAlign", "textTransform", "ellipses", "maxLines", "lineHeight"]);
     var theme = useTheme();
     var contextVariant = useContext(TextContext).variant;
     var variant = (_a = variantProp !== null && variantProp !== void 0 ? variantProp : contextVariant) !== null && _a !== void 0 ? _a : 'body';
@@ -17,7 +17,7 @@ var Text = forwardRef(function (props, ref) {
     var strength = strengthProp !== null && strengthProp !== void 0 ? strengthProp : (parentVariant ? undefined : 'default');
     var size = sizeProp !== null && sizeProp !== void 0 ? sizeProp : (parentVariant ? undefined : 'm');
     var variantConfig = variant && variantStylesMap[variant];
-    var css = __assign(__assign(__assign(__assign(__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(__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',
@@ -27,9 +27,13 @@ var Text = forwardRef(function (props, ref) {
         backgroundImage: theme.color.text.heading
     })), (color && color !== 'heading' && { color: theme.color.text[color] })), (variantConfig && __assign({ 
         // @ts-ignore
-        fontSize: typography.size[variantConfig.fontSize[size]], 
+        fontSize: typography.size[variantConfig.fontSize[size]], lineHeight: 
         // @ts-ignore
-        lineHeight: typography.lineHeight[variantConfig.lineHeight[size]], 
+        typography.lineHeight[lineHeight && variant === 'body' && size
+            ? // @ts-ignore
+                bodyLineHeightMap[size][lineHeight]
+            : // @ts-ignore
+                variantConfig.lineHeight[size]], 
         // @ts-ignore
         fontWeight: typography.weight[variantConfig.fontWeight[strength]] }, ('css' in variantConfig && variantConfig.css)))), (shadow && {
         textShadow: typography.shadow[shadow]
@@ -37,6 +41,12 @@ var Text = forwardRef(function (props, ref) {
         overflow: 'hidden',
         textOverflow: 'ellipsis',
         whiteSpace: 'nowrap'
+    })), (maxLines && {
+        overflow: 'hidden',
+        display: '-webkit-box',
+        lineClamp: "".concat(maxLines),
+        WebkitLineClamp: "".concat(maxLines),
+        WebkitBoxOrient: 'vertical'
     }));
     // @ts-ignore
     var variantTag = variant && ((_b = variantTagMap[variant]) === null || _b === void 0 ? void 0 : _b[size]);

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

@@ -1 +1 @@
-{"version":3,"file":"Text.js","sources":["../../../src/components/text/Text.tsx"],"sourcesContent":["import { ElementType, ForwardedRef, forwardRef, useContext } 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 { TextContext } from './textContext'\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: variantProp,\n      strength: strengthProp,\n      size: sizeProp,\n      color,\n      shadow,\n      tag,\n      asChild,\n      textAlign,\n      textTransform,\n      ellipses,\n      ...other\n    } = props\n\n    const theme = useTheme()\n    const { variant: contextVariant } = useContext(TextContext)\n    const variant = variantProp ?? contextVariant ?? 'body'\n    const parentVariant = contextVariant && !variantProp\n    const strength = strengthProp ?? (parentVariant ? undefined : 'default')\n    const size = sizeProp ?? (parentVariant ? undefined : 'm')\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      ...(textTransform && { textTransform }),\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    const textElement = (\n      <Tag ref={ref} css={css} {...other}>\n        {children}\n      </Tag>\n    )\n\n    if (parentVariant) {\n      return textElement\n    }\n\n    return (\n      <TextContext.Provider value={{ variant }}>\n        {textElement}\n      </TextContext.Provider>\n    )\n  }\n)\n"],"names":["_jsx"],"mappings":"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"}
+{"version":3,"file":"Text.js","sources":["../../../src/components/text/Text.tsx"],"sourcesContent":["import { ElementType, ForwardedRef, forwardRef, useContext } from 'react'\n\nimport { useTheme } from '@emotion/react'\nimport { Slot } from '@radix-ui/react-slot'\n\nimport { typography } from '../../foundations/typography'\n\nimport { bodyLineHeightMap, variantStylesMap, variantTagMap } from './constants'\nimport { TextContext } from './textContext'\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: variantProp,\n      strength: strengthProp,\n      size: sizeProp,\n      color,\n      shadow,\n      tag,\n      asChild,\n      textAlign,\n      textTransform,\n      ellipses,\n      maxLines,\n      lineHeight,\n      ...other\n    } = props\n\n    const theme = useTheme()\n    const { variant: contextVariant } = useContext(TextContext)\n    const variant = variantProp ?? contextVariant ?? 'body'\n    const parentVariant = contextVariant && !variantProp\n    const strength = strengthProp ?? (parentVariant ? undefined : 'default')\n    const size = sizeProp ?? (parentVariant ? undefined : 'm')\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\n        lineHeight:\n          // @ts-ignore\n          typography.lineHeight[\n            lineHeight && variant === 'body' && size\n              ? // @ts-ignore\n                bodyLineHeightMap[size][lineHeight]\n              : // @ts-ignore\n                variantConfig.lineHeight[size]\n          ],\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      ...(textTransform && { textTransform }),\n      ...(ellipses && {\n        overflow: 'hidden',\n        textOverflow: 'ellipsis',\n        whiteSpace: 'nowrap'\n      }),\n      ...(maxLines && {\n        overflow: 'hidden',\n        display: '-webkit-box',\n        lineClamp: `${maxLines}`,\n        WebkitLineClamp: `${maxLines}`,\n        WebkitBoxOrient: 'vertical'\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    const textElement = (\n      <Tag ref={ref} css={css} {...other}>\n        {children}\n      </Tag>\n    )\n\n    if (parentVariant) {\n      return textElement\n    }\n\n    return (\n      <TextContext.Provider value={{ variant }}>\n        {textElement}\n      </TextContext.Provider>\n    )\n  }\n)\n"],"names":["_jsx"],"mappings":"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"}

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

@@ -124,4 +124,22 @@ export declare const variantStylesMap: {
         };
     };
 };
+export declare const bodyLineHeightMap: {
+    xs: {
+        single: string;
+        multi: string;
+    };
+    s: {
+        single: string;
+        multi: string;
+    };
+    m: {
+        single: string;
+        multi: string;
+    };
+    l: {
+        single: string;
+        multi: string;
+    };
+};
 //# sourceMappingURL=constants.d.ts.map

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

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

package/dist/components/text/constants.js

@@ -53,6 +53,12 @@ var variantStylesMap = {
         fontWeight: { default: 'medium', strong: 'demiBold' }
     }
 };
+var bodyLineHeightMap = {
+    xs: { single: 'xs', multi: 's' },
+    s: { single: 's', multi: 'l' },
+    m: { single: 's', multi: 'l' },
+    l: { single: 'm', multi: 'bl' }
+};
 
-export { variantStylesMap, variantTagMap };
+export { bodyLineHeightMap, variantStylesMap, variantTagMap };
 //# sourceMappingURL=constants.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"constants.js","sources":["../../../src/components/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  title: {\n    xl: 'h5',\n    l: 'h5',\n    m: 'h5',\n    s: 'h5'\n  },\n  label: {\n    xl: 'p',\n    l: 'p',\n    m: 'p',\n    s: 'p',\n    xs: 'p'\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: 'hl', 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: 'm', m: 'l', 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: 'xs', m: 's', l: 's', 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: 'l', 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;AACD,IAAA,KAAK,EAAE;AACL,QAAA,EAAE,EAAE,IAAI;AACR,QAAA,CAAC,EAAE,IAAI;AACP,QAAA,CAAC,EAAE,IAAI;AACP,QAAA,CAAC,EAAE,IAAI;AACR,KAAA;AACD,IAAA,KAAK,EAAE;AACL,QAAA,EAAE,EAAE,GAAG;AACP,QAAA,CAAC,EAAE,GAAG;AACN,QAAA,CAAC,EAAE,GAAG;AACN,QAAA,CAAC,EAAE,GAAG;AACN,QAAA,EAAE,EAAE,GAAG;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,IAAI,EAAE,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAE,EAAE,EAAE,GAAG,EAAE;QAC1D,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;;;;;"}
+{"version":3,"file":"constants.js","sources":["../../../src/components/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  title: {\n    xl: 'h5',\n    l: 'h5',\n    m: 'h5',\n    s: 'h5'\n  },\n  label: {\n    xl: 'p',\n    l: 'p',\n    m: 'p',\n    s: 'p',\n    xs: 'p'\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: 'hl', 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: 'm', m: 'l', 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: 'xs', m: 's', l: 's', 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: 'l', l: 'l' },\n    fontWeight: { default: 'medium', strong: 'demiBold' }\n  }\n}\n\nexport const bodyLineHeightMap = {\n  xs: { single: 'xs', multi: 's' },\n  s: { single: 's', multi: 'l' },\n  m: { single: 's', multi: 'l' },\n  l: { single: 'm', multi: 'bl' }\n}\n"],"names":[],"mappings":"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"}