@activecollab/components 2.0.194 → 2.0.196

package/dist/esm/components/Sort/Sort.d.ts

@@ -0,0 +1,23 @@
+import React from "react";
+import { ElementWithRef } from "../Select";
+export type SortDirections = "asc" | "desc";
+export type SortOption = {
+    id: string;
+    name: string;
+    defaultDirection: SortDirections;
+};
+export type SortObj = {
+    sortBy: string;
+    sortDirection: SortDirections;
+};
+export interface SortProps {
+    label: string;
+    icon?: React.ReactNode;
+    options: SortOption[];
+    selected: SortObj;
+    onChange: (sort: SortObj) => void;
+    target?: ElementWithRef<Element>;
+    className?: string;
+}
+export declare const Sort: React.FC<SortProps>;
+//# sourceMappingURL=Sort.d.ts.map

package/dist/esm/components/Sort/Sort.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sort.d.ts","sourceRoot":"","sources":["../../../../src/components/Sort/Sort.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAyC,MAAM,OAAO,CAAC;AAc9D,OAAO,EAAE,cAAc,EAAE,MAAM,WAAW,CAAC;AAE3C,MAAM,MAAM,cAAc,GAAG,KAAK,GAAG,MAAM,CAAC;AAE5C,MAAM,MAAM,UAAU,GAAG;IACvB,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,gBAAgB,EAAE,cAAc,CAAC;CAClC,CAAC;AAEF,MAAM,MAAM,OAAO,GAAG;IAAE,MAAM,EAAE,MAAM,CAAC;IAAC,aAAa,EAAE,cAAc,CAAA;CAAE,CAAC;AAExE,MAAM,WAAW,SAAS;IACxB,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,OAAO,EAAE,UAAU,EAAE,CAAC;IACtB,QAAQ,EAAE,OAAO,CAAC;IAClB,QAAQ,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;IAClC,MAAM,CAAC,EAAE,cAAc,CAAC,OAAO,CAAC,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,eAAO,MAAM,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,SAAS,CAwFpC,CAAC"}

package/dist/esm/components/Sort/Sort.js

@@ -0,0 +1,71 @@
+import React, { useCallback, useMemo, useState } from "react";
+import { StyledIconButton, StyledList, StyledListItem, StyledListItemName, StyledSortIcon, StyledSortIconDown, StyledSortIconUp, StyledSortWrapper, StyledValueButton } from "./Styles";
+import { Menu } from "../Menu";
+export const Sort = _ref => {
+  let {
+    label,
+    icon,
+    options,
+    selected,
+    onChange,
+    target,
+    className
+  } = _ref;
+  const [open, setOpen] = useState(false);
+  const handleClose = useCallback(() => setOpen(false), []);
+  const handleOpen = useCallback(() => setOpen(true), []);
+  const handleOnChange = useCallback(event => {
+    const nextSortBy = event.currentTarget.dataset.id;
+    let nextOrder = selected.sortDirection === "desc" ? "asc" : "desc";
+    if (nextSortBy !== selected.sortBy) {
+      var _options$find;
+      nextOrder = ((_options$find = options.find(opt => opt.id === nextSortBy)) == null ? void 0 : _options$find.defaultDirection) || "asc";
+    }
+    onChange({
+      sortBy: nextSortBy,
+      sortDirection: nextOrder
+    });
+  }, [onChange, selected, options]);
+  const labelText = useMemo(() => {
+    var _options$find$name, _options$find2;
+    return (_options$find$name = (_options$find2 = options.find(opt => opt.id === selected.sortBy)) == null ? void 0 : _options$find2.name) != null ? _options$find$name : "";
+  }, [selected.sortBy, options]);
+  if (!labelText) {
+    console.warn("Cannot find selected id in options.");
+  }
+  return /*#__PURE__*/React.createElement(Menu, {
+    onOpen: handleOpen,
+    onClose: handleClose,
+    position: "bottom-end",
+    target: target || /*#__PURE__*/React.createElement(StyledSortWrapper, {
+      className: className
+    }, /*#__PURE__*/React.createElement(StyledValueButton, {
+      active: open,
+      value: labelText,
+      label: label,
+      "data-testid": "sort-button"
+    }), /*#__PURE__*/React.createElement(StyledIconButton, {
+      active: open,
+      variant: "text gray",
+      "data-testid": "sort-icon-button"
+    }, icon || /*#__PURE__*/React.createElement(StyledSortIcon, null)))
+  }, /*#__PURE__*/React.createElement(StyledList, null, options.map(_ref2 => {
+    let {
+      id,
+      name,
+      defaultDirection
+    } = _ref2;
+    let showDownArrow = selected.sortDirection === "asc";
+    if (selected.sortBy !== id) {
+      showDownArrow = defaultDirection === "asc";
+    }
+    return /*#__PURE__*/React.createElement(StyledListItem, {
+      key: id,
+      onClick: handleOnChange,
+      "data-id": id,
+      "data-testid": id,
+      $active: id === selected.sortBy
+    }, /*#__PURE__*/React.createElement(StyledListItemName, null, name), showDownArrow ? /*#__PURE__*/React.createElement(StyledSortIconDown, null) : /*#__PURE__*/React.createElement(StyledSortIconUp, null));
+  })));
+};
+//# sourceMappingURL=Sort.js.map

package/dist/esm/components/Sort/Sort.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sort.js","names":["React","useCallback","useMemo","useState","StyledIconButton","StyledList","StyledListItem","StyledListItemName","StyledSortIcon","StyledSortIconDown","StyledSortIconUp","StyledSortWrapper","StyledValueButton","Menu","Sort","_ref","label","icon","options","selected","onChange","target","className","open","setOpen","handleClose","handleOpen","handleOnChange","event","nextSortBy","currentTarget","dataset","id","nextOrder","sortDirection","sortBy","_options$find","find","opt","defaultDirection","labelText","_options$find$name","_options$find2","name","console","warn","createElement","onOpen","onClose","position","active","value","variant","map","_ref2","showDownArrow","key","onClick","$active"],"sources":["../../../../src/components/Sort/Sort.tsx"],"sourcesContent":["import React, { useCallback, useMemo, useState } from \"react\";\n\nimport {\n  StyledIconButton,\n  StyledList,\n  StyledListItem,\n  StyledListItemName,\n  StyledSortIcon,\n  StyledSortIconDown,\n  StyledSortIconUp,\n  StyledSortWrapper,\n  StyledValueButton,\n} from \"./Styles\";\nimport { Menu } from \"../Menu\";\nimport { ElementWithRef } from \"../Select\";\n\nexport type SortDirections = \"asc\" | \"desc\";\n\nexport type SortOption = {\n  id: string;\n  name: string;\n  defaultDirection: SortDirections;\n};\n\nexport type SortObj = { sortBy: string; sortDirection: SortDirections };\n\nexport interface SortProps {\n  label: string;\n  icon?: React.ReactNode;\n  options: SortOption[];\n  selected: SortObj;\n  onChange: (sort: SortObj) => void;\n  target?: ElementWithRef<Element>;\n  className?: string;\n}\n\nexport const Sort: React.FC<SortProps> = ({\n  label,\n  icon,\n  options,\n  selected,\n  onChange,\n  target,\n  className,\n}) => {\n  const [open, setOpen] = useState(false);\n\n  const handleClose = useCallback(() => setOpen(false), []);\n  const handleOpen = useCallback(() => setOpen(true), []);\n\n  const handleOnChange = useCallback(\n    (event: React.MouseEvent<HTMLLIElement>) => {\n      const nextSortBy = event.currentTarget.dataset.id as string;\n      let nextOrder: SortDirections =\n        selected.sortDirection === \"desc\" ? \"asc\" : \"desc\";\n\n      if (nextSortBy !== selected.sortBy) {\n        nextOrder =\n          options.find((opt) => opt.id === nextSortBy)?.defaultDirection ||\n          \"asc\";\n      }\n\n      onChange({ sortBy: nextSortBy, sortDirection: nextOrder });\n    },\n    [onChange, selected, options]\n  );\n\n  const labelText = useMemo(() => {\n    return options.find((opt) => opt.id === selected.sortBy)?.name ?? \"\";\n  }, [selected.sortBy, options]);\n\n  if (!labelText) {\n    console.warn(\"Cannot find selected id in options.\");\n  }\n\n  return (\n    <Menu\n      onOpen={handleOpen}\n      onClose={handleClose}\n      position=\"bottom-end\"\n      target={\n        target || (\n          <StyledSortWrapper className={className}>\n            <StyledValueButton\n              active={open}\n              value={labelText}\n              label={label}\n              data-testid=\"sort-button\"\n            />\n            <StyledIconButton\n              active={open}\n              variant=\"text gray\"\n              data-testid=\"sort-icon-button\"\n            >\n              {icon || <StyledSortIcon />}\n            </StyledIconButton>\n          </StyledSortWrapper>\n        )\n      }\n    >\n      <StyledList>\n        {options.map(({ id, name, defaultDirection }) => {\n          let showDownArrow = selected.sortDirection === \"asc\";\n\n          if (selected.sortBy !== id) {\n            showDownArrow = defaultDirection === \"asc\";\n          }\n\n          return (\n            <StyledListItem\n              key={id}\n              onClick={handleOnChange}\n              data-id={id}\n              data-testid={id}\n              $active={id === selected.sortBy}\n            >\n              <StyledListItemName>{name}</StyledListItemName>\n              {showDownArrow ? <StyledSortIconDown /> : <StyledSortIconUp />}\n            </StyledListItem>\n          );\n        })}\n      </StyledList>\n    </Menu>\n  );\n};\n"],"mappings":"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"}

package/dist/esm/components/Sort/Styles.d.ts

@@ -0,0 +1,30 @@
+/// <reference types="react" />
+import { ListItemProps } from "../List";
+export declare const StyledSortWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const StyledValueButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../ValueButton").IValueButtonProps & import("react").RefAttributes<HTMLButtonElement>>, any, {}, never>;
+export declare const StyledIconButton: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../IconButton").IconButtonProps & {
+    children?: import("react").ReactNode;
+} & import("react").RefAttributes<HTMLButtonElement>>, any, {}, never>;
+export declare const StyledSortIcon: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>>, any, {}, never>;
+export declare const StyledSortIconDown: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>>, any, {}, never>;
+export declare const StyledSortIconUp: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & import("react").RefAttributes<SVGSVGElement>>, any, {}, never>;
+export declare const StyledList: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<import("../List").ListProps & {
+    children?: import("react").ReactNode;
+} & import("react").HTMLAttributes<HTMLUListElement> & import("react").RefAttributes<HTMLUListElement>> & {
+    Item: import("react").ForwardRefExoticComponent<ListItemProps & {
+        children?: import("react").ReactNode;
+    } & import("react").HTMLAttributes<HTMLLIElement> & import("react").RefAttributes<HTMLLIElement>>;
+    Separator: {
+        ({ className, ...props }: import("react").HTMLAttributes<HTMLDivElement>): import("react").JSX.Element;
+        displayName: string;
+    };
+}, any, {}, never>;
+interface StyledListItemProps extends ListItemProps {
+    $active?: boolean;
+}
+export declare const StyledListItem: import("styled-components").StyledComponent<import("react").ForwardRefExoticComponent<ListItemProps & {
+    children?: import("react").ReactNode;
+} & import("react").HTMLAttributes<HTMLLIElement> & import("react").RefAttributes<HTMLLIElement>>, any, StyledListItemProps, never>;
+export declare const StyledListItemName: import("styled-components").StyledComponent<"span", any, {}, never>;
+export {};
+//# sourceMappingURL=Styles.d.ts.map

package/dist/esm/components/Sort/Styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/Sort/Styles.ts"],"names":[],"mappings":";AAKA,OAAO,EAAkB,aAAa,EAAE,MAAM,SAAS,CAAC;AAGxD,eAAO,MAAM,iBAAiB,oEAE7B,CAAC;AAIF,eAAO,MAAM,iBAAiB,uMAE7B,CAAC;AAIF,eAAO,MAAM,gBAAgB;;sEAE5B,CAAC;AAIF,eAAO,MAAM,cAAc,6MAE1B,CAAC;AAIF,eAAO,MAAM,kBAAkB,6MAE9B,CAAC;AAIF,eAAO,MAAM,gBAAgB,6MAE5B,CAAC;AAIF,eAAO,MAAM,UAAU;;;;;;;;;;kBAEtB,CAAC;AAIF,UAAU,mBAAoB,SAAQ,aAAa;IACjD,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB;AAED,eAAO,MAAM,cAAc;;mIAwB1B,CAAC;AAIF,eAAO,MAAM,kBAAkB,qEAE9B,CAAC"}

package/dist/esm/components/Sort/Styles.js

@@ -0,0 +1,85 @@
+import styled, { css } from "styled-components";
+import { IconButton } from "../IconButton";
+import { ArrowDownLongIcon, ArrowUpLongIcon, SortGeneralIcon } from "../Icons";
+import { List, ListItem } from "../List";
+import { ValueButton } from "../ValueButton";
+export const StyledSortWrapper = styled.div.withConfig({
+  displayName: "Styles__StyledSortWrapper",
+  componentId: "sc-11r5ac9-0"
+})(["", ";"], {
+  "width": "fit-content"
+});
+StyledSortWrapper.displayName = "StyledSortWrapper";
+export const StyledValueButton = styled(ValueButton).withConfig({
+  displayName: "Styles__StyledValueButton",
+  componentId: "sc-11r5ac9-1"
+})(["", ";"], {
+  "display": "none",
+  "alignItems": "center",
+  "@media (min-width: 768px)": {
+    "display": "flex"
+  }
+});
+StyledValueButton.displayName = "StyledValueButton";
+export const StyledIconButton = styled(IconButton).withConfig({
+  displayName: "Styles__StyledIconButton",
+  componentId: "sc-11r5ac9-2"
+})(["", ";"], {
+  "display": "flex",
+  "alignItems": "center",
+  ":hover": {
+    "color": "var(--color-primary)"
+  },
+  "@media (min-width: 768px)": {
+    "display": "none"
+  }
+});
+StyledIconButton.displayName = "StyledIconButton";
+export const StyledSortIcon = styled(SortGeneralIcon).withConfig({
+  displayName: "Styles__StyledSortIcon",
+  componentId: "sc-11r5ac9-3"
+})(["", ";"], {
+  "marginTop": "0px"
+});
+StyledSortIcon.displayName = "StyledSortIcon";
+export const StyledSortIconDown = styled(ArrowDownLongIcon).withConfig({
+  displayName: "Styles__StyledSortIconDown",
+  componentId: "sc-11r5ac9-4"
+})(["", ";"], {
+  "flexShrink": "0"
+});
+StyledSortIconDown.displayName = "StyledSortIconDown";
+export const StyledSortIconUp = styled(ArrowUpLongIcon).withConfig({
+  displayName: "Styles__StyledSortIconUp",
+  componentId: "sc-11r5ac9-5"
+})(["", ";"], {
+  "flexShrink": "0"
+});
+StyledSortIconUp.displayName = "StyledSortIconUp";
+export const StyledList = styled(List).withConfig({
+  displayName: "Styles__StyledList",
+  componentId: "sc-11r5ac9-6"
+})(["", ";"], {
+  "paddingTop": "0.5rem",
+  "paddingBottom": "0.5rem"
+});
+StyledList.displayName = "StyledList";
+export const StyledListItem = styled(ListItem).withConfig({
+  displayName: "Styles__StyledListItem",
+  componentId: "sc-11r5ac9-7"
+})(["", ";svg{visibility:hidden;}&:hover svg{fill:var(--color-theme-500);visibility:visible;}", ""], {
+  "justifyContent": "space-between"
+}, props => props.$active && css(["", ";svg{fill:var(--color-primary);visibility:visible;}&:hover svg{fill:var(--color-primary);visibility:visible;}"], {
+  "color": "var(--color-primary)"
+}));
+StyledListItem.displayName = "StyledListItem";
+export const StyledListItemName = styled.span.withConfig({
+  displayName: "Styles__StyledListItemName",
+  componentId: "sc-11r5ac9-8"
+})(["", ";"], {
+  "overflow": "hidden",
+  "textOverflow": "ellipsis",
+  "whiteSpace": "nowrap"
+});
+StyledListItemName.displayName = "StyledListItemName";
+//# sourceMappingURL=Styles.js.map

package/dist/esm/components/Sort/Styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Styles.js","names":["styled","css","IconButton","ArrowDownLongIcon","ArrowUpLongIcon","SortGeneralIcon","List","ListItem","ValueButton","StyledSortWrapper","div","withConfig","displayName","componentId","StyledValueButton","StyledIconButton","StyledSortIcon","StyledSortIconDown","StyledSortIconUp","StyledList","StyledListItem","props","$active","StyledListItemName","span"],"sources":["../../../../src/components/Sort/Styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nimport { IconButton } from \"../IconButton\";\nimport { ArrowDownLongIcon, ArrowUpLongIcon, SortGeneralIcon } from \"../Icons\";\nimport { List, ListItem, ListItemProps } from \"../List\";\nimport { ValueButton } from \"../ValueButton\";\n\nexport const StyledSortWrapper = styled.div`\n  ${tw`tw-w-fit`};\n`;\n\nStyledSortWrapper.displayName = \"StyledSortWrapper\";\n\nexport const StyledValueButton = styled(ValueButton)`\n  ${tw`tw-hidden md:tw-flex tw-items-center`};\n`;\n\nStyledValueButton.displayName = \"StyledValueButton\";\n\nexport const StyledIconButton = styled(IconButton)`\n  ${tw`tw-flex tw-items-center md:tw-hidden hover:tw-text-primary`};\n`;\n\nStyledIconButton.displayName = \"StyledIconButton\";\n\nexport const StyledSortIcon = styled(SortGeneralIcon)`\n  ${tw`tw-mt-0`};\n`;\n\nStyledSortIcon.displayName = \"StyledSortIcon\";\n\nexport const StyledSortIconDown = styled(ArrowDownLongIcon)`\n  ${tw`tw-shrink-0`};\n`;\n\nStyledSortIconDown.displayName = \"StyledSortIconDown\";\n\nexport const StyledSortIconUp = styled(ArrowUpLongIcon)`\n  ${tw`tw-shrink-0`};\n`;\n\nStyledSortIconUp.displayName = \"StyledSortIconUp\";\n\nexport const StyledList = styled(List)`\n  ${tw`tw-py-2`};\n`;\n\nStyledList.displayName = \"StyledList\";\n\ninterface StyledListItemProps extends ListItemProps {\n  $active?: boolean;\n}\n\nexport const StyledListItem = styled(ListItem)<StyledListItemProps>`\n  ${tw`tw-justify-between`};\n  svg {\n    visibility: hidden;\n  }\n  &:hover svg {\n    fill: var(--color-theme-500);\n    visibility: visible;\n  }\n\n  ${(props) =>\n    props.$active &&\n    css`\n      ${tw`tw-text-primary`};\n\n      svg {\n        fill: var(--color-primary);\n        visibility: visible;\n      }\n      &:hover svg {\n        fill: var(--color-primary);\n        visibility: visible;\n      }\n    `}\n`;\n\nStyledListItem.displayName = \"StyledListItem\";\n\nexport const StyledListItemName = styled.span`\n  ${tw`tw-truncate`};\n`;\n\nStyledListItemName.displayName = \"StyledListItemName\";\n"],"mappings":"AAAA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAG/C,SAASC,UAAU,QAAQ,eAAe;AAC1C,SAASC,iBAAiB,EAAEC,eAAe,EAAEC,eAAe,QAAQ,UAAU;AAC9E,SAASC,IAAI,EAAEC,QAAQ,QAAuB,SAAS;AACvD,SAASC,WAAW,QAAQ,gBAAgB;AAE5C,OAAO,MAAMC,iBAAiB,GAAGT,MAAM,CAACU,GAAG,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,cACrC;EAAA;AAAS,CAAC,CACf;AAEDJ,iBAAiB,CAACG,WAAW,GAAG,mBAAmB;AAEnD,OAAO,MAAME,iBAAiB,GAAGd,MAAM,CAACQ,WAAW,CAAC,CAAAG,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,cAC9C;EAAA;EAAA;EAAA;IAAA;EAAA;AAAqC,CAAC,CAC3C;AAEDC,iBAAiB,CAACF,WAAW,GAAG,mBAAmB;AAEnD,OAAO,MAAMG,gBAAgB,GAAGf,MAAM,CAACE,UAAU,CAAC,CAAAS,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,cAC5C;EAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAA2D,CAAC,CACjE;AAEDE,gBAAgB,CAACH,WAAW,GAAG,kBAAkB;AAEjD,OAAO,MAAMI,cAAc,GAAGhB,MAAM,CAACK,eAAe,CAAC,CAAAM,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,cAC/C;EAAA;AAAQ,CAAC,CACd;AAEDG,cAAc,CAACJ,WAAW,GAAG,gBAAgB;AAE7C,OAAO,MAAMK,kBAAkB,GAAGjB,MAAM,CAACG,iBAAiB,CAAC,CAAAQ,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,cACrD;EAAA;AAAY,CAAC,CAClB;AAEDI,kBAAkB,CAACL,WAAW,GAAG,oBAAoB;AAErD,OAAO,MAAMM,gBAAgB,GAAGlB,MAAM,CAACI,eAAe,CAAC,CAAAO,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,cACjD;EAAA;AAAY,CAAC,CAClB;AAEDK,gBAAgB,CAACN,WAAW,GAAG,kBAAkB;AAEjD,OAAO,MAAMO,UAAU,GAAGnB,MAAM,CAACM,IAAI,CAAC,CAAAK,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,cAChC;EAAA;EAAA;AAAQ,CAAC,CACd;AAEDM,UAAU,CAACP,WAAW,GAAG,YAAY;AAMrC,OAAO,MAAMQ,cAAc,GAAGpB,MAAM,CAACO,QAAQ,CAAC,CAAAI,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,qGACxC;EAAA;AAAmB,CAAC,EASrBQ,KAAK,IACNA,KAAK,CAACC,OAAO,IACbrB,GAAG,wHACG;EAAA;AAAgB,CAAC,CAUtB,CACJ;AAEDmB,cAAc,CAACR,WAAW,GAAG,gBAAgB;AAE7C,OAAO,MAAMW,kBAAkB,GAAGvB,MAAM,CAACwB,IAAI,CAAAb,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,cACvC;EAAA;EAAA;EAAA;AAAY,CAAC,CAClB;AAEDU,kBAAkB,CAACX,WAAW,GAAG,oBAAoB"}

package/dist/esm/components/Sort/index.d.ts

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

package/dist/esm/components/Sort/index.d.ts.map

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

package/dist/esm/components/Sort/index.js

@@ -0,0 +1,2 @@
+export * from "./Sort";
+//# sourceMappingURL=index.js.map

package/dist/esm/components/Sort/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../../src/components/Sort/index.ts"],"sourcesContent":["export * from \"./Sort\";\n"],"mappings":"AAAA,cAAc,QAAQ"}

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

@@ -80,4 +80,5 @@ export * from "./CommandPalette";
 export * from "./EmptySlate";
 export * from "./Toolbar";
 export * from "./InfoBox";
+export * from "./Sort";
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,sBAAsB,CAAC;AACrC,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,0BAA0B,CAAC;AACzC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,oBAAoB,CAAC;AACnC,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,QAAQ,CAAC;AACvB,cAAc,cAAc,CAAC;AAC7B,cAAc,kBAAkB,CAAC;AACjC,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,OAAO,CAAC;AACtB,cAAc,WAAW,CAAC;AAC1B,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC;AACvB,cAAc,aAAa,CAAC;AAC5B,cAAc,WAAW,CAAC;AAC1B,cAAc,cAAc,CAAC;AAC7B,cAAc,QAAQ,CAAC;AACvB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,SAAS,CAAC;AACxB,cAAc,YAAY,CAAC;AAC3B,cAAc,SAAS,CAAC;AACxB,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,sBAAsB,CAAC;AACrC,cAAc,WAAW,CAAC;AAC1B,cAAc,aAAa,CAAC;AAC5B,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC;AAC1B,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,eAAe,CAAC;AAC9B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC;AACzB,cAAc,iBAAiB,CAAC;AAChC,cAAc,YAAY,CAAC;AAC3B,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,YAAY,CAAC;AAC3B,cAAc,0BAA0B,CAAC;AACzC,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,aAAa,CAAC;AAC5B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,mBAAmB,CAAC;AAClC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC;AACvB,cAAc,WAAW,CAAC;AAC1B,cAAc,OAAO,CAAC;AACtB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,UAAU,CAAC;AACzB,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC;AAC7B,cAAc,SAAS,CAAC;AACxB,cAAc,eAAe,CAAC;AAC9B,cAAc,kBAAkB,CAAC;AACjC,cAAc,cAAc,CAAC;AAC7B,cAAc,WAAW,CAAC;AAC1B,cAAc,WAAW,CAAC;AAC1B,cAAc,QAAQ,CAAC"}

package/dist/esm/components/index.js

@@ -80,4 +80,5 @@ export * from "./CommandPalette";
 export * from "./EmptySlate";
 export * from "./Toolbar";
 export * from "./InfoBox";
+export * from "./Sort";
 //# sourceMappingURL=index.js.map

package/dist/esm/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/index.ts"],"sourcesContent":["export * from \"./Button\";\nexport * from \"./ButtonGroup\";\nexport * from \"./Breadcrumbs\";\nexport * from \"./CounterButton\";\nexport * from \"./Steppers\";\nexport * from \"./Tables\";\nexport * from \"./CompleteCheckbox\";\nexport * from \"./Paper\";\nexport * from \"./ScaleBar\";\nexport * from \"./Card\";\nexport * from \"./EntityCard\";\nexport * from \"./EntitiesHeader\";\nexport * from \"./Signifier\";\nexport * from \"./Avatar\";\nexport * from \"./Tag\";\nexport * from \"./Loaders\";\nexport * from \"./Nav\";\nexport * from \"./Bubble\";\nexport * from \"./Input\";\nexport * from \"./Display\";\nexport * from \"./Menu\";\nexport * from \"./Expanders\";\nexport * from \"./Pickers\";\nexport * from \"./DatePicker\";\nexport * from \"./List\";\nexport * from \"./MenuSelector\";\nexport * from \"./MultiAvatar\";\nexport * from \"./RadioButton\";\nexport * from \"./ScrollShadow\";\nexport * from \"./Icons\";\nexport * from \"./Textarea\";\nexport * from \"./Modal\";\nexport * from \"./Sheet\";\nexport * from \"./Header\";\nexport * from \"./AutoResizeTextarea\";\nexport * from \"./Overlay\";\nexport * from \"./Accordion\";\nexport * from \"./Choose\";\nexport * from \"./Links\";\nexport * from \"./SelectDate\";\nexport * from \"./Popper\";\nexport * from \"./ToastMessage\";\nexport * from \"./Tooltip\";\nexport * from \"./Transitions\";\nexport * from \"./Window\";\nexport * from \"./ValueButton\";\nexport * from \"./Select\";\nexport * from \"./SelectTrigger\";\nexport * from \"./SelectTime\";\nexport * from \"./Dialog\";\nexport * from \"./ConfirmDialog\";\nexport * from \"./Checkbox\";\nexport * from \"./Toggle\";\nexport * from \"./Typography\";\nexport * from \"./Autocomplete\";\nexport * from \"./ComboBox\";\nexport * from \"./Button/AddToListButton\";\nexport * from \"./ProgressBar\";\nexport * from \"./ProgressPie\";\nexport * from \"./Reactions\";\nexport * from \"./Label\";\nexport * from \"./GlobalStyle\";\nexport * from \"./ProgressRing\";\nexport * from \"./EditableContent\";\nexport * from \"./EditableText\";\nexport * from \"./EditableHours\";\nexport * from \"./EditableCurrency\";\nexport * from \"./Folder\";\nexport * from \"./Chip\";\nexport * from \"./Trigger\";\nexport * from \"./Dot\";\nexport * from \"./Entity\";\nexport * from \"./Filter\";\nexport * from \"./Wizard\";\nexport * from \"./IconButton\";\nexport * from \"./Typography\";\nexport * from \"./Badge\";\nexport * from \"./AvatarGroup\";\nexport * from \"./CommandPalette\";\nexport * from \"./EmptySlate\";\nexport * from \"./Toolbar\";\nexport * from \"./InfoBox\";\n"],"mappings":"AAAA,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,eAAe;AAC7B,cAAc,iBAAiB;AAC/B,cAAc,YAAY;AAC1B,cAAc,UAAU;AACxB,cAAc,oBAAoB;AAClC,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,cAAc;AAC5B,cAAc,kBAAkB;AAChC,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,OAAO;AACrB,cAAc,WAAW;AACzB,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,aAAa;AAC3B,cAAc,WAAW;AACzB,cAAc,cAAc;AAC5B,cAAc,QAAQ;AACtB,cAAc,gBAAgB;AAC9B,cAAc,eAAe;AAC7B,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,UAAU;AACxB,cAAc,sBAAsB;AACpC,cAAc,WAAW;AACzB,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,cAAc;AAC5B,cAAc,UAAU;AACxB,cAAc,gBAAgB;AAC9B,cAAc,WAAW;AACzB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,iBAAiB;AAC/B,cAAc,cAAc;AAC5B,cAAc,UAAU;AACxB,cAAc,iBAAiB;AAC/B,cAAc,YAAY;AAC1B,cAAc,UAAU;AACxB,cAAc,cAAc;AAC5B,cAAc,gBAAgB;AAC9B,cAAc,YAAY;AAC1B,cAAc,0BAA0B;AACxC,cAAc,eAAe;AAC7B,cAAc,eAAe;AAC7B,cAAc,aAAa;AAC3B,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,mBAAmB;AACjC,cAAc,gBAAgB;AAC9B,cAAc,iBAAiB;AAC/B,cAAc,oBAAoB;AAClC,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,WAAW;AACzB,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,cAAc;AAC5B,cAAc,cAAc;AAC5B,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,kBAAkB;AAChC,cAAc,cAAc;AAC5B,cAAc,WAAW;AACzB,cAAc,WAAW"}
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/components/index.ts"],"sourcesContent":["export * from \"./Button\";\nexport * from \"./ButtonGroup\";\nexport * from \"./Breadcrumbs\";\nexport * from \"./CounterButton\";\nexport * from \"./Steppers\";\nexport * from \"./Tables\";\nexport * from \"./CompleteCheckbox\";\nexport * from \"./Paper\";\nexport * from \"./ScaleBar\";\nexport * from \"./Card\";\nexport * from \"./EntityCard\";\nexport * from \"./EntitiesHeader\";\nexport * from \"./Signifier\";\nexport * from \"./Avatar\";\nexport * from \"./Tag\";\nexport * from \"./Loaders\";\nexport * from \"./Nav\";\nexport * from \"./Bubble\";\nexport * from \"./Input\";\nexport * from \"./Display\";\nexport * from \"./Menu\";\nexport * from \"./Expanders\";\nexport * from \"./Pickers\";\nexport * from \"./DatePicker\";\nexport * from \"./List\";\nexport * from \"./MenuSelector\";\nexport * from \"./MultiAvatar\";\nexport * from \"./RadioButton\";\nexport * from \"./ScrollShadow\";\nexport * from \"./Icons\";\nexport * from \"./Textarea\";\nexport * from \"./Modal\";\nexport * from \"./Sheet\";\nexport * from \"./Header\";\nexport * from \"./AutoResizeTextarea\";\nexport * from \"./Overlay\";\nexport * from \"./Accordion\";\nexport * from \"./Choose\";\nexport * from \"./Links\";\nexport * from \"./SelectDate\";\nexport * from \"./Popper\";\nexport * from \"./ToastMessage\";\nexport * from \"./Tooltip\";\nexport * from \"./Transitions\";\nexport * from \"./Window\";\nexport * from \"./ValueButton\";\nexport * from \"./Select\";\nexport * from \"./SelectTrigger\";\nexport * from \"./SelectTime\";\nexport * from \"./Dialog\";\nexport * from \"./ConfirmDialog\";\nexport * from \"./Checkbox\";\nexport * from \"./Toggle\";\nexport * from \"./Typography\";\nexport * from \"./Autocomplete\";\nexport * from \"./ComboBox\";\nexport * from \"./Button/AddToListButton\";\nexport * from \"./ProgressBar\";\nexport * from \"./ProgressPie\";\nexport * from \"./Reactions\";\nexport * from \"./Label\";\nexport * from \"./GlobalStyle\";\nexport * from \"./ProgressRing\";\nexport * from \"./EditableContent\";\nexport * from \"./EditableText\";\nexport * from \"./EditableHours\";\nexport * from \"./EditableCurrency\";\nexport * from \"./Folder\";\nexport * from \"./Chip\";\nexport * from \"./Trigger\";\nexport * from \"./Dot\";\nexport * from \"./Entity\";\nexport * from \"./Filter\";\nexport * from \"./Wizard\";\nexport * from \"./IconButton\";\nexport * from \"./Typography\";\nexport * from \"./Badge\";\nexport * from \"./AvatarGroup\";\nexport * from \"./CommandPalette\";\nexport * from \"./EmptySlate\";\nexport * from \"./Toolbar\";\nexport * from \"./InfoBox\";\nexport * from \"./Sort\";\n"],"mappings":"AAAA,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,eAAe;AAC7B,cAAc,iBAAiB;AAC/B,cAAc,YAAY;AAC1B,cAAc,UAAU;AACxB,cAAc,oBAAoB;AAClC,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,cAAc;AAC5B,cAAc,kBAAkB;AAChC,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,OAAO;AACrB,cAAc,WAAW;AACzB,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,aAAa;AAC3B,cAAc,WAAW;AACzB,cAAc,cAAc;AAC5B,cAAc,QAAQ;AACtB,cAAc,gBAAgB;AAC9B,cAAc,eAAe;AAC7B,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,SAAS;AACvB,cAAc,SAAS;AACvB,cAAc,UAAU;AACxB,cAAc,sBAAsB;AACpC,cAAc,WAAW;AACzB,cAAc,aAAa;AAC3B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,cAAc;AAC5B,cAAc,UAAU;AACxB,cAAc,gBAAgB;AAC9B,cAAc,WAAW;AACzB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,iBAAiB;AAC/B,cAAc,cAAc;AAC5B,cAAc,UAAU;AACxB,cAAc,iBAAiB;AAC/B,cAAc,YAAY;AAC1B,cAAc,UAAU;AACxB,cAAc,cAAc;AAC5B,cAAc,gBAAgB;AAC9B,cAAc,YAAY;AAC1B,cAAc,0BAA0B;AACxC,cAAc,eAAe;AAC7B,cAAc,eAAe;AAC7B,cAAc,aAAa;AAC3B,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,mBAAmB;AACjC,cAAc,gBAAgB;AAC9B,cAAc,iBAAiB;AAC/B,cAAc,oBAAoB;AAClC,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,WAAW;AACzB,cAAc,OAAO;AACrB,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,cAAc;AAC5B,cAAc,cAAc;AAC5B,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,kBAAkB;AAChC,cAAc,cAAc;AAC5B,cAAc,WAAW;AACzB,cAAc,WAAW;AACzB,cAAc,QAAQ"}

package/dist/index.js

@@ -362,16 +362,16 @@
   });
   ButtonGroup.displayName = "ButtonGroup";
 
-  var StyledList = styled__default["default"].ul.withConfig({
+  var StyledList$1 = styled__default["default"].ul.withConfig({
     displayName: "Styles__StyledList",
     componentId: "sc-dv1w0m-0"
   })(["list-style-type:none;margin:0;padding:0;"]);
-  StyledList.displayName = "StyledList";
-  var StyledListItem = styled__default["default"].li.withConfig({
+  StyledList$1.displayName = "StyledList";
+  var StyledListItem$1 = styled__default["default"].li.withConfig({
     displayName: "Styles__StyledListItem",
     componentId: "sc-dv1w0m-1"
   })(["", " ", " display:flex;flex-direction:row;align-items:center;cursor:pointer;padding:0 1rem;margin:0.25rem 0;font-size:0.875rem;user-select:none;color:var(--color-theme-900);line-height:28px;> svg:first-child{margin-right:8px;}&:hover,&:focus-visible{background-color:var(--color-theme-200);outline:none;}"], BoxSizingStyle, FontStyle);
-  StyledListItem.displayName = "StyledListItem";
+  StyledListItem$1.displayName = "StyledListItem";
   var StyledListSeparator$1 = styled__default["default"].div.withConfig({
     displayName: "Styles__StyledListSeparator",
     componentId: "sc-dv1w0m-2"
@@ -383,7 +383,7 @@
     var children = _ref.children,
       className = _ref.className,
       props = _objectWithoutProperties(_ref, _excluded$1z);
-    return /*#__PURE__*/React__default["default"].createElement(StyledListItem, _extends({
+    return /*#__PURE__*/React__default["default"].createElement(StyledListItem$1, _extends({
       className: classNames__default["default"]("c-list-item", className),
       ref: ref,
       tabIndex: 0
@@ -406,7 +406,7 @@
     var children = _ref.children,
       className = _ref.className,
       props = _objectWithoutProperties(_ref, _excluded$1x);
-    return /*#__PURE__*/React__default["default"].createElement(StyledList, _extends({
+    return /*#__PURE__*/React__default["default"].createElement(StyledList$1, _extends({
       className: className,
       ref: ref,
       tabIndex: -1
@@ -877,7 +877,7 @@
     return time === undefined || /^([01]\d|2[0-3]):([0-5]\d)$/.test(time);
   };
 
-  var StyledIconButton = styled__default["default"](Button).withConfig({
+  var StyledIconButton$1 = styled__default["default"](Button).withConfig({
     displayName: "Styles__StyledIconButton",
     componentId: "sc-1teza2f-0"
   })(["display:inline-flex;justify-content:center;align-items:center;padding:0;width:32px;", " ", ""], function (_ref) {
@@ -919,7 +919,7 @@
       size = _ref.size,
       active = _ref.active,
       args = _objectWithoutProperties(_ref, _excluded$1w);
-    return /*#__PURE__*/React__default["default"].createElement(StyledIconButton, _extends({
+    return /*#__PURE__*/React__default["default"].createElement(StyledIconButton$1, _extends({
       className: className,
       variant: variant,
       size: size,
@@ -17587,7 +17587,7 @@
     var formattedLongValue = formatNumber(value, thousandSeparator, decimalSeparator, trimDecimals, decimalSpaces, "long");
     if (format === "short") {
       return /*#__PURE__*/React__default["default"].createElement(Tooltip, {
-        title: formattedLongValue,
+        title: formatNumber(value, thousandSeparator, decimalSeparator, false, decimalSpaces, "long"),
         disable: disableTooltip || !formattedLongValue.includes(thousandSeparator) && !formattedLongValue.includes(decimalSeparator)
       }, /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
         as: as,
@@ -17634,7 +17634,7 @@
     var formattedLongValue = formatCurrency(value, thousandSeparator, decimalSeparator, trimDecimals, decimalSpaces, "long", currencyCode, currencyPosition);
     if (format === "short") {
       return /*#__PURE__*/React__default["default"].createElement(Tooltip, {
-        title: formattedLongValue,
+        title: formatCurrency(value, thousandSeparator, decimalSeparator, false, decimalSpaces, "long", currencyCode, currencyPosition),
         disable: disableTooltip || !formattedLongValue.includes(thousandSeparator) && !formattedLongValue.includes(decimalSeparator)
       }, /*#__PURE__*/React__default["default"].createElement(Typography, _extends({
         as: as,
@@ -19485,7 +19485,7 @@
     componentId: "sc-7n59oz-1"
   })([""]);
   StyledValueButtonValue.displayName = "StyledValueButtonValue";
-  var StyledValueButton = styled__default["default"](Button).withConfig({
+  var StyledValueButton$1 = styled__default["default"](Button).withConfig({
     displayName: "Styles__StyledValueButton",
     componentId: "sc-7n59oz-2"
   })(["", " ", ""], function (props) {
@@ -19497,7 +19497,7 @@
       "pointerEvents": "none"
     });
   });
-  StyledValueButton.displayName = "StyledValueButton";
+  StyledValueButton$1.displayName = "StyledValueButton";
 
   var _excluded$o = ["active", "alwaysShowIcon", "icon", "label", "value"];
   var ValueButton = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
@@ -19509,7 +19509,7 @@
       label = _ref.label,
       value = _ref.value,
       args = _objectWithoutProperties(_ref, _excluded$o);
-    return /*#__PURE__*/React__default["default"].createElement(StyledValueButton, _extends({
+    return /*#__PURE__*/React__default["default"].createElement(StyledValueButton$1, _extends({
       className: "c-value-button"
     }, args, {
       ref: ref,
@@ -22167,6 +22167,163 @@
     }, title) : title, action), children)));
   };
 
+  var StyledSortWrapper = styled__default["default"].div.withConfig({
+    displayName: "Styles__StyledSortWrapper",
+    componentId: "sc-11r5ac9-0"
+  })(["", ";"], {
+    "width": "fit-content"
+  });
+  StyledSortWrapper.displayName = "StyledSortWrapper";
+  var StyledValueButton = styled__default["default"](ValueButton).withConfig({
+    displayName: "Styles__StyledValueButton",
+    componentId: "sc-11r5ac9-1"
+  })(["", ";"], {
+    "display": "none",
+    "alignItems": "center",
+    "@media (min-width: 768px)": {
+      "display": "flex"
+    }
+  });
+  StyledValueButton.displayName = "StyledValueButton";
+  var StyledIconButton = styled__default["default"](IconButton).withConfig({
+    displayName: "Styles__StyledIconButton",
+    componentId: "sc-11r5ac9-2"
+  })(["", ";"], {
+    "display": "flex",
+    "alignItems": "center",
+    ":hover": {
+      "color": "var(--color-primary)"
+    },
+    "@media (min-width: 768px)": {
+      "display": "none"
+    }
+  });
+  StyledIconButton.displayName = "StyledIconButton";
+  var StyledSortIcon = styled__default["default"](SortGeneralIcon$1).withConfig({
+    displayName: "Styles__StyledSortIcon",
+    componentId: "sc-11r5ac9-3"
+  })(["", ";"], {
+    "marginTop": "0px"
+  });
+  StyledSortIcon.displayName = "StyledSortIcon";
+  var StyledSortIconDown = styled__default["default"](ArrowDownLongIcon$1).withConfig({
+    displayName: "Styles__StyledSortIconDown",
+    componentId: "sc-11r5ac9-4"
+  })(["", ";"], {
+    "flexShrink": "0"
+  });
+  StyledSortIconDown.displayName = "StyledSortIconDown";
+  var StyledSortIconUp = styled__default["default"](ArrowUpLongIcon$1).withConfig({
+    displayName: "Styles__StyledSortIconUp",
+    componentId: "sc-11r5ac9-5"
+  })(["", ";"], {
+    "flexShrink": "0"
+  });
+  StyledSortIconUp.displayName = "StyledSortIconUp";
+  var StyledList = styled__default["default"](List).withConfig({
+    displayName: "Styles__StyledList",
+    componentId: "sc-11r5ac9-6"
+  })(["", ";"], {
+    "paddingTop": "0.5rem",
+    "paddingBottom": "0.5rem"
+  });
+  StyledList.displayName = "StyledList";
+  var StyledListItem = styled__default["default"](ListItem).withConfig({
+    displayName: "Styles__StyledListItem",
+    componentId: "sc-11r5ac9-7"
+  })(["", ";svg{visibility:hidden;}&:hover svg{fill:var(--color-theme-500);visibility:visible;}", ""], {
+    "justifyContent": "space-between"
+  }, function (props) {
+    return props.$active && styled.css(["", ";svg{fill:var(--color-primary);visibility:visible;}&:hover svg{fill:var(--color-primary);visibility:visible;}"], {
+      "color": "var(--color-primary)"
+    });
+  });
+  StyledListItem.displayName = "StyledListItem";
+  var StyledListItemName = styled__default["default"].span.withConfig({
+    displayName: "Styles__StyledListItemName",
+    componentId: "sc-11r5ac9-8"
+  })(["", ";"], {
+    "overflow": "hidden",
+    "textOverflow": "ellipsis",
+    "whiteSpace": "nowrap"
+  });
+  StyledListItemName.displayName = "StyledListItemName";
+
+  var Sort = function Sort(_ref) {
+    var label = _ref.label,
+      icon = _ref.icon,
+      options = _ref.options,
+      selected = _ref.selected,
+      onChange = _ref.onChange,
+      target = _ref.target,
+      className = _ref.className;
+    var _useState = React.useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      open = _useState2[0],
+      setOpen = _useState2[1];
+    var handleClose = React.useCallback(function () {
+      return setOpen(false);
+    }, []);
+    var handleOpen = React.useCallback(function () {
+      return setOpen(true);
+    }, []);
+    var handleOnChange = React.useCallback(function (event) {
+      var nextSortBy = event.currentTarget.dataset.id;
+      var nextOrder = selected.sortDirection === "desc" ? "asc" : "desc";
+      if (nextSortBy !== selected.sortBy) {
+        var _options$find;
+        nextOrder = ((_options$find = options.find(function (opt) {
+          return opt.id === nextSortBy;
+        })) === null || _options$find === void 0 ? void 0 : _options$find.defaultDirection) || "asc";
+      }
+      onChange({
+        sortBy: nextSortBy,
+        sortDirection: nextOrder
+      });
+    }, [onChange, selected, options]);
+    var labelText = React.useMemo(function () {
+      var _options$find$name, _options$find2;
+      return (_options$find$name = (_options$find2 = options.find(function (opt) {
+        return opt.id === selected.sortBy;
+      })) === null || _options$find2 === void 0 ? void 0 : _options$find2.name) !== null && _options$find$name !== void 0 ? _options$find$name : "";
+    }, [selected.sortBy, options]);
+    if (!labelText) {
+      console.warn("Cannot find selected id in options.");
+    }
+    return /*#__PURE__*/React__default["default"].createElement(Menu, {
+      onOpen: handleOpen,
+      onClose: handleClose,
+      position: "bottom-end",
+      target: target || /*#__PURE__*/React__default["default"].createElement(StyledSortWrapper, {
+        className: className
+      }, /*#__PURE__*/React__default["default"].createElement(StyledValueButton, {
+        active: open,
+        value: labelText,
+        label: label,
+        "data-testid": "sort-button"
+      }), /*#__PURE__*/React__default["default"].createElement(StyledIconButton, {
+        active: open,
+        variant: "text gray",
+        "data-testid": "sort-icon-button"
+      }, icon || /*#__PURE__*/React__default["default"].createElement(StyledSortIcon, null)))
+    }, /*#__PURE__*/React__default["default"].createElement(StyledList, null, options.map(function (_ref2) {
+      var id = _ref2.id,
+        name = _ref2.name,
+        defaultDirection = _ref2.defaultDirection;
+      var showDownArrow = selected.sortDirection === "asc";
+      if (selected.sortBy !== id) {
+        showDownArrow = defaultDirection === "asc";
+      }
+      return /*#__PURE__*/React__default["default"].createElement(StyledListItem, {
+        key: id,
+        onClick: handleOnChange,
+        "data-id": id,
+        "data-testid": id,
+        $active: id === selected.sortBy
+      }, /*#__PURE__*/React__default["default"].createElement(StyledListItemName, null, name), showDownArrow ? /*#__PURE__*/React__default["default"].createElement(StyledSortIconDown, null) : /*#__PURE__*/React__default["default"].createElement(StyledSortIconUp, null));
+    })));
+  };
+
   exports.AccessLogIcon = AccessLogIcon$1;
   exports.Accordion = Accordion;
   exports.AccordionContext = AccordionContext;
@@ -22462,6 +22619,7 @@
   exports.SlideFromTop = SlideFromTop;
   exports.SlideLeftRightTransition = SlideLeftRightTransition;
   exports.SmileIcon = SmileIcon$1;
+  exports.Sort = Sort;
   exports.SortDirection = SortDirection;
   exports.SortGeneralIcon = SortGeneralIcon$1;
   exports.SortIcon = SortIcon$1;