@activecollab/components 2.0.195 → 2.0.196

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,
@@ -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;