@economic/taco 2.27.3 → 2.28.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/dist/components/Calendar/Calendar.d.ts +4 -9
  2. package/dist/components/Checkbox/Checkbox.d.ts +2 -2
  3. package/dist/components/Icon/components/LinkExternal.d.ts +3 -0
  4. package/dist/components/Icon/components/index.d.ts +1 -1
  5. package/dist/components/Input/Input.d.ts +1 -1
  6. package/dist/components/List/List.d.ts +28 -0
  7. package/dist/components/List/components/Button.d.ts +8 -0
  8. package/dist/components/List/components/Collapsible.d.ts +10 -0
  9. package/dist/components/List/components/Group.d.ts +7 -0
  10. package/dist/components/List/components/Item.d.ts +22 -0
  11. package/dist/components/List/components/Link.d.ts +8 -0
  12. package/dist/components/List/components/Toggle.d.ts +8 -0
  13. package/dist/components/Menu/components/Item.d.ts +1 -1
  14. package/dist/components/Menu/components/Link.d.ts +1 -1
  15. package/dist/components/Navigation2/components/Link.d.ts +1 -1
  16. package/dist/components/Select2/components/Option.d.ts +2 -2
  17. package/dist/components/Select2/components/Search.d.ts +1 -1
  18. package/dist/components/Switch/Switch.d.ts +2 -2
  19. package/dist/components/Tag/Tag.d.ts +1 -1
  20. package/dist/esm/index.css +63 -51
  21. package/dist/esm/packages/taco/src/components/Calendar/Calendar.js +62 -39
  22. package/dist/esm/packages/taco/src/components/Calendar/Calendar.js.map +1 -1
  23. package/dist/esm/packages/taco/src/components/Checkbox/Checkbox.js.map +1 -1
  24. package/dist/esm/packages/taco/src/components/Datepicker/Datepicker.js.map +1 -1
  25. package/dist/esm/packages/taco/src/components/Drawer/components/Content.js +1 -1
  26. package/dist/esm/packages/taco/src/components/Drawer/components/Content.js.map +1 -1
  27. package/dist/esm/packages/taco/src/components/Icon/components/LinkExternal.js +22 -0
  28. package/dist/esm/packages/taco/src/components/Icon/components/LinkExternal.js.map +1 -0
  29. package/dist/esm/packages/taco/src/components/Icon/components/index.js +2 -0
  30. package/dist/esm/packages/taco/src/components/Icon/components/index.js.map +1 -1
  31. package/dist/esm/packages/taco/src/components/List/List.js +21 -0
  32. package/dist/esm/packages/taco/src/components/List/List.js.map +1 -0
  33. package/dist/esm/packages/taco/src/components/List/components/Button.js +12 -0
  34. package/dist/esm/packages/taco/src/components/List/components/Button.js.map +1 -0
  35. package/dist/esm/packages/taco/src/components/List/components/Collapsible.js +30 -0
  36. package/dist/esm/packages/taco/src/components/List/components/Collapsible.js.map +1 -0
  37. package/dist/esm/packages/taco/src/components/List/components/Group.js +11 -0
  38. package/dist/esm/packages/taco/src/components/List/components/Group.js.map +1 -0
  39. package/dist/esm/packages/taco/src/components/List/components/Item.js +40 -0
  40. package/dist/esm/packages/taco/src/components/List/components/Item.js.map +1 -0
  41. package/dist/esm/packages/taco/src/components/List/components/Link.js +17 -0
  42. package/dist/esm/packages/taco/src/components/List/components/Link.js.map +1 -0
  43. package/dist/esm/packages/taco/src/components/List/components/Toggle.js +94 -0
  44. package/dist/esm/packages/taco/src/components/List/components/Toggle.js.map +1 -0
  45. package/dist/esm/packages/taco/src/components/Provider/Localization.js +2 -2
  46. package/dist/esm/packages/taco/src/components/Provider/Localization.js.map +1 -1
  47. package/dist/esm/packages/taco/src/components/Switch/Switch.js.map +1 -1
  48. package/dist/esm/packages/taco/src/components/Table3/components/Columns/Cell/EditingControlCell.js +1 -1
  49. package/dist/esm/packages/taco/src/index.js +2 -1
  50. package/dist/esm/packages/taco/src/index.js.map +1 -1
  51. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/Body.js +1 -1
  52. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Body/Body.js.map +1 -1
  53. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Filters/components/FilterValue.js +1 -1
  54. package/dist/esm/packages/taco/src/primitives/Table/Core/components/Toolbar/components/Search/Search.js +1 -1
  55. package/dist/index.css +63 -51
  56. package/dist/index.d.ts +1 -0
  57. package/dist/taco.cjs.development.js +343 -120
  58. package/dist/taco.cjs.development.js.map +1 -1
  59. package/dist/taco.cjs.production.min.js +1 -1
  60. package/dist/taco.cjs.production.min.js.map +1 -1
  61. package/package.json +4 -3
@@ -10,7 +10,7 @@ var cn = _interopDefault(require('clsx'));
10
10
  var AlertDialogPrimitive = require('@radix-ui/react-alert-dialog');
11
11
  var AccordionPrimitive = require('@radix-ui/react-accordion');
12
12
  var TooltipPrimitive = require('@radix-ui/react-tooltip');
13
- var ReactDayPicker = _interopDefault(require('react-day-picker'));
13
+ var reactDayPicker = require('react-day-picker');
14
14
  var CheckboxPrimitive = require('@radix-ui/react-checkbox');
15
15
  var uuid = require('uuid');
16
16
  var PopoverPrimitive = require('@radix-ui/react-popover');
@@ -23,9 +23,10 @@ var focus = require('@react-aria/focus');
23
23
  var ScrollAreaPrimitive = require('@radix-ui/react-scroll-area');
24
24
  var reactUseControllableState = require('@radix-ui/react-use-controllable-state');
25
25
  var HoverCardPrimitive = require('@radix-ui/react-hover-card');
26
+ var CollapsiblePrimitive = require('@radix-ui/react-collapsible');
27
+ var PrimitiveSwitch = require('@radix-ui/react-switch');
26
28
  var DropdownMenuPrimitive = require('@radix-ui/react-dropdown-menu');
27
29
  var RadioGroupPrimitive = require('@radix-ui/react-radio-group');
28
- var PrimitiveSwitch = require('@radix-ui/react-switch');
29
30
  var reactPortal = require('@radix-ui/react-portal');
30
31
  var reactTable = require('@tanstack/react-table');
31
32
  var reactVirtual = require('@tanstack/react-virtual');
@@ -2126,6 +2127,24 @@ function IconLine(props, svgRef) {
2126
2127
  }
2127
2128
  var Line = /*#__PURE__*/React.forwardRef(IconLine);
2128
2129
 
2130
+ function IconLinkExternal(props, svgRef) {
2131
+ return /*#__PURE__*/React.createElement("svg", Object.assign({
2132
+ xmlns: "http://www.w3.org/2000/svg",
2133
+ fill: "none",
2134
+ viewBox: "0 0 24 24",
2135
+ ref: svgRef
2136
+ }, props), /*#__PURE__*/React.createElement("path", {
2137
+ fill: "currentColor",
2138
+ d: "M11 5.5H7.25A1.75 1.75 0 005.5 7.25v9.5c0 .966.784 1.75 1.75 1.75h9.5a1.75 1.75 0 001.75-1.75V13H17v3.75a.25.25 0 01-.25.25h-9.5a.25.25 0 01-.25-.25v-9.5A.25.25 0 017.25 7H11V5.5z"
2139
+ }), /*#__PURE__*/React.createElement("path", {
2140
+ fill: "currentColor",
2141
+ fillRule: "evenodd",
2142
+ d: "M17.75 5.5a.75.75 0 01.743.648l.007.102v3.5a.75.75 0 01-1.493.102L17 9.75V8.06l-3.97 3.97a.75.75 0 01-1.133-.976l.073-.084L15.938 7H14.25a.75.75 0 01-.743-.648L13.5 6.25a.75.75 0 01.648-.743l.102-.007h3.5z",
2143
+ clipRule: "evenodd"
2144
+ }));
2145
+ }
2146
+ var LinkExternal = /*#__PURE__*/React.forwardRef(IconLinkExternal);
2147
+
2129
2148
  function IconListBulleted(props, svgRef) {
2130
2149
  return /*#__PURE__*/React.createElement("svg", Object.assign({
2131
2150
  xmlns: "http://www.w3.org/2000/svg",
@@ -3520,6 +3539,7 @@ const icons = {
3520
3539
  'ledger-card': LedgerCard,
3521
3540
  lightbulb: Lightbulb,
3522
3541
  line: Line,
3542
+ 'link-external': LinkExternal,
3523
3543
  'list-bulleted': ListBulleted,
3524
3544
  'list-search': ListSearch,
3525
3545
  list: List,
@@ -4330,8 +4350,8 @@ const defaultLocalisationTexts = {
4330
4350
  },
4331
4351
  calendar: {
4332
4352
  months: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
4333
- weekdaysShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
4334
- weekdays: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],
4353
+ weekdaysShort: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
4354
+ weekdays: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'],
4335
4355
  actions: {
4336
4356
  previousMonth: 'Previous month',
4337
4357
  nextMonth: 'Next month',
@@ -4722,8 +4742,6 @@ for (let i = thisYear - 50; i <= thisYear + 10; i += 1) {
4722
4742
  }
4723
4743
  const Navbar = /*#__PURE__*/React.memo(({
4724
4744
  onMonthChange,
4725
- onNextClick,
4726
- onPreviousClick,
4727
4745
  value = new Date()
4728
4746
  }) => {
4729
4747
  const {
@@ -4734,15 +4752,21 @@ const Navbar = /*#__PURE__*/React.memo(({
4734
4752
  }
4735
4753
  }
4736
4754
  } = useLocalization();
4737
- const handleChange = function handleChange(event) {
4755
+ const handleChange = event => {
4738
4756
  const {
4739
4757
  year,
4740
4758
  month
4741
4759
  } = event.target.form;
4742
4760
  onMonthChange(new Date(year.value, month.value));
4743
4761
  };
4762
+ const onNextClick = () => {
4763
+ onMonthChange(new Date(value.getFullYear(), value.getMonth() + 1, value.getDay()));
4764
+ };
4765
+ const onPreviousClick = () => {
4766
+ onMonthChange(new Date(value.getFullYear(), value.getMonth() - 1, value.getDay()));
4767
+ };
4744
4768
  return /*#__PURE__*/React.createElement("div", {
4745
- className: "mb-1 flex items-center justify-between"
4769
+ className: "mb-3 flex items-center justify-between"
4746
4770
  }, /*#__PURE__*/React.createElement("form", {
4747
4771
  className: "inline-flex space-x-1"
4748
4772
  }, /*#__PURE__*/React.createElement("select", {
@@ -4767,7 +4791,7 @@ const Navbar = /*#__PURE__*/React.memo(({
4767
4791
  appearance: "discrete",
4768
4792
  icon: "chevron-left",
4769
4793
  "aria-label": actions.previousMonth,
4770
- onClick: () => onPreviousClick(),
4794
+ onClick: onPreviousClick,
4771
4795
  rounded: true
4772
4796
  })), /*#__PURE__*/React.createElement(Tooltip, {
4773
4797
  title: actions.nextMonth
@@ -4775,22 +4799,40 @@ const Navbar = /*#__PURE__*/React.memo(({
4775
4799
  appearance: "discrete",
4776
4800
  icon: "chevron-right",
4777
4801
  "aria-label": actions.nextMonth,
4778
- onClick: () => onNextClick(),
4802
+ onClick: onNextClick,
4779
4803
  rounded: true
4780
4804
  }))));
4781
4805
  });
4782
- const Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
4806
+ const TodayButton = ({
4807
+ handleChange
4808
+ }) => {
4809
+ const {
4810
+ texts
4811
+ } = useLocalization();
4812
+ const handleCalendarClickToday = () => {
4813
+ const today = new Date();
4814
+ // set to midday to avoid UTC offset causing dates to be mismatched server side
4815
+ today.setHours(12);
4816
+ today.setMinutes(0);
4817
+ today.setSeconds(0);
4818
+ handleChange(today);
4819
+ };
4820
+ return /*#__PURE__*/React.createElement(reactDayPicker.Button, {
4821
+ className: "cursor-pointer border-none bg-transparent text-xs text-blue-500 hover:text-blue-300",
4822
+ onClick: handleCalendarClickToday
4823
+ }, texts.calendar.actions.today);
4824
+ };
4825
+ const Calendar$1 = props => {
4783
4826
  const {
4784
4827
  onChange: handleChange,
4785
4828
  value,
4786
4829
  disabledDays,
4787
4830
  ...otherProps
4788
4831
  } = props;
4832
+ const [visibleMonth, setVisibleMonth] = React.useState(value !== null && value !== void 0 ? value : new Date());
4789
4833
  const {
4790
- locale,
4791
4834
  texts
4792
4835
  } = useLocalization();
4793
- const [visibleMonth, setVisibleMonth] = React.useState(value !== null && value !== void 0 ? value : new Date());
4794
4836
  React.useEffect(() => {
4795
4837
  if (visibleMonth !== value) {
4796
4838
  setVisibleMonth(value !== null && value !== void 0 ? value : new Date());
@@ -4803,40 +4845,41 @@ const Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
4803
4845
  }
4804
4846
  handleChange(date, event);
4805
4847
  };
4806
- const handleCalendarClickToday = () => {
4807
- const today = new Date();
4808
- // set to midday to avoid UTC offset causing dates to be mismatched server side
4809
- today.setHours(12);
4810
- today.setMinutes(0);
4811
- today.setSeconds(0);
4812
- handleChange(today);
4813
- };
4814
4848
  const className = cn('flex bg-white text-xs p-2', otherProps.className);
4815
4849
  return /*#__PURE__*/React.createElement("div", {
4816
4850
  "data-taco": "calendar"
4817
- }, /*#__PURE__*/React.createElement(ReactDayPicker, Object.assign({}, otherProps, {
4851
+ }, /*#__PURE__*/React.createElement(reactDayPicker.DayPicker, {
4818
4852
  className: className,
4853
+ captionLayout: "dropdown-buttons",
4854
+ weekStartsOn: 1,
4819
4855
  month: visibleMonth,
4820
- selectedDays: value,
4821
- locale: locale.substring(0, 2),
4822
- firstDayOfWeek: 1,
4823
- months: texts.calendar.months,
4824
- weekdaysLong: texts.calendar.weekdays,
4825
- weekdaysShort: texts.calendar.weekdaysShort,
4826
- navbarElement: navProps => /*#__PURE__*/React.createElement(Navbar, Object.assign({}, navProps, {
4827
- onMonthChange: setVisibleMonth,
4828
- value: visibleMonth
4829
- })),
4830
- onDayClick: handleDayClick,
4831
- onMonthChange: setVisibleMonth,
4832
- onTodayButtonClick: handleCalendarClickToday,
4833
- captionElement: () => null,
4834
- todayButton: texts.calendar.actions.today,
4835
4856
  numberOfMonths: 1,
4836
- ref: ref,
4837
- disabledDays: disabledDays
4838
- })));
4839
- });
4857
+ components: {
4858
+ Caption: props => /*#__PURE__*/React.createElement(Navbar, Object.assign({}, props, {
4859
+ onMonthChange: setVisibleMonth,
4860
+ value: visibleMonth
4861
+ })),
4862
+ Footer: () => ( /*#__PURE__*/React.createElement("tfoot", null, /*#__PURE__*/React.createElement("tr", null, /*#__PURE__*/React.createElement("td", {
4863
+ colSpan: 7,
4864
+ className: "text-center"
4865
+ }, /*#__PURE__*/React.createElement(TodayButton, {
4866
+ handleChange: handleChange
4867
+ }))))),
4868
+ HeadRow: () => ( /*#__PURE__*/React.createElement("tr", null, texts.calendar.weekdaysShort.map((weekday, index) => {
4869
+ const label = texts.calendar.weekdays && texts.calendar.weekdays[index];
4870
+ return /*#__PURE__*/React.createElement("th", {
4871
+ key: weekday,
4872
+ "aria-label": label,
4873
+ className: "rdp-head_cell",
4874
+ title: label
4875
+ }, weekday);
4876
+ })))
4877
+ },
4878
+ onDayClick: handleDayClick,
4879
+ selected: value,
4880
+ disabled: disabledDays
4881
+ }));
4882
+ };
4840
4883
 
4841
4884
  const isElementTruncated = targetElement => {
4842
4885
  if (targetElement !== null) {
@@ -6716,7 +6759,7 @@ const Title$2 = /*#__PURE__*/React__default.forwardRef(function DrawerTitle(prop
6716
6759
  * where we might want to hide the grey separator. For this reason separator was rendedr with using of classNames,
6717
6760
  * so it can be easily overriden in exceptional scenarious.
6718
6761
  * */
6719
- const cName = cn('grow-0 py-4 pl-4 justyfy-self-start mb-0 border-b-[1px] border-grey-300', className);
6762
+ const cName = cn('grow-0 py-4 pl-4 justify-self-start mb-0 border-b-[1px] border-grey-300 flex items-center', className);
6720
6763
  return /*#__PURE__*/React__default.createElement(DialogPrimitive.Title, Object.assign({
6721
6764
  className: cName
6722
6765
  }, otherProps, {
@@ -7252,6 +7295,228 @@ const HoverCard = props => {
7252
7295
  HoverCard.Trigger = Trigger$5;
7253
7296
  HoverCard.Content = Content$7;
7254
7297
 
7298
+ const Group$1 = /*#__PURE__*/React__default.forwardRef(function Group(props, ref) {
7299
+ return /*#__PURE__*/React__default.createElement("div", Object.assign({}, props, {
7300
+ "data-taco": "list-group",
7301
+ ref: ref
7302
+ }));
7303
+ });
7304
+
7305
+ const Item$1 = /*#__PURE__*/React__default.forwardRef(function Item(props, ref) {
7306
+ const {
7307
+ as: Tag = 'div',
7308
+ control,
7309
+ description,
7310
+ disabled,
7311
+ icon,
7312
+ color,
7313
+ tabIndex = 0,
7314
+ title,
7315
+ ...attributes
7316
+ } = props;
7317
+ const iconClassName = cn('flex shrink-0 h-10 w-10 items-center justify-center rounded-md border border-black/10', getSubtleColorShadeClasses(color !== null && color !== void 0 ? color : 'transparent'));
7318
+ return /*#__PURE__*/React__default.createElement(Tag, Object.assign({}, attributes, {
7319
+ "aria-disabled": disabled ? true : undefined,
7320
+ "data-taco": "list-item",
7321
+ ref: ref,
7322
+ tabIndex: disabled ? -1 : tabIndex
7323
+ }), icon ? ( /*#__PURE__*/React__default.createElement("span", {
7324
+ className: iconClassName
7325
+ }, /*#__PURE__*/React__default.createElement(Icon, {
7326
+ name: icon
7327
+ }))) : null, /*#__PURE__*/React__default.createElement("div", {
7328
+ className: "flex grow flex-col justify-center"
7329
+ }, /*#__PURE__*/React__default.createElement("span", {
7330
+ className: "font-bold text-black"
7331
+ }, title), description ? /*#__PURE__*/React__default.createElement("span", {
7332
+ className: "text-grey-700"
7333
+ }, description) : null), /*#__PURE__*/React__default.createElement("div", {
7334
+ className: "text-grey-700 flex shrink-0 items-center"
7335
+ }, control));
7336
+ });
7337
+
7338
+ const Link = /*#__PURE__*/React__default.forwardRef(function Link(props, ref) {
7339
+ const control = /*#__PURE__*/React__default.createElement(Icon, {
7340
+ name: props.href.startsWith('http') ? 'link-external' : 'chevron-right'
7341
+ });
7342
+ return /*#__PURE__*/React__default.createElement(Item$1, Object.assign({}, props, {
7343
+ as: "a",
7344
+ control: control,
7345
+ ref: ref
7346
+ }));
7347
+ });
7348
+
7349
+ const Collapsible = /*#__PURE__*/React__default.forwardRef(function Accordion(props, ref) {
7350
+ const {
7351
+ defaultOpen = false,
7352
+ ...attributes
7353
+ } = props;
7354
+ const [open, setOpen] = React__default.useState(defaultOpen);
7355
+ const control = /*#__PURE__*/React__default.createElement(Icon, {
7356
+ name: open ? 'chevron-up' : 'chevron-down'
7357
+ });
7358
+ return /*#__PURE__*/React__default.createElement(CollapsiblePrimitive.Root, {
7359
+ "data-taco": "list-item-collapsible",
7360
+ disabled: props.disabled,
7361
+ open: open,
7362
+ onOpenChange: setOpen
7363
+ }, /*#__PURE__*/React__default.createElement(CollapsiblePrimitive.Trigger, {
7364
+ asChild: true
7365
+ }, /*#__PURE__*/React__default.createElement(Item$1, Object.assign({}, attributes, {
7366
+ as: "button",
7367
+ control: control,
7368
+ ref: ref
7369
+ }))), /*#__PURE__*/React__default.createElement(CollapsiblePrimitive.Content, null, props.children));
7370
+ });
7371
+
7372
+ const Switch = /*#__PURE__*/React.forwardRef(function Switch(props, ref) {
7373
+ const {
7374
+ label,
7375
+ onChange,
7376
+ ...otherProps
7377
+ } = props;
7378
+ const id = useId(props.id);
7379
+ const className = cn('group h-5 w-9 flex flex-shrink-0 rounded-full inline-flex focus-visible:yt-focus', {
7380
+ 'mr-2': !!label,
7381
+ 'bg-grey-500 hover:bg-grey-700 aria-checked:bg-blue-500 aria-checked:hover:bg-blue-700': !props.disabled,
7382
+ 'bg-grey-500/50 aria-checked:bg-blue-500/50 cursor-not-allowed': props.disabled
7383
+ }, props.className);
7384
+ let labelledByProps = null;
7385
+ if (label) {
7386
+ labelledByProps = {
7387
+ 'aria-labelledby': `${id}-label`,
7388
+ id
7389
+ };
7390
+ }
7391
+ const element = /*#__PURE__*/React.createElement(PrimitiveSwitch.Root, Object.assign({}, otherProps, labelledByProps, {
7392
+ className: className,
7393
+ "data-taco": "switch",
7394
+ onCheckedChange: onChange,
7395
+ ref: ref
7396
+ }), /*#__PURE__*/React.createElement(PrimitiveSwitch.Thumb, {
7397
+ className: "'will-change-transform mt-0.5 h-4 w-4 translate-x-[0.15rem] rounded-full bg-white transition-transform group-disabled:opacity-50 group-aria-checked:translate-x-[1.1rem]"
7398
+ }));
7399
+ if (label) {
7400
+ const labelContainerClassName = cn('flex self-start cursor-pointer', {
7401
+ 'cursor-not-allowed text-grey-300': props.disabled
7402
+ });
7403
+ return /*#__PURE__*/React.createElement("span", {
7404
+ className: labelContainerClassName,
7405
+ "data-taco": "switch-container"
7406
+ }, element, /*#__PURE__*/React.createElement("label", {
7407
+ htmlFor: id,
7408
+ id: `${id}-label`
7409
+ }, label));
7410
+ }
7411
+ return element;
7412
+ });
7413
+ Switch.displayName = 'Switch';
7414
+
7415
+ const ToggleItem = /*#__PURE__*/React__default.forwardRef(function Toggle(props, ref) {
7416
+ const {
7417
+ controlRef,
7418
+ ...attributes
7419
+ } = props;
7420
+ function handleClick(event) {
7421
+ var _controlRef$current;
7422
+ if (typeof props.onClick === 'function') {
7423
+ props.onClick(event);
7424
+ }
7425
+ if (event.isDefaultPrevented()) {
7426
+ return;
7427
+ }
7428
+ // If event target is not a control or not an element inside the control, then trigger click of the control
7429
+ if (event.target !== controlRef.current || !((_controlRef$current = controlRef.current) !== null && _controlRef$current !== void 0 && _controlRef$current.contains(event.target))) {
7430
+ var _controlRef$current2;
7431
+ (_controlRef$current2 = controlRef.current) === null || _controlRef$current2 === void 0 ? void 0 : _controlRef$current2.click();
7432
+ return;
7433
+ }
7434
+ }
7435
+ function handleKeyDown(event) {
7436
+ var _controlRef$current3;
7437
+ if (typeof props.onKeyDown === 'function') {
7438
+ props.onKeyDown(event);
7439
+ }
7440
+ if (event.isDefaultPrevented()) {
7441
+ return;
7442
+ }
7443
+ // If event target is not a control or not an element inside the control, then send appropriate "activate" keyboard shortcuts to the control as a click
7444
+ if ((event.key === 'Enter' || event.key === ' ') && (event.target !== controlRef.current || !((_controlRef$current3 = controlRef.current) !== null && _controlRef$current3 !== void 0 && _controlRef$current3.contains(event.target)))) {
7445
+ var _controlRef$current4;
7446
+ (_controlRef$current4 = controlRef.current) === null || _controlRef$current4 === void 0 ? void 0 : _controlRef$current4.click();
7447
+ return;
7448
+ }
7449
+ }
7450
+ const className = cn('group/toggle', props.className);
7451
+ return /*#__PURE__*/React__default.createElement(Item$1, Object.assign({}, attributes, {
7452
+ className: className,
7453
+ onClick: handleClick,
7454
+ onKeyDown: handleKeyDown,
7455
+ ref: ref
7456
+ }));
7457
+ });
7458
+ const Switch$1 = /*#__PURE__*/React__default.forwardRef(function Switch$1(props, ref) {
7459
+ const {
7460
+ checked,
7461
+ onChange,
7462
+ ...attributes
7463
+ } = props;
7464
+ const switchRef = React__default.useRef(null);
7465
+ const control = /*#__PURE__*/React__default.createElement(Switch, {
7466
+ checked: checked,
7467
+ className: "group-hover/toggle:[&[aria-checked=false]]:bg-grey-700 group-hover/toggle:[&[aria-checked=true]]:bg-blue-700",
7468
+ disabled: props.disabled,
7469
+ onChange: onChange,
7470
+ ref: switchRef,
7471
+ tabIndex: -1
7472
+ });
7473
+ return /*#__PURE__*/React__default.createElement(ToggleItem, Object.assign({}, attributes, {
7474
+ control: control,
7475
+ controlRef: switchRef,
7476
+ ref: ref
7477
+ }));
7478
+ });
7479
+ const Checkbox$1 = /*#__PURE__*/React__default.forwardRef(function Switch(props, ref) {
7480
+ const {
7481
+ checked,
7482
+ onChange,
7483
+ ...attributes
7484
+ } = props;
7485
+ const checkboxRef = React__default.useRef(null);
7486
+ const control = /*#__PURE__*/React__default.createElement(Checkbox, {
7487
+ checked: checked,
7488
+ className: "group-hover/toggle:[&[aria-checked=false]]:border-grey-700 group-hover/toggle:[&[aria-checked=true]]:border-blue-700 group-hover/checkbox:[&[aria-checked=true]]:bg-blue-700",
7489
+ disabled: props.disabled,
7490
+ onChange: onChange,
7491
+ ref: checkboxRef,
7492
+ tabIndex: -1
7493
+ });
7494
+ return /*#__PURE__*/React__default.createElement(ToggleItem, Object.assign({}, attributes, {
7495
+ control: control,
7496
+ controlRef: checkboxRef,
7497
+ ref: ref
7498
+ }));
7499
+ });
7500
+
7501
+ const Button$2 = /*#__PURE__*/React__default.forwardRef(function Link(props, ref) {
7502
+ return /*#__PURE__*/React__default.createElement(Item$1, Object.assign({}, props, {
7503
+ as: "button",
7504
+ ref: ref
7505
+ }));
7506
+ });
7507
+
7508
+ function List$1(props) {
7509
+ return /*#__PURE__*/React__default.createElement("div", Object.assign({}, props, {
7510
+ "data-taco": "list"
7511
+ }));
7512
+ }
7513
+ List$1.Button = Button$2;
7514
+ List$1.Link = Link;
7515
+ List$1.Collapsible = Collapsible;
7516
+ List$1.Switch = Switch$1;
7517
+ List$1.Checkbox = Checkbox$1;
7518
+ List$1.Group = Group$1;
7519
+
7255
7520
  function useTimer(duration = 0, callback) {
7256
7521
  const timer = React.useRef();
7257
7522
  const [tracker, setTracker] = React.useState({
@@ -7784,7 +8049,7 @@ const useItemStyling = ({
7784
8049
  'cursor-not-allowed hover:bg-white text-grey-300': disabled
7785
8050
  }, className);
7786
8051
  };
7787
- const Item$1 = /*#__PURE__*/React.forwardRef(function MenuItem(props, ref) {
8052
+ const Item$2 = /*#__PURE__*/React.forwardRef(function MenuItem(props, ref) {
7788
8053
  var _props$disabled;
7789
8054
  const {
7790
8055
  dialog,
@@ -7856,7 +8121,7 @@ const Item$1 = /*#__PURE__*/React.forwardRef(function MenuItem(props, ref) {
7856
8121
  return button;
7857
8122
  });
7858
8123
 
7859
- const Link = /*#__PURE__*/React.forwardRef(function MenuLink(props, ref) {
8124
+ const Link$1 = /*#__PURE__*/React.forwardRef(function MenuLink(props, ref) {
7860
8125
  const {
7861
8126
  href,
7862
8127
  icon,
@@ -7909,7 +8174,7 @@ const Trigger$6 = /*#__PURE__*/React.forwardRef(function MenuTrigger(props, ref)
7909
8174
  }));
7910
8175
  });
7911
8176
 
7912
- const Checkbox$1 = /*#__PURE__*/React.forwardRef(function MenuCheckboxItem(props, ref) {
8177
+ const Checkbox$2 = /*#__PURE__*/React.forwardRef(function MenuCheckboxItem(props, ref) {
7913
8178
  const {
7914
8179
  checked,
7915
8180
  children,
@@ -8152,9 +8417,9 @@ const Menu$1 = /*#__PURE__*/React.forwardRef(function Menu(externalProps, ref) {
8152
8417
  });
8153
8418
  Menu$1.Trigger = Trigger$6;
8154
8419
  Menu$1.Content = Content$8;
8155
- Menu$1.Item = Item$1;
8156
- Menu$1.Link = Link;
8157
- Menu$1.Checkbox = Checkbox$1;
8420
+ Menu$1.Item = Item$2;
8421
+ Menu$1.Link = Link$1;
8422
+ Menu$1.Checkbox = Checkbox$2;
8158
8423
  Menu$1.Separator = Separator;
8159
8424
  Menu$1.Header = Header;
8160
8425
  Menu$1.RadioGroup = RadioGroup$1;
@@ -8280,7 +8545,7 @@ const useDropTarget = onDrop => {
8280
8545
  return [isDraggedOver, props];
8281
8546
  };
8282
8547
 
8283
- const Item$2 = /*#__PURE__*/React__default.forwardRef(function Item(props, ref) {
8548
+ const Item$3 = /*#__PURE__*/React__default.forwardRef(function Item(props, ref) {
8284
8549
  const {
8285
8550
  active,
8286
8551
  children,
@@ -8388,7 +8653,7 @@ const Navigation = /*#__PURE__*/React__default.forwardRef(function Navigation(pr
8388
8653
  }), children);
8389
8654
  });
8390
8655
  Navigation.Menu = Menu$2;
8391
- Navigation.Item = Item$2;
8656
+ Navigation.Item = Item$3;
8392
8657
  Navigation.Panel = Panel;
8393
8658
 
8394
8659
  const useIntersectionObserver = (ref, offset) => {
@@ -12770,7 +13035,7 @@ function Body(props) {
12770
13035
  const isFirstRow = tableMeta.rowActive.rowActiveIndex === 0;
12771
13036
  const isLastRow = tableMeta.rowActive.rowActiveIndex === tableMeta.length - 1;
12772
13037
  if (event.key === 'Tab' || enableHorizontalArrowKeyNavigation && (event.key === 'ArrowLeft' || event.key === 'ArrowRight')) {
12773
- if (event.key === 'Tab' && !hasFocusableElement(event.target.closest('tr'))) {
13038
+ if (event.key === 'Tab' && !hasFocusableElement(event.target.closest('tr[data-row-id]'))) {
12774
13039
  return;
12775
13040
  }
12776
13041
  tableMeta.rowActive.setHoverStatePaused(true);
@@ -13096,49 +13361,6 @@ const SearchInput2 = /*#__PURE__*/React__default.forwardRef(function SearchInput
13096
13361
  return input;
13097
13362
  });
13098
13363
 
13099
- const Switch = /*#__PURE__*/React.forwardRef(function Switch(props, ref) {
13100
- const {
13101
- label,
13102
- onChange,
13103
- ...otherProps
13104
- } = props;
13105
- const id = useId(props.id);
13106
- const className = cn('group h-5 w-9 flex flex-shrink-0 rounded-full inline-flex focus-visible:yt-focus', {
13107
- 'mr-2': !!label,
13108
- 'bg-grey-500 hover:bg-grey-700 aria-checked:bg-blue-500 aria-checked:hover:bg-blue-700': !props.disabled,
13109
- 'bg-grey-500/50 aria-checked:bg-blue-500/50 cursor-not-allowed': props.disabled
13110
- }, props.className);
13111
- let labelledByProps = null;
13112
- if (label) {
13113
- labelledByProps = {
13114
- 'aria-labelledby': `${id}-label`,
13115
- id
13116
- };
13117
- }
13118
- const element = /*#__PURE__*/React.createElement(PrimitiveSwitch.Root, Object.assign({}, otherProps, labelledByProps, {
13119
- className: className,
13120
- "data-taco": "switch",
13121
- onCheckedChange: onChange,
13122
- ref: ref
13123
- }), /*#__PURE__*/React.createElement(PrimitiveSwitch.Thumb, {
13124
- className: "'will-change-transform mt-0.5 h-4 w-4 translate-x-[0.15rem] rounded-full bg-white transition-transform group-disabled:opacity-50 group-aria-checked:translate-x-[1.1rem]"
13125
- }));
13126
- if (label) {
13127
- const labelContainerClassName = cn('flex self-start cursor-pointer', {
13128
- 'cursor-not-allowed text-grey-300': props.disabled
13129
- });
13130
- return /*#__PURE__*/React.createElement("span", {
13131
- className: labelContainerClassName,
13132
- "data-taco": "switch-container"
13133
- }, element, /*#__PURE__*/React.createElement("label", {
13134
- htmlFor: id,
13135
- id: `${id}-label`
13136
- }, label));
13137
- }
13138
- return element;
13139
- });
13140
- Switch.displayName = 'Switch';
13141
-
13142
13364
  function Search$1(props) {
13143
13365
  var _tableMeta$search$hig, _tableMeta$search$hig2;
13144
13366
  const {
@@ -13304,7 +13526,7 @@ const isFormElement = element => {
13304
13526
  const formElementNodeNames = ['BUTTON', 'INPUT', 'TEXTAREA', 'SELECT', 'FIELDSET'];
13305
13527
  return formElementNodeNames.includes(element.nodeName);
13306
13528
  };
13307
- function Item$3(props) {
13529
+ function Item$4(props) {
13308
13530
  const {
13309
13531
  asChild,
13310
13532
  children,
@@ -13343,9 +13565,9 @@ function Item$3(props) {
13343
13565
  }
13344
13566
  return /*#__PURE__*/React__default.createElement("div", Object.assign({}, elProps), children);
13345
13567
  }
13346
- Item$3.displayName = 'SortableListItem';
13568
+ Item$4.displayName = 'SortableListItem';
13347
13569
 
13348
- function List$1(externalProps) {
13570
+ function List$2(externalProps) {
13349
13571
  const {
13350
13572
  children,
13351
13573
  id,
@@ -13365,7 +13587,7 @@ function List$1(externalProps) {
13365
13587
  ref: id ? setNodeRef : undefined
13366
13588
  }), children));
13367
13589
  }
13368
- List$1.displayName = 'SortableList';
13590
+ List$2.displayName = 'SortableList';
13369
13591
 
13370
13592
  const Column = /*#__PURE__*/React__default.forwardRef(function Column(props, ref) {
13371
13593
  var _column$parent, _column$parent$column, _column$columnDef$met;
@@ -13449,12 +13671,12 @@ function HideOrOrderPopover(props) {
13449
13671
  value: query
13450
13672
  })) : null, tableMeta.columnOrdering.isEnabled && columns.length && !(query !== null && query !== void 0 && query.length) ? ( /*#__PURE__*/React__default.createElement(Container, {
13451
13673
  reorder: handleReorder
13452
- }, /*#__PURE__*/React__default.createElement(List$1, {
13674
+ }, /*#__PURE__*/React__default.createElement(List$2, {
13453
13675
  id: "columns",
13454
13676
  className: listClassName
13455
13677
  }, columns.filter(column => !column.getIsGrouped()).map(column => {
13456
13678
  var _column$columnDef$met4, _column$columnDef$met5;
13457
- return /*#__PURE__*/React__default.createElement(Item$3, {
13679
+ return /*#__PURE__*/React__default.createElement(Item$4, {
13458
13680
  key: column.id,
13459
13681
  id: column.id,
13460
13682
  disabled: !((_column$columnDef$met4 = column.columnDef.meta) !== null && _column$columnDef$met4 !== void 0 && _column$columnDef$met4.enableOrdering),
@@ -13849,7 +14071,7 @@ const Option = /*#__PURE__*/React__default.forwardRef(function Listbox2Option(pr
13849
14071
  }));
13850
14072
  });
13851
14073
 
13852
- const Group$1 = /*#__PURE__*/React__default.forwardRef(function Listbox2Group(props, ref) {
14074
+ const Group$2 = /*#__PURE__*/React__default.forwardRef(function Listbox2Group(props, ref) {
13853
14075
  const [labelledById, setLabelledById] = React__default.useState();
13854
14076
  return /*#__PURE__*/React__default.createElement(Listbox2GroupContext.Provider, {
13855
14077
  value: {
@@ -14213,7 +14435,7 @@ const Option$1 = /*#__PURE__*/React__default.forwardRef(function Select2Option(p
14213
14435
  })) : null);
14214
14436
  });
14215
14437
 
14216
- const Group$2 = /*#__PURE__*/React__default.forwardRef(function Select2Group(props, ref) {
14438
+ const Group$3 = /*#__PURE__*/React__default.forwardRef(function Select2Group(props, ref) {
14217
14439
  const {
14218
14440
  children,
14219
14441
  heading,
@@ -14223,7 +14445,7 @@ const Group$2 = /*#__PURE__*/React__default.forwardRef(function Select2Group(pro
14223
14445
  const className = cn(createCollectionClassName(), {
14224
14446
  "last:after:content-none after:content-[''] after:bg-grey-300 after:mx-2 after:my-1 after:h-px": hasSeparator && children.length
14225
14447
  }, props.className);
14226
- return /*#__PURE__*/React__default.createElement(Group$1, Object.assign({}, attributes, {
14448
+ return /*#__PURE__*/React__default.createElement(Group$2, Object.assign({}, attributes, {
14227
14449
  className: className,
14228
14450
  ref: ref
14229
14451
  }), /*#__PURE__*/React__default.createElement(Title$4, {
@@ -14265,7 +14487,7 @@ const Trigger$7 = /*#__PURE__*/React__default.forwardRef(function Select2Trigger
14265
14487
  value: value
14266
14488
  }));
14267
14489
  });
14268
- const Button$2 = /*#__PURE__*/React__default.forwardRef(function Select2TriggerButton(props, ref) {
14490
+ const Button$3 = /*#__PURE__*/React__default.forwardRef(function Select2TriggerButton(props, ref) {
14269
14491
  var _props$className;
14270
14492
  const {
14271
14493
  children,
@@ -14350,7 +14572,7 @@ const Single = /*#__PURE__*/React__default.forwardRef(function Select2TriggerSin
14350
14572
  })) : currentValue.props.prefix : null, currentValue.props.children);
14351
14573
  }
14352
14574
  }
14353
- return /*#__PURE__*/React__default.createElement(Button$2, Object.assign({}, buttonProps, {
14575
+ return /*#__PURE__*/React__default.createElement(Button$3, Object.assign({}, buttonProps, {
14354
14576
  ref: ref
14355
14577
  }), /*#__PURE__*/React__default.createElement("div", {
14356
14578
  className: contentClassName
@@ -14414,7 +14636,7 @@ const Multiple = /*#__PURE__*/React__default.forwardRef(function Select2TriggerM
14414
14636
  style: {
14415
14637
  width: open ? (_buttonRef$current = buttonRef.current) === null || _buttonRef$current === void 0 ? void 0 : _buttonRef$current.offsetWidth : undefined
14416
14638
  }
14417
- }, /*#__PURE__*/React__default.createElement(Button$2, Object.assign({}, buttonProps, {
14639
+ }, /*#__PURE__*/React__default.createElement(Button$3, Object.assign({}, buttonProps, {
14418
14640
  className: className,
14419
14641
  ref: buttonRef
14420
14642
  }), content));
@@ -15028,7 +15250,7 @@ const Select2 = /*#__PURE__*/React__default.forwardRef(function Select2(props, r
15028
15250
  }) : null)))))));
15029
15251
  });
15030
15252
  Select2.Option = Option$1;
15031
- Select2.Group = Group$2;
15253
+ Select2.Group = Group$3;
15032
15254
  Select2.Title = Title$5;
15033
15255
  const ControlledHiddenField = props => {
15034
15256
  const {
@@ -15906,7 +16128,7 @@ function TableGrid(props) {
15906
16128
  function Column$1(_) {
15907
16129
  return null;
15908
16130
  }
15909
- function Group$3(_) {
16131
+ function Group$4(_) {
15910
16132
  return null;
15911
16133
  }
15912
16134
  const BaseReport = /*#__PURE__*/fixedForwardRef(function BaseReport(props, ref) {
@@ -15929,7 +16151,7 @@ const Report$1 = /*#__PURE__*/fixedForwardRef(function Report(props, ref) {
15929
16151
  }));
15930
16152
  });
15931
16153
  Report$1.Column = Column$1;
15932
- Report$1.Group = Group$3;
16154
+ Report$1.Group = Group$4;
15933
16155
 
15934
16156
  const sanitizeRowProps = (row, rowExpansionRenderer) => {
15935
16157
  var _row$subRows;
@@ -18643,10 +18865,10 @@ function Column$3(_) {
18643
18865
  return null;
18644
18866
  }
18645
18867
  Column$3.displayName = 'Table3Column';
18646
- function Group$4(_) {
18868
+ function Group$5(_) {
18647
18869
  return null;
18648
18870
  }
18649
- Group$4.displayName = 'Table3Group';
18871
+ Group$5.displayName = 'Table3Group';
18650
18872
  const BaseTable3 = /*#__PURE__*/fixedForwardRef(function BaseTable3(props, ref) {
18651
18873
  var _table3$meta$editing, _table3$meta$editing2;
18652
18874
  const table3 = useTable3(props, ref);
@@ -18687,7 +18909,7 @@ const Table3 = /*#__PURE__*/fixedForwardRef(function Table3(props, ref) {
18687
18909
  }));
18688
18910
  });
18689
18911
  Table3.Column = Column$3;
18690
- Table3.Group = Group$4;
18912
+ Table3.Group = Group$5;
18691
18913
 
18692
18914
  const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(props, ref) {
18693
18915
  const {
@@ -18898,7 +19120,7 @@ const Tour = props => {
18898
19120
  };
18899
19121
  Tour.Step = TourStep;
18900
19122
 
18901
- const Button$3 = /*#__PURE__*/React__default.forwardRef(function Button(props, ref) {
19123
+ const Button$4 = /*#__PURE__*/React__default.forwardRef(function Button(props, ref) {
18902
19124
  const {
18903
19125
  ...attributes
18904
19126
  } = props;
@@ -18914,7 +19136,7 @@ const getButtonClasses$1 = (rounded = true) => cn('!h-9 !w-9 flex-shrink-0 flex-
18914
19136
  '!rounded-full': rounded
18915
19137
  });
18916
19138
 
18917
- const Link$1 = /*#__PURE__*/React__default.forwardRef(function Link(props, ref) {
19139
+ const Link$2 = /*#__PURE__*/React__default.forwardRef(function Link(props, ref) {
18918
19140
  const {
18919
19141
  children,
18920
19142
  icon,
@@ -19310,8 +19532,8 @@ const Header$6 = /*#__PURE__*/React__default.forwardRef(function Header(props, r
19310
19532
  });
19311
19533
  Header$6.AgreementDisplay = AgreementDisplay$1;
19312
19534
  Header$6.AgreementSelector = AgreementSelector;
19313
- Header$6.Button = Button$3;
19314
- Header$6.Link = Link$1;
19535
+ Header$6.Button = Button$4;
19536
+ Header$6.Link = Link$2;
19315
19537
  Header$6.Logo = Logo;
19316
19538
  Header$6.LogoLegacy = LogoLegacy;
19317
19539
  Header$6.PrimaryNavigation = PrimaryNavigation;
@@ -19445,7 +19667,7 @@ Layout$1.Page = Page;
19445
19667
  Layout$1.Sidebar = Sidebar;
19446
19668
  Layout$1.Content = Content$9;
19447
19669
 
19448
- const Group$5 = /*#__PURE__*/React__default.forwardRef(function Group(props, ref) {
19670
+ const Group$6 = /*#__PURE__*/React__default.forwardRef(function Group(props, ref) {
19449
19671
  const {
19450
19672
  children,
19451
19673
  defaultExpanded = false,
@@ -19503,7 +19725,7 @@ const getNavigationLinkClasses = (isDraggedOver = false) => cn('group relative f
19503
19725
  'hover:bg-black/[.06] aria-current-page:bg-blue-500/[.1]': !isDraggedOver,
19504
19726
  '!bg-blue-500 !text-white [&>*]:!text-white': isDraggedOver
19505
19727
  });
19506
- const Link$2 = /*#__PURE__*/React__default.forwardRef(function Link(props, ref) {
19728
+ const Link$3 = /*#__PURE__*/React__default.forwardRef(function Link(props, ref) {
19507
19729
  const {
19508
19730
  active,
19509
19731
  children,
@@ -19604,8 +19826,8 @@ const Navigation2 = /*#__PURE__*/React__default.forwardRef(function Navigation2(
19604
19826
  }
19605
19827
  }), children);
19606
19828
  });
19607
- Navigation2.Group = Group$5;
19608
- Navigation2.Link = Link$2;
19829
+ Navigation2.Group = Group$6;
19830
+ Navigation2.Link = Link$3;
19609
19831
  Navigation2.Section = Section;
19610
19832
  Navigation2.Content = Content$a;
19611
19833
 
@@ -19667,6 +19889,7 @@ exports.Icon = Icon;
19667
19889
  exports.IconButton = IconButton;
19668
19890
  exports.Input = Input;
19669
19891
  exports.Layout = Layout$1;
19892
+ exports.List = List$1;
19670
19893
  exports.Listbox = Listbox;
19671
19894
  exports.LocalizationContext = LocalizationContext;
19672
19895
  exports.LocalizationProvider = LocalizationProvider;