@vuu-ui/vuu-table-extras 0.11.3 → 0.12.0

package/cjs/column-list/ColumnList.js

@@ -1,13 +1,13 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
 var core = require('@salt-ds/core');
-var cx = require('clsx');
 var styles = require('@salt-ds/styles');
 var window = require('@salt-ds/window');
-var react = require('react');
+var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
 var vuuUtils = require('@vuu-ui/vuu-utils');
+var cx = require('clsx');
+var react = require('react');
 var ColumnList$1 = require('./ColumnList.css.js');
 
 const classBase = "vuuColumnList";

package/cjs/column-list/ColumnList.js.map

@@ -1 +1 @@
-{"version":3,"file":"ColumnList.js","sources":["../../src/column-list/ColumnList.tsx"],"sourcesContent":["import { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport {\n  Icon,\n  List,\n  ListItem,\n  ListItemProps,\n  ListProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { Checkbox, Switch } from \"@salt-ds/core\";\nimport cx from \"clsx\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport {\n  HTMLAttributes,\n  MouseEventHandler,\n  SyntheticEvent,\n  useCallback,\n} from \"react\";\nimport { ColumnItem } from \"../table-settings\";\nimport { getColumnLabel, queryClosest } from \"@vuu-ui/vuu-utils\";\n\nimport columnList from \"./ColumnList.css\";\n\nconst classBase = \"vuuColumnList\";\nconst classBaseListItem = \"vuuColumnListItem\";\n\nexport type ColumnChangeHandler = (\n  columnName: string,\n  propertyName: keyof ColumnDescriptor | \"subscribed\",\n  value: string | number | boolean,\n) => void;\n\nexport interface ColumnListProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  columnItems: ColumnItem[];\n  onChange: ColumnChangeHandler;\n  onMoveListItem: ListProps[\"onMoveListItem\"];\n  onNavigateToColumn?: (columnName: string) => void;\n}\n\nconst ColumnListItem = ({\n  className: classNameProp,\n  item,\n  ...listItemProps\n}: ListItemProps<ColumnItem>) => {\n  return (\n    <ListItem\n      {...listItemProps}\n      className={cx(classNameProp, classBaseListItem)}\n      data-name={item?.name}\n    >\n      <Icon name=\"draggable\" size={16} />\n      {item?.isCalculated ? (\n        <Icon name=\"function\" />\n      ) : (\n        <Checkbox\n          className={`${classBase}-checkBox`}\n          checked={item?.subscribed}\n        />\n      )}\n      <span className={`${classBase}-text`}>\n        {getColumnLabel(item as ColumnDescriptor)}\n      </span>\n      <Switch\n        className={`${classBase}-switch`}\n        checked={item?.hidden !== true}\n        disabled={item?.subscribed !== true}\n      />\n    </ListItem>\n  );\n};\n\nexport const ColumnList = ({\n  className,\n  columnItems,\n  onChange,\n  onMoveListItem,\n  onNavigateToColumn,\n  ...htmlAttributes\n}: ColumnListProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-column-list\",\n    css: columnList,\n    window: targetWindow,\n  });\n\n  const handleChange = useCallback(\n    ({ target }: SyntheticEvent) => {\n      const input = target as HTMLInputElement;\n      const listItem = queryClosest(target, `.${classBaseListItem}`);\n      if (listItem) {\n        const {\n          dataset: { name },\n        } = listItem;\n        if (name) {\n          const saltCheckbox = queryClosest(target, `.${classBase}-checkBox`);\n          const saltSwitch = queryClosest(target, `.${classBase}-switch`);\n\n          if (saltCheckbox) {\n            onChange(name, \"subscribed\", input.checked);\n          } else if (saltSwitch) {\n            onChange(name, \"hidden\", input.checked === false);\n          }\n        }\n      }\n    },\n    [onChange],\n  );\n\n  const handleClick = useCallback<MouseEventHandler>(\n    (evt) => {\n      const targetEl = evt.target as HTMLElement;\n      if (targetEl.classList.contains(\"vuuColumnList-text\")) {\n        const listItemEl = targetEl.closest(\".vuuListItem\") as HTMLElement;\n        if (listItemEl?.dataset.name) {\n          onNavigateToColumn?.(listItemEl.dataset.name);\n        }\n      }\n    },\n    [onNavigateToColumn],\n  );\n\n  return (\n    <div\n      {...htmlAttributes}\n      className={cx(classBase, className, {\n        [`${classBase}-withColumnNavigation`]:\n          typeof onNavigateToColumn === \"function\",\n      })}\n    >\n      <div className={`${classBase}-header`}>\n        <span>Column Selection</span>\n      </div>\n      <div className={`${classBase}-colHeadings`}>\n        <span>Column subscription</span>\n        <span>Visibility</span>\n      </div>\n      <List<ColumnItem, \"none\">\n        ListItem={ColumnListItem}\n        allowDragDrop\n        height=\"auto\"\n        onChange={handleChange}\n        onClick={handleClick}\n        onMoveListItem={onMoveListItem}\n        selectionStrategy=\"none\"\n        source={columnItems}\n        itemHeight={33}\n      />\n    </div>\n  );\n};\n"],"names":["jsxs","ListItem","jsx","Icon","Checkbox","getColumnLabel","Switch","useWindow","useComponentCssInjection","columnList","useCallback","queryClosest","List"],"mappings":"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"}
+{"version":3,"file":"ColumnList.js","sources":["../../src/column-list/ColumnList.tsx"],"sourcesContent":["import { Checkbox, Switch } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport {\n  Icon,\n  List,\n  ListItem,\n  ListItemProps,\n  ListProps,\n} from \"@vuu-ui/vuu-ui-controls\";\nimport { getColumnLabel, queryClosest } from \"@vuu-ui/vuu-utils\";\nimport cx from \"clsx\";\nimport {\n  HTMLAttributes,\n  MouseEventHandler,\n  SyntheticEvent,\n  useCallback,\n} from \"react\";\nimport { ColumnItem } from \"../table-settings\";\n\nimport columnList from \"./ColumnList.css\";\n\nconst classBase = \"vuuColumnList\";\nconst classBaseListItem = \"vuuColumnListItem\";\n\nexport type ColumnChangeHandler = (\n  columnName: string,\n  propertyName: keyof ColumnDescriptor | \"subscribed\",\n  value: string | number | boolean,\n) => void;\n\nexport interface ColumnListProps\n  extends Omit<HTMLAttributes<HTMLDivElement>, \"onChange\"> {\n  columnItems: ColumnItem[];\n  onChange: ColumnChangeHandler;\n  onMoveListItem: ListProps[\"onMoveListItem\"];\n  onNavigateToColumn?: (columnName: string) => void;\n}\n\nconst ColumnListItem = ({\n  className: classNameProp,\n  item,\n  ...listItemProps\n}: ListItemProps<ColumnItem>) => {\n  return (\n    <ListItem\n      {...listItemProps}\n      className={cx(classNameProp, classBaseListItem)}\n      data-name={item?.name}\n    >\n      <Icon name=\"draggable\" size={16} />\n      {item?.isCalculated ? (\n        <Icon name=\"function\" />\n      ) : (\n        <Checkbox\n          className={`${classBase}-checkBox`}\n          checked={item?.subscribed}\n        />\n      )}\n      <span className={`${classBase}-text`}>\n        {getColumnLabel(item as ColumnDescriptor)}\n      </span>\n      <Switch\n        className={`${classBase}-switch`}\n        checked={item?.hidden !== true}\n        disabled={item?.subscribed !== true}\n      />\n    </ListItem>\n  );\n};\n\nexport const ColumnList = ({\n  className,\n  columnItems,\n  onChange,\n  onMoveListItem,\n  onNavigateToColumn,\n  ...htmlAttributes\n}: ColumnListProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-column-list\",\n    css: columnList,\n    window: targetWindow,\n  });\n\n  const handleChange = useCallback(\n    ({ target }: SyntheticEvent) => {\n      const input = target as HTMLInputElement;\n      const listItem = queryClosest(target, `.${classBaseListItem}`);\n      if (listItem) {\n        const {\n          dataset: { name },\n        } = listItem;\n        if (name) {\n          const saltCheckbox = queryClosest(target, `.${classBase}-checkBox`);\n          const saltSwitch = queryClosest(target, `.${classBase}-switch`);\n\n          if (saltCheckbox) {\n            onChange(name, \"subscribed\", input.checked);\n          } else if (saltSwitch) {\n            onChange(name, \"hidden\", input.checked === false);\n          }\n        }\n      }\n    },\n    [onChange],\n  );\n\n  const handleClick = useCallback<MouseEventHandler>(\n    (evt) => {\n      const targetEl = evt.target as HTMLElement;\n      if (targetEl.classList.contains(\"vuuColumnList-text\")) {\n        const listItemEl = targetEl.closest(\".vuuListItem\") as HTMLElement;\n        if (listItemEl?.dataset.name) {\n          onNavigateToColumn?.(listItemEl.dataset.name);\n        }\n      }\n    },\n    [onNavigateToColumn],\n  );\n\n  return (\n    <div\n      {...htmlAttributes}\n      className={cx(classBase, className, {\n        [`${classBase}-withColumnNavigation`]:\n          typeof onNavigateToColumn === \"function\",\n      })}\n    >\n      <div className={`${classBase}-header`}>\n        <span>Column Selection</span>\n      </div>\n      <div className={`${classBase}-colHeadings`}>\n        <span>Column subscription</span>\n        <span>Visibility</span>\n      </div>\n      <List<ColumnItem, \"none\">\n        ListItem={ColumnListItem}\n        allowDragDrop\n        height=\"auto\"\n        onChange={handleChange}\n        onClick={handleClick}\n        onMoveListItem={onMoveListItem}\n        selectionStrategy=\"none\"\n        source={columnItems}\n        itemHeight={33}\n      />\n    </div>\n  );\n};\n"],"names":["jsxs","ListItem","jsx","Icon","Checkbox","getColumnLabel","Switch","useWindow","useComponentCssInjection","columnList","useCallback","queryClosest","List"],"mappings":"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"}

package/cjs/column-menu/ColumnMenu.css.js

@@ -0,0 +1,6 @@
+'use strict';
+
+var columnMenuCss = ".vuuMenuItem {\n  --vuu-svg-cog: url('data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\"><path d=\"M12.9533 8.65331C12.98 8.43998 13 8.22665 13 7.99998C13 7.77331 12.98 7.55998 12.9533 7.34665L14.36 6.24665C14.4867 6.14665 14.52 5.96665 14.44 5.81998L13.1067 3.51331C13.0267 3.36665 12.8467 3.31331 12.7 3.36665L11.04 4.03331C10.6933 3.76665 10.32 3.54665 9.91333 3.37998L9.66 1.61331C9.64 1.45331 9.5 1.33331 9.33333 1.33331H6.66667C6.5 1.33331 6.36 1.45331 6.34 1.61331L6.08667 3.37998C5.68 3.54665 5.30667 3.77331 4.96 4.03331L3.3 3.36665C3.14667 3.30665 2.97333 3.36665 2.89333 3.51331L1.56 5.81998C1.47333 5.96665 1.51333 6.14665 1.64 6.24665L3.04667 7.34665C3.02 7.55998 3 7.77998 3 7.99998C3 8.21998 3.02 8.43998 3.04667 8.65331L1.64 9.75331C1.51333 9.85331 1.48 10.0333 1.56 10.18L2.89333 12.4866C2.97333 12.6333 3.15333 12.6866 3.3 12.6333L4.96 11.9666C5.30667 12.2333 5.68 12.4533 6.08667 12.62L6.34 14.3866C6.36 14.5466 6.5 14.6666 6.66667 14.6666H9.33333C9.5 14.6666 9.64 14.5466 9.66 14.3866L9.91333 12.62C10.32 12.4533 10.6933 12.2266 11.04 11.9666L12.7 12.6333C12.8533 12.6933 13.0267 12.6333 13.1067 12.4866L14.44 10.18C14.52 10.0333 14.4867 9.85331 14.36 9.75331L12.9533 8.65331V8.65331ZM8 10.3333C6.71333 10.3333 5.66667 9.28665 5.66667 7.99998C5.66667 6.71331 6.71333 5.66665 8 5.66665C9.28667 5.66665 10.3333 6.71331 10.3333 7.99998C10.3333 9.28665 9.28667 10.3333 8 10.3333Z\"/></svg>');\n}\n.vuuColumnMenu {\n  --menu-button-size: calc(var(--salt-size-base) - var(--salt-spacing-100));\n  --saltButton-padding: var(--salt-spacing-50);\n  --saltButton-minWidth: var(--menu-button-size);\n  --saltButton-height: var(--menu-button-size);\n  --saltButton-width: var(--menu-button-size);\n\n  --vuu-icon-height: var(--menu-button-size);\n  --vuu-icon-left: 0px;\n  --vuu-icon-top: 0px;\n  --vuu-icon-width: var(--menu-button-size);\n\n  border: none;\n  border-radius: 4px;\n  flex: 0 0 var(--menu-button-size);\n  margin: var(--vuuTable-columnMenu-margin, 0);\n  padding: 0;\n}\n";
+
+module.exports = columnMenuCss;
+//# sourceMappingURL=ColumnMenu.css.js.map

package/cjs/column-menu/ColumnMenu.css.js.map

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

package/cjs/column-menu/ColumnMenu.js

@@ -0,0 +1,83 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var styles = require('@salt-ds/styles');
+var window = require('@salt-ds/window');
+var vuuUiControls = require('@vuu-ui/vuu-ui-controls');
+var TableProvider = require('../table-provider/TableProvider.js');
+var cx = require('clsx');
+var react = require('react');
+var ColumnMenu$1 = require('./ColumnMenu.css.js');
+var columnMenuUtils = require('./column-menu-utils.js');
+
+const classBase = "vuuColumnMenu";
+const ColumnMenu = ({
+  className,
+  column,
+  menuActionHandler: menuActionHandlerProp
+}) => {
+  const targetWindow = window.useWindow();
+  styles.useComponentCssInjection({
+    testId: "vuu-column-menu",
+    css: ColumnMenu$1,
+    window: targetWindow
+  });
+  const { dataSource, menuActionHandler } = TableProvider.useTableContext(true);
+  const menuActionClickHandler = react.useCallback(
+    (evt) => {
+      const columnMenuActionType = columnMenuUtils.getColumnMenuActionType(evt.target);
+      if (menuActionHandlerProp?.(columnMenuActionType, column) !== true) {
+        return menuActionHandler(columnMenuActionType, column);
+      }
+    },
+    [column, menuActionHandler, menuActionHandlerProp]
+  );
+  const sortMenu = columnMenuUtils.buildSortMenu(column, dataSource, menuActionClickHandler);
+  const groupMenu = columnMenuUtils.buildGroupMenu(column, dataSource, menuActionClickHandler);
+  const aggregationMenu = columnMenuUtils.buildAggregationMenuItems(
+    column,
+    dataSource,
+    menuActionClickHandler
+  );
+  const visibilityMenuItems = columnMenuUtils.buildVisibilityMenuItems(
+    column,
+    menuActionClickHandler
+  );
+  const pinMenu = columnMenuUtils.buildPinMenuItems(column, menuActionClickHandler);
+  const settingsMenuItems = columnMenuUtils.buildSettingsMenuItems(
+    column,
+    menuActionClickHandler
+  );
+  const handleClick = react.useCallback(
+    (evt) => {
+      evt.stopPropagation();
+    },
+    []
+  );
+  return /* @__PURE__ */ jsxRuntime.jsxs(core.Menu, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(core.MenuTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(
+      vuuUiControls.IconButton,
+      {
+        appearance: "transparent",
+        className: cx(classBase, className),
+        "data-embedded": true,
+        icon: "more-vert",
+        sentiment: "neutral",
+        "aria-label": "Open Column Menu",
+        onClick: handleClick
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsxs(core.MenuPanel, { children: [
+      sortMenu,
+      groupMenu,
+      aggregationMenu,
+      visibilityMenuItems,
+      pinMenu,
+      settingsMenuItems
+    ] })
+  ] });
+};
+
+exports.ColumnMenu = ColumnMenu;
+//# sourceMappingURL=ColumnMenu.js.map

package/cjs/column-menu/ColumnMenu.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ColumnMenu.js","sources":["../../src/column-menu/ColumnMenu.tsx"],"sourcesContent":["import { Menu, MenuPanel, MenuTrigger } from \"@salt-ds/core\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { ColumnDescriptor } from \"@vuu-ui/vuu-table-types\";\nimport { IconButton } from \"@vuu-ui/vuu-ui-controls\";\nimport { useTableContext } from \"../table-provider/TableProvider\";\nimport cx from \"clsx\";\nimport { HTMLAttributes, MouseEventHandler, useCallback } from \"react\";\n\nimport columnMenuCss from \"./ColumnMenu.css\";\nimport {\n  buildAggregationMenuItems,\n  buildPinMenuItems,\n  buildGroupMenu,\n  buildSortMenu,\n  buildVisibilityMenuItems,\n  ColumnMenuActionType,\n  getColumnMenuActionType,\n  type MenuItemClickHandler,\n  buildSettingsMenuItems,\n} from \"./column-menu-utils\";\nimport { MenuActionHandler } from \"@vuu-ui/vuu-context-menu\";\n\nconst classBase = \"vuuColumnMenu\";\n\nexport interface ColumnMenuProps extends HTMLAttributes<HTMLSpanElement> {\n  column: ColumnDescriptor;\n  menuActionHandler?: MenuActionHandler<ColumnMenuActionType, ColumnDescriptor>;\n}\n\nexport const ColumnMenu = ({\n  className,\n  column,\n  menuActionHandler: menuActionHandlerProp,\n}: ColumnMenuProps) => {\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"vuu-column-menu\",\n    css: columnMenuCss,\n    window: targetWindow,\n  });\n\n  const { dataSource, menuActionHandler } = useTableContext(true);\n\n  const menuActionClickHandler = useCallback<MenuItemClickHandler>(\n    (evt) => {\n      const columnMenuActionType = getColumnMenuActionType(evt.target);\n      if (menuActionHandlerProp?.(columnMenuActionType, column) !== true) {\n        return menuActionHandler(columnMenuActionType, column);\n      }\n    },\n    [column, menuActionHandler, menuActionHandlerProp],\n  );\n\n  const sortMenu = buildSortMenu(column, dataSource, menuActionClickHandler);\n  const groupMenu = buildGroupMenu(column, dataSource, menuActionClickHandler);\n  const aggregationMenu = buildAggregationMenuItems(\n    column,\n    dataSource,\n    menuActionClickHandler,\n  );\n  const visibilityMenuItems = buildVisibilityMenuItems(\n    column,\n    menuActionClickHandler,\n  );\n  const pinMenu = buildPinMenuItems(column, menuActionClickHandler);\n  const settingsMenuItems = buildSettingsMenuItems(\n    column,\n    menuActionClickHandler,\n  );\n\n  const handleClick = useCallback<MouseEventHandler<HTMLButtonElement>>(\n    (evt) => {\n      // Prevent sort from triggering if the click were to bubble.\n      evt.stopPropagation();\n    },\n    [],\n  );\n\n  return (\n    <Menu>\n      <MenuTrigger>\n        <IconButton\n          appearance=\"transparent\"\n          className={cx(classBase, className)}\n          data-embedded\n          icon=\"more-vert\"\n          sentiment=\"neutral\"\n          aria-label=\"Open Column Menu\"\n          onClick={handleClick}\n        />\n      </MenuTrigger>\n      <MenuPanel>\n        {sortMenu}\n        {groupMenu}\n        {aggregationMenu}\n        {visibilityMenuItems}\n        {pinMenu}\n        {settingsMenuItems}\n      </MenuPanel>\n    </Menu>\n  );\n};\n"],"names":["useWindow","useComponentCssInjection","columnMenuCss","useTableContext","useCallback","getColumnMenuActionType","buildSortMenu","buildGroupMenu","buildAggregationMenuItems","buildVisibilityMenuItems","buildPinMenuItems","buildSettingsMenuItems","Menu","jsx","MenuTrigger","IconButton","MenuPanel"],"mappings":";;;;;;;;;;;;;AAuBA,MAAM,SAAY,GAAA,eAAA;AAOX,MAAM,aAAa,CAAC;AAAA,EACzB,SAAA;AAAA,EACA,MAAA;AAAA,EACA,iBAAmB,EAAA;AACrB,CAAuB,KAAA;AACrB,EAAA,MAAM,eAAeA,gBAAU,EAAA;AAC/B,EAAyBC,+BAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,iBAAA;AAAA,IACR,GAAK,EAAAC,YAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,EAAE,UAAA,EAAY,iBAAkB,EAAA,GAAIC,8BAAgB,IAAI,CAAA;AAE9D,EAAA,MAAM,sBAAyB,GAAAC,iBAAA;AAAA,IAC7B,CAAC,GAAQ,KAAA;AACP,MAAM,MAAA,oBAAA,GAAuBC,uCAAwB,CAAA,GAAA,CAAI,MAAM,CAAA;AAC/D,MAAA,IAAI,qBAAwB,GAAA,oBAAA,EAAsB,MAAM,CAAA,KAAM,IAAM,EAAA;AAClE,QAAO,OAAA,iBAAA,CAAkB,sBAAsB,MAAM,CAAA;AAAA;AACvD,KACF;AAAA,IACA,CAAC,MAAQ,EAAA,iBAAA,EAAmB,qBAAqB;AAAA,GACnD;AAEA,EAAA,MAAM,QAAW,GAAAC,6BAAA,CAAc,MAAQ,EAAA,UAAA,EAAY,sBAAsB,CAAA;AACzE,EAAA,MAAM,SAAY,GAAAC,8BAAA,CAAe,MAAQ,EAAA,UAAA,EAAY,sBAAsB,CAAA;AAC3E,EAAA,MAAM,eAAkB,GAAAC,yCAAA;AAAA,IACtB,MAAA;AAAA,IACA,UAAA;AAAA,IACA;AAAA,GACF;AACA,EAAA,MAAM,mBAAsB,GAAAC,wCAAA;AAAA,IAC1B,MAAA;AAAA,IACA;AAAA,GACF;AACA,EAAM,MAAA,OAAA,GAAUC,iCAAkB,CAAA,MAAA,EAAQ,sBAAsB,CAAA;AAChE,EAAA,MAAM,iBAAoB,GAAAC,sCAAA;AAAA,IACxB,MAAA;AAAA,IACA;AAAA,GACF;AAEA,EAAA,MAAM,WAAc,GAAAP,iBAAA;AAAA,IAClB,CAAC,GAAQ,KAAA;AAEP,MAAA,GAAA,CAAI,eAAgB,EAAA;AAAA,KACtB;AAAA,IACA;AAAC,GACH;AAEA,EAAA,uCACGQ,SACC,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAAC,cAAA,CAACC,gBACC,EAAA,EAAA,QAAA,kBAAAD,cAAA;AAAA,MAACE,wBAAA;AAAA,MAAA;AAAA,QACC,UAAW,EAAA,aAAA;AAAA,QACX,SAAA,EAAW,EAAG,CAAA,SAAA,EAAW,SAAS,CAAA;AAAA,QAClC,eAAa,EAAA,IAAA;AAAA,QACb,IAAK,EAAA,WAAA;AAAA,QACL,SAAU,EAAA,SAAA;AAAA,QACV,YAAW,EAAA,kBAAA;AAAA,QACX,OAAS,EAAA;AAAA;AAAA,KAEb,EAAA,CAAA;AAAA,oCACCC,cACE,EAAA,EAAA,QAAA,EAAA;AAAA,MAAA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,eAAA;AAAA,MACA,mBAAA;AAAA,MACA,OAAA;AAAA,MACA;AAAA,KACH,EAAA;AAAA,GACF,EAAA,CAAA;AAEJ;;;;"}

package/cjs/column-menu/column-menu-utils.js

@@ -0,0 +1,479 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var core = require('@salt-ds/core');
+var vuuUtils = require('@vuu-ui/vuu-utils');
+
+const isColumnMenuActionType = (value) => value !== void 0 && [
+  "agg-count",
+  "agg-distinct",
+  "agg-sum",
+  "agg-avg",
+  "agg-high",
+  "agg-low",
+  "sort-asc",
+  "sort-dsc",
+  "sort-add-asc",
+  "sort-add-dsc",
+  "remove-sort",
+  "group-column",
+  "remove-group",
+  "add-to-group",
+  "remove-from-group",
+  "pin-column-left",
+  "pin-column-right",
+  "pin-column-floating",
+  "unpin-column",
+  "hide-column",
+  "remove-column",
+  "column-settings",
+  "table-settings"
+].includes(value);
+const getColumnMenuActionType = (target) => {
+  const { menuActionId } = target.dataset;
+  if (isColumnMenuActionType(menuActionId)) {
+    return menuActionId;
+  } else {
+    throw Error(
+      "[vuu-table-extras] column-menu-utils target element is not a valid Column MenuItem"
+    );
+  }
+};
+function buildSortMenu(column, dataSource, menuActionClickHandler) {
+  if (column.sortable === false) {
+    return null;
+  } else {
+    const { name, label = name } = column;
+    const menuItems = [];
+    const columnSortStatus = vuuUtils.getSortStatus(column.name, dataSource.sort);
+    switch (columnSortStatus) {
+      case "no-sort":
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "sort-asc",
+              onClick: menuActionClickHandler,
+              children: "Sort ascending"
+            },
+            "sort-asc"
+          )
+        );
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "sort-dsc",
+              onClick: menuActionClickHandler,
+              children: "Sort descending"
+            },
+            "sort-dsc"
+          )
+        );
+        break;
+      case "single-sort-asc":
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "sort-dsc",
+              onClick: menuActionClickHandler,
+              children: "Reverse Sort (DSC)"
+            },
+            "sort-dsc"
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "remove-sort",
+              onClick: menuActionClickHandler,
+              children: "Remove Sort"
+            },
+            "remove-sort"
+          )
+        );
+        break;
+      case "single-sort-desc":
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "sort-asc",
+              onClick: menuActionClickHandler,
+              children: "Reverse Sort (ASC)"
+            },
+            "sort-asc"
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "remove-sort",
+              onClick: menuActionClickHandler,
+              children: "Remove Sort"
+            },
+            "remove-sort"
+          )
+        );
+        break;
+      case "sort-other-column":
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "sort-add-asc",
+              onClick: menuActionClickHandler,
+              children: "Add to sort ASC"
+            },
+            "sort-add-asc"
+          )
+        );
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "sort-add-dsc",
+              onClick: menuActionClickHandler,
+              children: "Add to sort DSC"
+            },
+            "sort-add-dsc"
+          )
+        );
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "sort-asc",
+              onClick: menuActionClickHandler,
+              children: "Ascending"
+            },
+            "sort-asc"
+          )
+        );
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "sort-dsc",
+              onClick: menuActionClickHandler,
+              children: "Descending"
+            },
+            "sort-dsc"
+          )
+        );
+        break;
+      case "multi-sort-includes-column-asc":
+      case "multi-sort-includes-column-desc":
+        break;
+      default:
+        vuuUtils.logUnhandledMessage(
+          columnSortStatus,
+          "[vuu-table-extras] column-menu-utils buildSortMenu"
+        );
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(core.Menu, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(core.MenuTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(core.MenuItem, { children: `Sort by ${label}` }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(core.MenuPanel, { children: menuItems })
+    ] }, "sort-menu");
+  }
+}
+function buildGroupMenu(column, dataSource, menuActionClickHandler) {
+  if (column.groupable === false) {
+    return null;
+  } else {
+    const menuItems = [];
+    const columnGroupStatus = vuuUtils.getGroupStatus(column.name, dataSource.groupBy);
+    const { name, label = name } = column;
+    switch (columnGroupStatus) {
+      case "no-groupby":
+      case "single-groupby-other-column":
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "group-column",
+              onClick: menuActionClickHandler,
+              children: `Group by ${label}`
+            },
+            "group-column"
+          )
+        );
+        break;
+      case "single-groupby":
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "remove-group",
+              onClick: menuActionClickHandler,
+              children: "Remove Grouping"
+            },
+            "remove-group"
+          )
+        );
+        break;
+      case "multi-groupby-other-columns":
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "add-to-group",
+              onClick: menuActionClickHandler,
+              children: "Add to grouping"
+            },
+            "add-to-group"
+          )
+        );
+        break;
+      case "multi-groupby-includes-column":
+        menuItems.push(
+          /* @__PURE__ */ jsxRuntime.jsx(
+            core.MenuItem,
+            {
+              "data-menu-action-id": "remove-from-group",
+              onClick: menuActionClickHandler,
+              children: "Remove from grouping"
+            },
+            "remove-from-group"
+          )
+        );
+        break;
+      default:
+        vuuUtils.logUnhandledMessage(
+          columnGroupStatus,
+          "[vuu-table-extras] column-menu-utils buildGroupMenu"
+        );
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs(core.Menu, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(core.MenuTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(core.MenuItem, { children: "Group data" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx(core.MenuPanel, { children: menuItems })
+    ] }, "group-menu");
+  }
+}
+const buildVisibilityMenuItems = (column, menuActionClickHandler) => {
+  const menuItems = [];
+  const { name, label = name } = column;
+  menuItems.push(
+    /* @__PURE__ */ jsxRuntime.jsx(
+      core.MenuItem,
+      {
+        "data-menu-action-id": "hide-column",
+        onClick: menuActionClickHandler,
+        children: `Hide ${label} column`
+      },
+      "hide-column"
+    )
+  );
+  menuItems.push(
+    /* @__PURE__ */ jsxRuntime.jsx(
+      core.MenuItem,
+      {
+        "data-menu-action-id": "remove-column",
+        onClick: menuActionClickHandler,
+        children: `Remove ${label} column`
+      },
+      "remove-column"
+    )
+  );
+  return menuItems;
+};
+const buildPinMenuItems = (column, menuActionClickHandler) => {
+  if (column === void 0) {
+    return [];
+  }
+  const { pin } = column;
+  const menuItems = [];
+  const pinLeft = /* @__PURE__ */ jsxRuntime.jsx(
+    core.MenuItem,
+    {
+      "data-menu-action-id": "pin-column-left",
+      onClick: menuActionClickHandler,
+      children: "Pin left"
+    },
+    "pin-column-left"
+  );
+  const pinFloating = /* @__PURE__ */ jsxRuntime.jsx(
+    core.MenuItem,
+    {
+      "data-menu-action-id": "pin-column-floating",
+      onClick: menuActionClickHandler,
+      children: "Pin floating"
+    },
+    "pin-column-floating"
+  );
+  const pinRight = /* @__PURE__ */ jsxRuntime.jsx(
+    core.MenuItem,
+    {
+      "data-menu-action-id": "pin-column-right",
+      onClick: menuActionClickHandler,
+      children: "Pin right"
+    },
+    "pin-column-right"
+  );
+  if (pin === void 0) {
+    menuItems.push(
+      /* @__PURE__ */ jsxRuntime.jsxs(core.Menu, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(core.MenuTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(core.MenuItem, { children: "Pin Column" }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs(core.MenuPanel, { children: [
+          pinLeft,
+          pinFloating,
+          pinRight
+        ] })
+      ] }, "pin-menu")
+    );
+  } else {
+    menuItems.push(
+      /* @__PURE__ */ jsxRuntime.jsx(
+        core.MenuItem,
+        {
+          "data-menu-action-id": "unpin-column",
+          onClick: menuActionClickHandler,
+          children: "Unpin"
+        },
+        "unpin-column"
+      )
+    );
+    if (pin === "left") {
+      menuItems.push(
+        /* @__PURE__ */ jsxRuntime.jsxs(core.Menu, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(core.MenuTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(core.MenuItem, { children: "Pin Column" }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(core.MenuPanel, { children: [
+            pinFloating,
+            pinRight
+          ] })
+        ] }, "pin-menu")
+      );
+    } else if (pin === "floating") {
+      menuItems.push(
+        /* @__PURE__ */ jsxRuntime.jsxs(core.Menu, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(core.MenuTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(core.MenuItem, { children: "Pin Column" }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(core.MenuPanel, { children: [
+            pinLeft,
+            pinRight
+          ] })
+        ] }, "pin-menu")
+      );
+    } else {
+      menuItems.push(
+        /* @__PURE__ */ jsxRuntime.jsxs(core.Menu, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(core.MenuTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(core.MenuItem, { children: "Pin Column" }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(core.MenuPanel, { children: [
+            pinFloating,
+            pinRight
+          ] })
+        ] }, "pin-menu")
+      );
+    }
+  }
+  return menuItems;
+};
+const buildSettingsMenuItems = (_, menuActionClickHandler) => {
+  const menuItems = [];
+  menuItems.push(
+    /* @__PURE__ */ jsxRuntime.jsx(
+      core.MenuItem,
+      {
+        "data-icon": "settings",
+        "data-menu-action-id": "column-settings",
+        onClick: menuActionClickHandler,
+        children: "Column settings ..."
+      },
+      "column-settings"
+    )
+  );
+  menuItems.push(
+    /* @__PURE__ */ jsxRuntime.jsx(
+      core.MenuItem,
+      {
+        "data-icon": "settings",
+        "data-menu-action-id": "table-settings",
+        onClick: menuActionClickHandler,
+        children: "Table settings ..."
+      },
+      "table-settings"
+    )
+  );
+  return menuItems;
+};
+function buildAggregationMenuItems(column, dataSource, menuActionClickHandler) {
+  const { name, label = name } = column;
+  if (dataSource.groupBy?.length === 0) {
+    return [];
+  } else {
+    const menuItems = [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        core.MenuItem,
+        {
+          "data-menu-action-id": "agg-count",
+          onClick: menuActionClickHandler,
+          children: "Count"
+        },
+        "agg-count"
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        core.MenuItem,
+        {
+          "data-menu-action-id": "agg-distinct",
+          onClick: menuActionClickHandler,
+          children: "Distinct"
+        },
+        "agg-distinct"
+      )
+    ];
+    if (vuuUtils.isNumericColumn(column)) {
+      menuItems.push(
+        /* @__PURE__ */ jsxRuntime.jsx(
+          core.MenuItem,
+          {
+            "data-menu-action-id": "agg-sum",
+            onClick: menuActionClickHandler,
+            children: "Sum"
+          },
+          "agg-sum"
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          core.MenuItem,
+          {
+            "data-menu-action-id": "agg-avg",
+            onClick: menuActionClickHandler,
+            children: "Average"
+          },
+          "agg-avg"
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          core.MenuItem,
+          {
+            "data-menu-action-id": "agg-high",
+            onClick: menuActionClickHandler,
+            children: "High"
+          },
+          "agg-high"
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          core.MenuItem,
+          {
+            "data-menu-action-id": "agg-low",
+            onClick: menuActionClickHandler,
+            children: "Low"
+          },
+          "agg-low"
+        )
+      );
+    }
+    return [
+      /* @__PURE__ */ jsxRuntime.jsxs(core.Menu, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(core.MenuTrigger, { children: /* @__PURE__ */ jsxRuntime.jsx(core.MenuItem, { children: `Aggregate ${label}` }) }),
+        /* @__PURE__ */ jsxRuntime.jsx(core.MenuPanel, { children: menuItems })
+      ] }, "aggregate-menu")
+    ];
+  }
+}
+
+exports.buildAggregationMenuItems = buildAggregationMenuItems;
+exports.buildGroupMenu = buildGroupMenu;
+exports.buildPinMenuItems = buildPinMenuItems;
+exports.buildSettingsMenuItems = buildSettingsMenuItems;
+exports.buildSortMenu = buildSortMenu;
+exports.buildVisibilityMenuItems = buildVisibilityMenuItems;
+exports.getColumnMenuActionType = getColumnMenuActionType;
+exports.isColumnMenuActionType = isColumnMenuActionType;
+//# sourceMappingURL=column-menu-utils.js.map