@seeqdev/qomponents 0.0.59 → 0.0.60

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.
package/dist/index.js CHANGED
@@ -3010,20 +3010,6 @@ function useFloating(options) {
3010
3010
  }), [data, update, refs, elements, floatingStyles]);
3011
3011
  }
3012
3012
 
3013
- const $7e8f5cd07187803e$export$21b07c8f274aebd5 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
3014
- const { children: children , width: width = 10 , height: height = 5 , ...arrowProps } = props;
3015
- return /*#__PURE__*/ React.createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.svg, _extends({}, arrowProps, {
3016
- ref: forwardedRef,
3017
- width: width,
3018
- height: height,
3019
- viewBox: "0 0 30 10",
3020
- preserveAspectRatio: "none"
3021
- }), props.asChild ? children : /*#__PURE__*/ React.createElement("polygon", {
3022
- points: "0,0 30,0 15,10"
3023
- }));
3024
- });
3025
- /* -----------------------------------------------------------------------------------------------*/ const $7e8f5cd07187803e$export$be92b6f5f03c0fe9 = $7e8f5cd07187803e$export$21b07c8f274aebd5;
3026
-
3027
3013
  function $db6c3485150b8e66$export$1ab7ae714698c4b8(element) {
3028
3014
  const [size, setSize] = React.useState(undefined);
3029
3015
  $9f79659886946c16$export$e5c5a5f917a5871c(()=>{
@@ -3243,52 +3229,6 @@ const $cf1ac5d9fe0e8206$export$bc4ae5855d3c4fc = /*#__PURE__*/ React.forwardRef(
3243
3229
  }
3244
3230
  }))));
3245
3231
  });
3246
- /* -------------------------------------------------------------------------------------------------
3247
- * PopperArrow
3248
- * -----------------------------------------------------------------------------------------------*/ const $cf1ac5d9fe0e8206$var$ARROW_NAME = 'PopperArrow';
3249
- const $cf1ac5d9fe0e8206$var$OPPOSITE_SIDE = {
3250
- top: 'bottom',
3251
- right: 'left',
3252
- bottom: 'top',
3253
- left: 'right'
3254
- };
3255
- const $cf1ac5d9fe0e8206$export$79d62cd4e10a3fd0 = /*#__PURE__*/ React.forwardRef(function $cf1ac5d9fe0e8206$export$79d62cd4e10a3fd0(props, forwardedRef) {
3256
- const { __scopePopper: __scopePopper , ...arrowProps } = props;
3257
- const contentContext = $cf1ac5d9fe0e8206$var$useContentContext($cf1ac5d9fe0e8206$var$ARROW_NAME, __scopePopper);
3258
- const baseSide = $cf1ac5d9fe0e8206$var$OPPOSITE_SIDE[contentContext.placedSide];
3259
- return(/*#__PURE__*/ // we have to use an extra wrapper because `ResizeObserver` (used by `useSize`)
3260
- // doesn't report size as we'd expect on SVG elements.
3261
- // it reports their bounding box which is effectively the largest path inside the SVG.
3262
- React.createElement("span", {
3263
- ref: contentContext.onArrowChange,
3264
- style: {
3265
- position: 'absolute',
3266
- left: contentContext.arrowX,
3267
- top: contentContext.arrowY,
3268
- [baseSide]: 0,
3269
- transformOrigin: {
3270
- top: '',
3271
- right: '0 0',
3272
- bottom: 'center 0',
3273
- left: '100% 0'
3274
- }[contentContext.placedSide],
3275
- transform: {
3276
- top: 'translateY(100%)',
3277
- right: 'translateY(50%) rotate(90deg) translateX(-50%)',
3278
- bottom: `rotate(180deg)`,
3279
- left: 'translateY(50%) rotate(-90deg) translateX(50%)'
3280
- }[contentContext.placedSide],
3281
- visibility: contentContext.shouldHideArrow ? 'hidden' : undefined
3282
- }
3283
- }, /*#__PURE__*/ React.createElement($7e8f5cd07187803e$export$be92b6f5f03c0fe9, _extends({}, arrowProps, {
3284
- ref: forwardedRef,
3285
- style: {
3286
- ...arrowProps.style,
3287
- // ensures the element can be measured correctly (mostly for if SVG)
3288
- display: 'block'
3289
- }
3290
- }))));
3291
- });
3292
3232
  /* -----------------------------------------------------------------------------------------------*/ function $cf1ac5d9fe0e8206$var$isNotNull(value) {
3293
3233
  return value !== null;
3294
3234
  }
@@ -3344,7 +3284,6 @@ function $cf1ac5d9fe0e8206$var$getSideAndAlignFromPlacement(placement) {
3344
3284
  const $cf1ac5d9fe0e8206$export$be92b6f5f03c0fe9 = $cf1ac5d9fe0e8206$export$badac9ada3a0bdf9;
3345
3285
  const $cf1ac5d9fe0e8206$export$b688253958b8dfe7 = $cf1ac5d9fe0e8206$export$ecd4e1ccab6ed6d;
3346
3286
  const $cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2 = $cf1ac5d9fe0e8206$export$bc4ae5855d3c4fc;
3347
- const $cf1ac5d9fe0e8206$export$21b07c8f274aebd5 = $cf1ac5d9fe0e8206$export$79d62cd4e10a3fd0;
3348
3287
 
3349
3288
  const $f1701beae083dbae$export$602eac185826482c = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
3350
3289
  var _globalThis$document;
@@ -4354,7 +4293,7 @@ var SideCar = exportSidecar(effectCar, RemoveScrollSideCar);
4354
4293
 
4355
4294
  var ReactRemoveScroll = React__namespace.forwardRef(function (props, ref) { return (React__namespace.createElement(RemoveScroll, __assign({}, props, { ref: ref, sideCar: SideCar }))); });
4356
4295
  ReactRemoveScroll.classNames = RemoveScroll.classNames;
4357
- var $epM9y$RemoveScroll = ReactRemoveScroll;
4296
+ var $67UHm$RemoveScroll = ReactRemoveScroll;
4358
4297
 
4359
4298
  /* -------------------------------------------------------------------------------------------------
4360
4299
  * Popover
@@ -4445,7 +4384,7 @@ const $cb5cc270b50c6fcd$export$d7e1f420b25549ff = /*#__PURE__*/ React.forwardRef
4445
4384
  const content = contentRef.current;
4446
4385
  if (content) return hideOthers(content);
4447
4386
  }, []);
4448
- return /*#__PURE__*/ React.createElement($epM9y$RemoveScroll, {
4387
+ return /*#__PURE__*/ React.createElement($67UHm$RemoveScroll, {
4449
4388
  as: $5e63c961fc1ce211$export$8c6ed5c666ac1360,
4450
4389
  allowPinchZoom: true
4451
4390
  }, /*#__PURE__*/ React.createElement($cb5cc270b50c6fcd$var$PopoverContentImpl, _extends({}, props, {
@@ -4547,22 +4486,14 @@ const $cb5cc270b50c6fcd$var$PopoverContentNonModal = /*#__PURE__*/ React.forward
4547
4486
  }
4548
4487
  }))));
4549
4488
  });
4550
- const $cb5cc270b50c6fcd$export$3152841115e061b2 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
4551
- const { __scopePopover: __scopePopover , ...arrowProps } = props;
4552
- const popperScope = $cb5cc270b50c6fcd$var$usePopperScope(__scopePopover);
4553
- return /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$export$21b07c8f274aebd5, _extends({}, popperScope, arrowProps, {
4554
- ref: forwardedRef
4555
- }));
4556
- });
4557
4489
  /* -----------------------------------------------------------------------------------------------*/ function $cb5cc270b50c6fcd$var$getState(open) {
4558
4490
  return open ? 'open' : 'closed';
4559
4491
  }
4560
4492
  const $cb5cc270b50c6fcd$export$be92b6f5f03c0fe9 = $cb5cc270b50c6fcd$export$5b6b19405a83ff9d;
4561
4493
  const $cb5cc270b50c6fcd$export$41fb9f06171c75f4 = $cb5cc270b50c6fcd$export$7dacb05d26466c3;
4562
4494
  const $cb5cc270b50c6fcd$export$7c6e2c02157bb7d2 = $cb5cc270b50c6fcd$export$d7e1f420b25549ff;
4563
- const $cb5cc270b50c6fcd$export$21b07c8f274aebd5 = $cb5cc270b50c6fcd$export$3152841115e061b2;
4564
4495
 
4565
- const borderStyles$3 = [
4496
+ const borderStyles$1 = [
4566
4497
  'tw-border-solid',
4567
4498
  'tw-border',
4568
4499
  'tw-rounded-sm',
@@ -4596,10 +4527,10 @@ const activeBorderStyles = [
4596
4527
  'active:tw-border-sq-color-dark',
4597
4528
  'dark:hover:tw-border-sq-color-dark-dark',
4598
4529
  ].join(' ');
4599
- const bgStyles$2 = ['tw-bg-sq-white', 'dark:tw-bg-sq-dark-background'].join(' ');
4600
- const disabledClasses$3 = ['tw-opacity-50', 'tw-cursor-not-allowed'].join(' ');
4530
+ const bgStyles = ['tw-bg-sq-white', 'dark:tw-bg-sq-dark-background'].join(' ');
4531
+ const disabledClasses$1 = ['tw-opacity-50', 'tw-cursor-not-allowed'].join(' ');
4601
4532
  const PopoverContent = React__namespace.forwardRef(({ className, align = 'center', sideOffset = 4, ...props }, ref) => (React__namespace.createElement($cb5cc270b50c6fcd$export$7c6e2c02157bb7d2, { ref: ref, align: align, sideOffset: sideOffset, ...props, asChild: true })));
4602
- const ToolbarButton = ({ isSmall = false, label, icon, secondIcon, forceSmallIcon = false, tooltipText, id, popoverContent, extraClassNames, testId, tooltipTestId, tooltipOptions, isActive = false, isHtmlTooltip = false, hasArrow = false, disabled = false, onClick, onHide, }) => {
4533
+ const ToolbarButton = ({ isSmall = false, label, icon, secondIcon, forceSmallIcon = false, tooltipText, id, popoverContent, extraClassNames, testId, tooltipTestId, tooltipOptions, isActive = false, isHtmlTooltip = true, disabled = false, onClick, onHide, }) => {
4603
4534
  let tooltipData = undefined;
4604
4535
  if (tooltipText) {
4605
4536
  tooltipData = {
@@ -4616,22 +4547,20 @@ const ToolbarButton = ({ isSmall = false, label, icon, secondIcon, forceSmallIco
4616
4547
  }
4617
4548
  };
4618
4549
  return (React__namespace.createElement($cb5cc270b50c6fcd$export$be92b6f5f03c0fe9, { defaultOpen: false, onOpenChange: onOpenChange },
4619
- React__namespace.createElement($cb5cc270b50c6fcd$export$41fb9f06171c75f4, { id: id, className: `tw-border-none ${isActive ? 'active' : ''}`, disabled: disabled, "data-testid": testId, onClick: (e) => {
4550
+ React__namespace.createElement($cb5cc270b50c6fcd$export$41fb9f06171c75f4, { id: id, className: `tw-border-none ${isActive ? 'active' : ''}`, disabled: disabled, "data-testid": testId, ...tooltipData, onClick: (e) => {
4620
4551
  onClick && onClick(e);
4621
4552
  } },
4622
- React__namespace.createElement("div", { ...tooltipData, className: `tw-bg-transparent tw-p-0 tw-flex tw-flex-col tw-items-center ${isSmall ? 'tw-py-[1px] tw-px-[5px]' : 'tw-px-2 tw-py-[3px]'} ${disabled ? disabledClasses$3 : isActive ? activeBorderStyles : triggerBorderStyles} ${extraClassNames || ''}` },
4553
+ React__namespace.createElement("div", { className: `tw-bg-transparent tw-p-0 tw-flex tw-flex-col tw-items-center ${isSmall ? 'tw-py-[1px] tw-px-[5px]' : 'tw-px-2 tw-py-[3px]'} ${disabled ? disabledClasses$1 : isActive ? activeBorderStyles : triggerBorderStyles} ${extraClassNames || ''}` },
4623
4554
  React__namespace.createElement("span", { className: "tw-nowrap" },
4624
4555
  React__namespace.createElement(Icon, { icon: icon, testId: "firstIcon", type: "text", large: !isSmall && !label && !secondIcon && !forceSmallIcon, extraClassNames: `tw-text-sq-text-color dark:tw-text-sq-dark-text` }),
4625
4556
  secondIcon && React__namespace.createElement(Icon, { icon: secondIcon, type: "text", testId: "secondIcon" }),
4626
4557
  popoverContent ? (React__namespace.createElement(Icon, { icon: "fc-arrow-dropdown", extraClassNames: "tw-text-sq-text-color dark:tw-text-sq-dark-text tw-ml-[3px] tw-text-[8px]", type: "text" })) : undefined),
4627
4558
  !isSmall && (React__namespace.createElement("small", { className: "tw-text-sq-text-color dark:tw-text-sq-dark-text tw-text-[10px]" }, label)))),
4628
- !!popoverContent ? (React__namespace.createElement(PopoverContent, { sideOffset: 2, align: "start" },
4629
- React__namespace.createElement("div", { className: bgStyles$2 +
4630
- ' tw-relative tw-z-[1000] tw-min-w-6 tw-p-[0.5rem] focus-visible:tw-outline-none tw-outline-none data-[state=open]:animate-in data-[state=closed]:animate-out' +
4559
+ !!popoverContent ? (React__namespace.createElement(PopoverContent, { sideOffset: 4, align: "start" },
4560
+ React__namespace.createElement("div", { className: bgStyles +
4561
+ ' tw-relative tw-z-[1000] tw-min-w-6 tw-p-[0.5rem] outline-none data-[state=open]:animate-in data-[state=closed]:animate-out' +
4631
4562
  ' data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2' +
4632
- borderStyles$3 },
4633
- hasArrow && (React__namespace.createElement($cb5cc270b50c6fcd$export$21b07c8f274aebd5, { className: "tw-fill-white tw-stroke-2 dark:tw-fill-sq-dark-background tw-stroke-slate-300 dark:tw-stroke-sq-color-dark-dark" })),
4634
- popoverContent))) : undefined));
4563
+ borderStyles$1 }, popoverContent))) : undefined));
4635
4564
  };
4636
4565
 
4637
4566
  const errorClasses$2 = 'tw-border-sq-danger-color';
@@ -6540,17 +6469,11 @@ const QTip = () => {
6540
6469
  let dataset = e.target?.dataset;
6541
6470
  let text = dataset?.qtipText;
6542
6471
  // Buttons support React.Nodes as children, the tooltip however is applied to the actual button component.
6543
- // we only check two levels up - alternatively the tooltip can also be provided on the React.Node
6472
+ // we only check one level up - alternatively the tooltip can also be provided on the React.Node
6544
6473
  if (!text || text === '') {
6545
- let currentTooltipTarget = e.target?.parentElement;
6546
- dataset = currentTooltipTarget?.dataset;
6474
+ dataset = e.target?.parentElement?.dataset;
6547
6475
  text = dataset?.qtipText;
6548
- if (!text || text === '') {
6549
- currentTooltipTarget = e.target?.parentElement?.parentElement;
6550
- dataset = currentTooltipTarget?.dataset;
6551
- text = dataset?.qtipText;
6552
- }
6553
- tooltipTarget.current = currentTooltipTarget;
6476
+ tooltipTarget.current = e.target?.parentElement;
6554
6477
  }
6555
6478
  if (text) {
6556
6479
  const delay = parseInt(dataset?.qtipDelay ?? DEFAULT_TOOL_TIP_DELAY + '');
@@ -13615,7 +13538,7 @@ const baseClasses = ['focus:tw-ring-0', 'disabled:tw-cursor-not-allowed'].join('
13615
13538
  const containerStyles = ['tw-bg-white', 'dark:tw-bg-sq-dark-background'].join(' ');
13616
13539
  const errorClasses = 'tw-border-sq-danger-color';
13617
13540
  const borderColorClasses = ['tw-border-sq-disabled-gray', 'dark:tw-border-sq-dark-disabled-gray'].join(' ');
13618
- const borderStyles$2 = [
13541
+ const borderStyles = [
13619
13542
  'tw-border-solid',
13620
13543
  'tw-border',
13621
13544
  'hover:tw-border-sq-color-dark',
@@ -13669,7 +13592,7 @@ const optionStyles = [
13669
13592
  'tw-px-2.5',
13670
13593
  'specSelectOption',
13671
13594
  ].join(' ');
13672
- const disabledClasses$2 = ['tw-bg-sq-field-disabled-gray', 'tw-cursor-not-allowed'].join(' ');
13595
+ const disabledClasses = ['tw-bg-sq-field-disabled-gray', 'tw-cursor-not-allowed'].join(' ');
13673
13596
  const dropDownIndicatorStyles = `tw-text-sq-disabled-gray ${textActiveStyles} specOpenIt`;
13674
13597
  const placeholderStyles = ['tw-text-gray-400', 'dark:tw-text-sq-dark-text-lighter', 'specOpenSelect'].join(' ');
13675
13598
  const multiValueStyles = [
@@ -13746,8 +13669,8 @@ const Select = ({ options, value, placeholder = 'select', noOptionsMessage = 'no
13746
13669
  else if (inputGroup === 'right') {
13747
13670
  border = menuIsOpen ? 'tw-rounded-tr-sm' : 'tw-rounded-r-sm';
13748
13671
  }
13749
- const appliedClasses = `${borderStyles$2} ${border} ${showError ? errorClasses : borderColorClasses} ${small ? 'reactSelectMinHeightSmall' : 'reactSelectMinHeight'} `;
13750
- return `${appliedClasses} ${baseClasses} specSelectControl ${isDisabled ? disabledClasses$2 : ''} ${small ? 'tw-pl-2 tw-pr-1' : 'tw-pl-2.5 tw-pr-1.5'}`;
13672
+ const appliedClasses = `${borderStyles} ${border} ${showError ? errorClasses : borderColorClasses} ${small ? 'reactSelectMinHeightSmall' : 'reactSelectMinHeight'} `;
13673
+ return `${appliedClasses} ${baseClasses} specSelectControl ${isDisabled ? disabledClasses : ''} ${small ? 'tw-pl-2 tw-pr-1' : 'tw-pl-2.5 tw-pr-1.5'}`;
13751
13674
  },
13752
13675
  placeholder: () => placeholderStyles,
13753
13676
  container: () => `${textStyles} ${containerStyles} ${extraClassNames}`,
@@ -15011,768 +14934,8 @@ const Accordion = ({ accordionItems, defaultValue, value, onItemSelect, disabled
15011
14934
  React.createElement($1bf158f521e1b1b4$export$7c6e2c02157bb7d2, { className: `data-[state=open]:tw-animate-slideDown data-[state=closed]:tw-animate-slideUp tw-overflow-hidden focus-visible:tw-outline-none ${item.contentClassNames || ''}` }, item.content))))));
15012
14935
  };
15013
14936
 
15014
- const bgStyles$1 = ['tw-bg-sq-white', 'dark:tw-bg-sq-dark-background'].join(' ');
15015
- const borderStyles$1 = [
15016
- 'tw-border-solid',
15017
- 'tw-border',
15018
- 'tw-rounded-sm',
15019
- 'tw-border-sq-light-gray',
15020
- 'dark:tw-border-gray-700',
15021
- ].join(' ');
15022
- const disabledClasses$1 = ['tw-opacity-50', 'tw-cursor-not-allowed'].join(' ');
15023
- const ButtonWithPopover = ({ children, trigger, tooltipText, id, hasArrow, extraTriggerClassNames, extraPopoverClassNames, testId, tooltipTestId, tooltipDelay, tooltipPlacement, disabled = false, align = 'end', alignOffset = -5, placement = 'bottom', placementOffset = 2, onOpenChange, isOpen, isHtmlTooltip = false, isCloseOnContentClick = false, }) => {
15024
- let tooltipData = undefined;
15025
- if (tooltipText) {
15026
- tooltipData = {
15027
- 'data-qtip-text': tooltipText,
15028
- 'data-qtip-placement': tooltipPlacement,
15029
- 'data-qtip-is-html': isHtmlTooltip,
15030
- 'data-qtip-testid': tooltipTestId,
15031
- 'data-qtip-delay': tooltipDelay ?? DEFAULT_TOOL_TIP_DELAY,
15032
- };
15033
- }
15034
- return (React__namespace.createElement($cb5cc270b50c6fcd$export$be92b6f5f03c0fe9, { open: isOpen, defaultOpen: false, onOpenChange: onOpenChange },
15035
- React__namespace.createElement($cb5cc270b50c6fcd$export$41fb9f06171c75f4, { id: id, className: `tw-border-none`, disabled: disabled, "data-testid": testId },
15036
- React__namespace.createElement("div", { ...tooltipData, className: `tw-bg-transparent tw-flex tw-flex-col tw-items-center tw-justify-center ${disabled ? disabledClasses$1 : ''} ${extraTriggerClassNames || ''}` }, trigger)),
15037
- React__namespace.createElement($cb5cc270b50c6fcd$export$7c6e2c02157bb7d2, { sideOffset: placementOffset, align: align, side: placement, alignOffset: alignOffset, asChild: true, onClick: () => isCloseOnContentClick && onOpenChange && onOpenChange(false), className: "focus-visible:tw-outline-none tw-outline-none" },
15038
- React__namespace.createElement("div", { className: `${bgStyles$1} ${borderStyles$1} tw-relative tw-z-[1000] tw-min-w-6 tw-p-[0.5rem] focus-visible:tw-outline-none tw-outline-none data-[state=open]:tw-animate-in data-[state=closed]:tw-animate-out
15039
- data-[side=top]:tw-animate-slideDownAndFade data-[side=right]:tw-animate-slideLeftAndFade data-[side=bottom]:tw-animate-slideUpAndFade data-[side=left]:tw-animate-slideRightAndFade
15040
- ${extraPopoverClassNames || ''}` },
15041
- hasArrow && (React__namespace.createElement($cb5cc270b50c6fcd$export$21b07c8f274aebd5, { asChild: true },
15042
- React__namespace.createElement("div", { className: " tw-fill-transparent tw-bg-white tw-w-[6px] tw-h-[6px] tw-rotate-45 dark:tw-bg-sq-dark-background tw-border-b tw-border-r tw-border-sq-light-gray dark:tw-border-gray-700 tw-mt-[-2px]" }))),
15043
- children))));
15044
- };
15045
-
15046
- const $6cc32821e9371a1c$var$SELECTION_KEYS = [
15047
- 'Enter',
15048
- ' '
15049
- ];
15050
- const $6cc32821e9371a1c$var$FIRST_KEYS = [
15051
- 'ArrowDown',
15052
- 'PageUp',
15053
- 'Home'
15054
- ];
15055
- const $6cc32821e9371a1c$var$LAST_KEYS = [
15056
- 'ArrowUp',
15057
- 'PageDown',
15058
- 'End'
15059
- ];
15060
- const $6cc32821e9371a1c$var$FIRST_LAST_KEYS = [
15061
- ...$6cc32821e9371a1c$var$FIRST_KEYS,
15062
- ...$6cc32821e9371a1c$var$LAST_KEYS
15063
- ];
15064
- /* -------------------------------------------------------------------------------------------------
15065
- * Menu
15066
- * -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$MENU_NAME = 'Menu';
15067
- const [$6cc32821e9371a1c$var$Collection, $6cc32821e9371a1c$var$useCollection, $6cc32821e9371a1c$var$createCollectionScope] = $e02a7d9cb1dc128c$export$c74125a8e3af6bb2($6cc32821e9371a1c$var$MENU_NAME);
15068
- const [$6cc32821e9371a1c$var$createMenuContext, $6cc32821e9371a1c$export$4027731b685e72eb] = $c512c27ab02ef895$export$50c7b4e9d9f19c1($6cc32821e9371a1c$var$MENU_NAME, [
15069
- $6cc32821e9371a1c$var$createCollectionScope,
15070
- $cf1ac5d9fe0e8206$export$722aac194ae923,
15071
- $d7bdfb9eb0fdf311$export$c7109489551a4f4
15072
- ]);
15073
- const $6cc32821e9371a1c$var$usePopperScope = $cf1ac5d9fe0e8206$export$722aac194ae923();
15074
- const $6cc32821e9371a1c$var$useRovingFocusGroupScope = $d7bdfb9eb0fdf311$export$c7109489551a4f4();
15075
- const [$6cc32821e9371a1c$var$MenuProvider, $6cc32821e9371a1c$var$useMenuContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$MENU_NAME);
15076
- const [$6cc32821e9371a1c$var$MenuRootProvider, $6cc32821e9371a1c$var$useMenuRootContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$MENU_NAME);
15077
- const $6cc32821e9371a1c$export$d9b273488cd8ce6f = (props)=>{
15078
- const { __scopeMenu: __scopeMenu , open: open = false , children: children , dir: dir , onOpenChange: onOpenChange , modal: modal = true } = props;
15079
- const popperScope = $6cc32821e9371a1c$var$usePopperScope(__scopeMenu);
15080
- const [content, setContent] = React.useState(null);
15081
- const isUsingKeyboardRef = React.useRef(false);
15082
- const handleOpenChange = $b1b2314f5f9a1d84$export$25bec8c6f54ee79a(onOpenChange);
15083
- const direction = $f631663db3294ace$export$b39126d51d94e6f3(dir);
15084
- React.useEffect(()=>{
15085
- // Capture phase ensures we set the boolean before any side effects execute
15086
- // in response to the key or pointer event as they might depend on this value.
15087
- const handleKeyDown = ()=>{
15088
- isUsingKeyboardRef.current = true;
15089
- document.addEventListener('pointerdown', handlePointer, {
15090
- capture: true,
15091
- once: true
15092
- });
15093
- document.addEventListener('pointermove', handlePointer, {
15094
- capture: true,
15095
- once: true
15096
- });
15097
- };
15098
- const handlePointer = ()=>isUsingKeyboardRef.current = false
15099
- ;
15100
- document.addEventListener('keydown', handleKeyDown, {
15101
- capture: true
15102
- });
15103
- return ()=>{
15104
- document.removeEventListener('keydown', handleKeyDown, {
15105
- capture: true
15106
- });
15107
- document.removeEventListener('pointerdown', handlePointer, {
15108
- capture: true
15109
- });
15110
- document.removeEventListener('pointermove', handlePointer, {
15111
- capture: true
15112
- });
15113
- };
15114
- }, []);
15115
- return /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$export$be92b6f5f03c0fe9, popperScope, /*#__PURE__*/ React.createElement($6cc32821e9371a1c$var$MenuProvider, {
15116
- scope: __scopeMenu,
15117
- open: open,
15118
- onOpenChange: handleOpenChange,
15119
- content: content,
15120
- onContentChange: setContent
15121
- }, /*#__PURE__*/ React.createElement($6cc32821e9371a1c$var$MenuRootProvider, {
15122
- scope: __scopeMenu,
15123
- onClose: React.useCallback(()=>handleOpenChange(false)
15124
- , [
15125
- handleOpenChange
15126
- ]),
15127
- isUsingKeyboardRef: isUsingKeyboardRef,
15128
- dir: direction,
15129
- modal: modal
15130
- }, children)));
15131
- };
15132
- const $6cc32821e9371a1c$export$9fa5ebd18bee4d43 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15133
- const { __scopeMenu: __scopeMenu , ...anchorProps } = props;
15134
- const popperScope = $6cc32821e9371a1c$var$usePopperScope(__scopeMenu);
15135
- return /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$export$b688253958b8dfe7, _extends({}, popperScope, anchorProps, {
15136
- ref: forwardedRef
15137
- }));
15138
- });
15139
- /* -------------------------------------------------------------------------------------------------
15140
- * MenuPortal
15141
- * -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$PORTAL_NAME = 'MenuPortal';
15142
- const [$6cc32821e9371a1c$var$PortalProvider, $6cc32821e9371a1c$var$usePortalContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$PORTAL_NAME, {
15143
- forceMount: undefined
15144
- });
15145
- /* -------------------------------------------------------------------------------------------------
15146
- * MenuContent
15147
- * -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$CONTENT_NAME = 'MenuContent';
15148
- const [$6cc32821e9371a1c$var$MenuContentProvider, $6cc32821e9371a1c$var$useMenuContentContext] = $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$CONTENT_NAME);
15149
- const $6cc32821e9371a1c$export$479f0f2f71193efe = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15150
- const portalContext = $6cc32821e9371a1c$var$usePortalContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
15151
- const { forceMount: forceMount = portalContext.forceMount , ...contentProps } = props;
15152
- const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
15153
- const rootContext = $6cc32821e9371a1c$var$useMenuRootContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
15154
- return /*#__PURE__*/ React.createElement($6cc32821e9371a1c$var$Collection.Provider, {
15155
- scope: props.__scopeMenu
15156
- }, /*#__PURE__*/ React.createElement($921a889cee6df7e8$export$99c2b779aa4e8b8b, {
15157
- present: forceMount || context.open
15158
- }, /*#__PURE__*/ React.createElement($6cc32821e9371a1c$var$Collection.Slot, {
15159
- scope: props.__scopeMenu
15160
- }, rootContext.modal ? /*#__PURE__*/ React.createElement($6cc32821e9371a1c$var$MenuRootContentModal, _extends({}, contentProps, {
15161
- ref: forwardedRef
15162
- })) : /*#__PURE__*/ React.createElement($6cc32821e9371a1c$var$MenuRootContentNonModal, _extends({}, contentProps, {
15163
- ref: forwardedRef
15164
- })))));
15165
- });
15166
- /* ---------------------------------------------------------------------------------------------- */ const $6cc32821e9371a1c$var$MenuRootContentModal = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15167
- const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
15168
- const ref = React.useRef(null);
15169
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, ref); // Hide everything from ARIA except the `MenuContent`
15170
- React.useEffect(()=>{
15171
- const content = ref.current;
15172
- if (content) return hideOthers(content);
15173
- }, []);
15174
- return /*#__PURE__*/ React.createElement($6cc32821e9371a1c$var$MenuContentImpl, _extends({}, props, {
15175
- ref: composedRefs // we make sure we're not trapping once it's been closed
15176
- ,
15177
- trapFocus: context.open // make sure to only disable pointer events when open
15178
- ,
15179
- disableOutsidePointerEvents: context.open,
15180
- disableOutsideScroll: true // When focus is trapped, a `focusout` event may still happen.
15181
- ,
15182
- onFocusOutside: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onFocusOutside, (event)=>event.preventDefault()
15183
- , {
15184
- checkForDefaultPrevented: false
15185
- }),
15186
- onDismiss: ()=>context.onOpenChange(false)
15187
- }));
15188
- });
15189
- const $6cc32821e9371a1c$var$MenuRootContentNonModal = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15190
- const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, props.__scopeMenu);
15191
- return /*#__PURE__*/ React.createElement($6cc32821e9371a1c$var$MenuContentImpl, _extends({}, props, {
15192
- ref: forwardedRef,
15193
- trapFocus: false,
15194
- disableOutsidePointerEvents: false,
15195
- disableOutsideScroll: false,
15196
- onDismiss: ()=>context.onOpenChange(false)
15197
- }));
15198
- });
15199
- /* ---------------------------------------------------------------------------------------------- */ const $6cc32821e9371a1c$var$MenuContentImpl = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15200
- const { __scopeMenu: __scopeMenu , loop: loop = false , trapFocus: trapFocus , onOpenAutoFocus: onOpenAutoFocus , onCloseAutoFocus: onCloseAutoFocus , disableOutsidePointerEvents: disableOutsidePointerEvents , onEntryFocus: onEntryFocus , onEscapeKeyDown: onEscapeKeyDown , onPointerDownOutside: onPointerDownOutside , onFocusOutside: onFocusOutside , onInteractOutside: onInteractOutside , onDismiss: onDismiss , disableOutsideScroll: disableOutsideScroll , ...contentProps } = props;
15201
- const context = $6cc32821e9371a1c$var$useMenuContext($6cc32821e9371a1c$var$CONTENT_NAME, __scopeMenu);
15202
- const rootContext = $6cc32821e9371a1c$var$useMenuRootContext($6cc32821e9371a1c$var$CONTENT_NAME, __scopeMenu);
15203
- const popperScope = $6cc32821e9371a1c$var$usePopperScope(__scopeMenu);
15204
- const rovingFocusGroupScope = $6cc32821e9371a1c$var$useRovingFocusGroupScope(__scopeMenu);
15205
- const getItems = $6cc32821e9371a1c$var$useCollection(__scopeMenu);
15206
- const [currentItemId, setCurrentItemId] = React.useState(null);
15207
- const contentRef = React.useRef(null);
15208
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, contentRef, context.onContentChange);
15209
- const timerRef = React.useRef(0);
15210
- const searchRef = React.useRef('');
15211
- const pointerGraceTimerRef = React.useRef(0);
15212
- const pointerGraceIntentRef = React.useRef(null);
15213
- const pointerDirRef = React.useRef('right');
15214
- const lastPointerXRef = React.useRef(0);
15215
- const ScrollLockWrapper = disableOutsideScroll ? $epM9y$RemoveScroll : React.Fragment;
15216
- const scrollLockWrapperProps = disableOutsideScroll ? {
15217
- as: $5e63c961fc1ce211$export$8c6ed5c666ac1360,
15218
- allowPinchZoom: true
15219
- } : undefined;
15220
- const handleTypeaheadSearch = (key)=>{
15221
- var _items$find, _items$find2;
15222
- const search = searchRef.current + key;
15223
- const items = getItems().filter((item)=>!item.disabled
15224
- );
15225
- const currentItem = document.activeElement;
15226
- const currentMatch = (_items$find = items.find((item)=>item.ref.current === currentItem
15227
- )) === null || _items$find === void 0 ? void 0 : _items$find.textValue;
15228
- const values = items.map((item)=>item.textValue
15229
- );
15230
- const nextMatch = $6cc32821e9371a1c$var$getNextMatch(values, search, currentMatch);
15231
- const newItem = (_items$find2 = items.find((item)=>item.textValue === nextMatch
15232
- )) === null || _items$find2 === void 0 ? void 0 : _items$find2.ref.current; // Reset `searchRef` 1 second after it was last updated
15233
- (function updateSearch(value) {
15234
- searchRef.current = value;
15235
- window.clearTimeout(timerRef.current);
15236
- if (value !== '') timerRef.current = window.setTimeout(()=>updateSearch('')
15237
- , 1000);
15238
- })(search);
15239
- if (newItem) /**
15240
- * Imperative focus during keydown is risky so we prevent React's batching updates
15241
- * to avoid potential bugs. See: https://github.com/facebook/react/issues/20332
15242
- */ setTimeout(()=>newItem.focus()
15243
- );
15244
- };
15245
- React.useEffect(()=>{
15246
- return ()=>window.clearTimeout(timerRef.current)
15247
- ;
15248
- }, []); // Make sure the whole tree has focus guards as our `MenuContent` may be
15249
- // the last element in the DOM (beacuse of the `Portal`)
15250
- $3db38b7d1fb3fe6a$export$b7ece24a22aeda8c();
15251
- const isPointerMovingToSubmenu = React.useCallback((event)=>{
15252
- var _pointerGraceIntentRe, _pointerGraceIntentRe2;
15253
- const isMovingTowards = pointerDirRef.current === ((_pointerGraceIntentRe = pointerGraceIntentRef.current) === null || _pointerGraceIntentRe === void 0 ? void 0 : _pointerGraceIntentRe.side);
15254
- return isMovingTowards && $6cc32821e9371a1c$var$isPointerInGraceArea(event, (_pointerGraceIntentRe2 = pointerGraceIntentRef.current) === null || _pointerGraceIntentRe2 === void 0 ? void 0 : _pointerGraceIntentRe2.area);
15255
- }, []);
15256
- return /*#__PURE__*/ React.createElement($6cc32821e9371a1c$var$MenuContentProvider, {
15257
- scope: __scopeMenu,
15258
- searchRef: searchRef,
15259
- onItemEnter: React.useCallback((event)=>{
15260
- if (isPointerMovingToSubmenu(event)) event.preventDefault();
15261
- }, [
15262
- isPointerMovingToSubmenu
15263
- ]),
15264
- onItemLeave: React.useCallback((event)=>{
15265
- var _contentRef$current;
15266
- if (isPointerMovingToSubmenu(event)) return;
15267
- (_contentRef$current = contentRef.current) === null || _contentRef$current === void 0 || _contentRef$current.focus();
15268
- setCurrentItemId(null);
15269
- }, [
15270
- isPointerMovingToSubmenu
15271
- ]),
15272
- onTriggerLeave: React.useCallback((event)=>{
15273
- if (isPointerMovingToSubmenu(event)) event.preventDefault();
15274
- }, [
15275
- isPointerMovingToSubmenu
15276
- ]),
15277
- pointerGraceTimerRef: pointerGraceTimerRef,
15278
- onPointerGraceIntentChange: React.useCallback((intent)=>{
15279
- pointerGraceIntentRef.current = intent;
15280
- }, [])
15281
- }, /*#__PURE__*/ React.createElement(ScrollLockWrapper, scrollLockWrapperProps, /*#__PURE__*/ React.createElement($d3863c46a17e8a28$export$20e40289641fbbb6, {
15282
- asChild: true,
15283
- trapped: trapFocus,
15284
- onMountAutoFocus: $e42e1063c40fb3ef$export$b9ecd428b558ff10(onOpenAutoFocus, (event)=>{
15285
- var _contentRef$current2;
15286
- // when opening, explicitly focus the content area only and leave
15287
- // `onEntryFocus` in control of focusing first item
15288
- event.preventDefault();
15289
- (_contentRef$current2 = contentRef.current) === null || _contentRef$current2 === void 0 || _contentRef$current2.focus();
15290
- }),
15291
- onUnmountAutoFocus: onCloseAutoFocus
15292
- }, /*#__PURE__*/ React.createElement($5cb92bef7577960e$export$177fb62ff3ec1f22, {
15293
- asChild: true,
15294
- disableOutsidePointerEvents: disableOutsidePointerEvents,
15295
- onEscapeKeyDown: onEscapeKeyDown,
15296
- onPointerDownOutside: onPointerDownOutside,
15297
- onFocusOutside: onFocusOutside,
15298
- onInteractOutside: onInteractOutside,
15299
- onDismiss: onDismiss
15300
- }, /*#__PURE__*/ React.createElement($d7bdfb9eb0fdf311$export$be92b6f5f03c0fe9, _extends({
15301
- asChild: true
15302
- }, rovingFocusGroupScope, {
15303
- dir: rootContext.dir,
15304
- orientation: "vertical",
15305
- loop: loop,
15306
- currentTabStopId: currentItemId,
15307
- onCurrentTabStopIdChange: setCurrentItemId,
15308
- onEntryFocus: $e42e1063c40fb3ef$export$b9ecd428b558ff10(onEntryFocus, (event)=>{
15309
- // only focus first item when using keyboard
15310
- if (!rootContext.isUsingKeyboardRef.current) event.preventDefault();
15311
- })
15312
- }), /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$export$7c6e2c02157bb7d2, _extends({
15313
- role: "menu",
15314
- "aria-orientation": "vertical",
15315
- "data-state": $6cc32821e9371a1c$var$getOpenState(context.open),
15316
- "data-radix-menu-content": "",
15317
- dir: rootContext.dir
15318
- }, popperScope, contentProps, {
15319
- ref: composedRefs,
15320
- style: {
15321
- outline: 'none',
15322
- ...contentProps.style
15323
- },
15324
- onKeyDown: $e42e1063c40fb3ef$export$b9ecd428b558ff10(contentProps.onKeyDown, (event)=>{
15325
- // submenu key events bubble through portals. We only care about keys in this menu.
15326
- const target = event.target;
15327
- const isKeyDownInside = target.closest('[data-radix-menu-content]') === event.currentTarget;
15328
- const isModifierKey = event.ctrlKey || event.altKey || event.metaKey;
15329
- const isCharacterKey = event.key.length === 1;
15330
- if (isKeyDownInside) {
15331
- // menus should not be navigated using tab key so we prevent it
15332
- if (event.key === 'Tab') event.preventDefault();
15333
- if (!isModifierKey && isCharacterKey) handleTypeaheadSearch(event.key);
15334
- } // focus first/last item based on key pressed
15335
- const content = contentRef.current;
15336
- if (event.target !== content) return;
15337
- if (!$6cc32821e9371a1c$var$FIRST_LAST_KEYS.includes(event.key)) return;
15338
- event.preventDefault();
15339
- const items = getItems().filter((item)=>!item.disabled
15340
- );
15341
- const candidateNodes = items.map((item)=>item.ref.current
15342
- );
15343
- if ($6cc32821e9371a1c$var$LAST_KEYS.includes(event.key)) candidateNodes.reverse();
15344
- $6cc32821e9371a1c$var$focusFirst(candidateNodes);
15345
- }),
15346
- onBlur: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onBlur, (event)=>{
15347
- // clear search buffer when leaving the menu
15348
- if (!event.currentTarget.contains(event.target)) {
15349
- window.clearTimeout(timerRef.current);
15350
- searchRef.current = '';
15351
- }
15352
- }),
15353
- onPointerMove: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerMove, $6cc32821e9371a1c$var$whenMouse((event)=>{
15354
- const target = event.target;
15355
- const pointerXHasChanged = lastPointerXRef.current !== event.clientX; // We don't use `event.movementX` for this check because Safari will
15356
- // always return `0` on a pointer event.
15357
- if (event.currentTarget.contains(target) && pointerXHasChanged) {
15358
- const newDir = event.clientX > lastPointerXRef.current ? 'right' : 'left';
15359
- pointerDirRef.current = newDir;
15360
- lastPointerXRef.current = event.clientX;
15361
- }
15362
- }))
15363
- })))))));
15364
- });
15365
- /* -------------------------------------------------------------------------------------------------
15366
- * MenuItem
15367
- * -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$ITEM_NAME = 'MenuItem';
15368
- const $6cc32821e9371a1c$var$ITEM_SELECT = 'menu.itemSelect';
15369
- const $6cc32821e9371a1c$export$2ce376c2cc3355c8 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15370
- const { disabled: disabled = false , onSelect: onSelect , ...itemProps } = props;
15371
- const ref = React.useRef(null);
15372
- const rootContext = $6cc32821e9371a1c$var$useMenuRootContext($6cc32821e9371a1c$var$ITEM_NAME, props.__scopeMenu);
15373
- const contentContext = $6cc32821e9371a1c$var$useMenuContentContext($6cc32821e9371a1c$var$ITEM_NAME, props.__scopeMenu);
15374
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, ref);
15375
- const isPointerDownRef = React.useRef(false);
15376
- const handleSelect = ()=>{
15377
- const menuItem = ref.current;
15378
- if (!disabled && menuItem) {
15379
- const itemSelectEvent = new CustomEvent($6cc32821e9371a1c$var$ITEM_SELECT, {
15380
- bubbles: true,
15381
- cancelable: true
15382
- });
15383
- menuItem.addEventListener($6cc32821e9371a1c$var$ITEM_SELECT, (event)=>onSelect === null || onSelect === void 0 ? void 0 : onSelect(event)
15384
- , {
15385
- once: true
15386
- });
15387
- $8927f6f2acc4f386$export$6d1a0317bde7de7f(menuItem, itemSelectEvent);
15388
- if (itemSelectEvent.defaultPrevented) isPointerDownRef.current = false;
15389
- else rootContext.onClose();
15390
- }
15391
- };
15392
- return /*#__PURE__*/ React.createElement($6cc32821e9371a1c$var$MenuItemImpl, _extends({}, itemProps, {
15393
- ref: composedRefs,
15394
- disabled: disabled,
15395
- onClick: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onClick, handleSelect),
15396
- onPointerDown: (event)=>{
15397
- var _props$onPointerDown;
15398
- (_props$onPointerDown = props.onPointerDown) === null || _props$onPointerDown === void 0 || _props$onPointerDown.call(props, event);
15399
- isPointerDownRef.current = true;
15400
- },
15401
- onPointerUp: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerUp, (event)=>{
15402
- var _event$currentTarget;
15403
- // Pointer down can move to a different menu item which should activate it on pointer up.
15404
- // We dispatch a click for selection to allow composition with click based triggers and to
15405
- // prevent Firefox from getting stuck in text selection mode when the menu closes.
15406
- if (!isPointerDownRef.current) (_event$currentTarget = event.currentTarget) === null || _event$currentTarget === void 0 || _event$currentTarget.click();
15407
- }),
15408
- onKeyDown: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onKeyDown, (event)=>{
15409
- const isTypingAhead = contentContext.searchRef.current !== '';
15410
- if (disabled || isTypingAhead && event.key === ' ') return;
15411
- if ($6cc32821e9371a1c$var$SELECTION_KEYS.includes(event.key)) {
15412
- event.currentTarget.click();
15413
- /**
15414
- * We prevent default browser behaviour for selection keys as they should trigger
15415
- * a selection only:
15416
- * - prevents space from scrolling the page.
15417
- * - if keydown causes focus to move, prevents keydown from firing on the new target.
15418
- */ event.preventDefault();
15419
- }
15420
- })
15421
- }));
15422
- });
15423
- /* ---------------------------------------------------------------------------------------------- */ const $6cc32821e9371a1c$var$MenuItemImpl = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15424
- const { __scopeMenu: __scopeMenu , disabled: disabled = false , textValue: textValue , ...itemProps } = props;
15425
- const contentContext = $6cc32821e9371a1c$var$useMenuContentContext($6cc32821e9371a1c$var$ITEM_NAME, __scopeMenu);
15426
- const rovingFocusGroupScope = $6cc32821e9371a1c$var$useRovingFocusGroupScope(__scopeMenu);
15427
- const ref = React.useRef(null);
15428
- const composedRefs = $6ed0406888f73fc4$export$c7b2cbe3552a0d05(forwardedRef, ref);
15429
- const [isFocused, setIsFocused] = React.useState(false); // get the item's `.textContent` as default strategy for typeahead `textValue`
15430
- const [textContent, setTextContent] = React.useState('');
15431
- React.useEffect(()=>{
15432
- const menuItem = ref.current;
15433
- if (menuItem) {
15434
- var _menuItem$textContent;
15435
- setTextContent(((_menuItem$textContent = menuItem.textContent) !== null && _menuItem$textContent !== void 0 ? _menuItem$textContent : '').trim());
15436
- }
15437
- }, [
15438
- itemProps.children
15439
- ]);
15440
- return /*#__PURE__*/ React.createElement($6cc32821e9371a1c$var$Collection.ItemSlot, {
15441
- scope: __scopeMenu,
15442
- disabled: disabled,
15443
- textValue: textValue !== null && textValue !== void 0 ? textValue : textContent
15444
- }, /*#__PURE__*/ React.createElement($d7bdfb9eb0fdf311$export$6d08773d2e66f8f2, _extends({
15445
- asChild: true
15446
- }, rovingFocusGroupScope, {
15447
- focusable: !disabled
15448
- }), /*#__PURE__*/ React.createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends({
15449
- role: "menuitem",
15450
- "data-highlighted": isFocused ? '' : undefined,
15451
- "aria-disabled": disabled || undefined,
15452
- "data-disabled": disabled ? '' : undefined
15453
- }, itemProps, {
15454
- ref: composedRefs,
15455
- onPointerMove: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerMove, $6cc32821e9371a1c$var$whenMouse((event)=>{
15456
- if (disabled) contentContext.onItemLeave(event);
15457
- else {
15458
- contentContext.onItemEnter(event);
15459
- if (!event.defaultPrevented) {
15460
- const item = event.currentTarget;
15461
- item.focus();
15462
- }
15463
- }
15464
- })),
15465
- onPointerLeave: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerLeave, $6cc32821e9371a1c$var$whenMouse((event)=>contentContext.onItemLeave(event)
15466
- )),
15467
- onFocus: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onFocus, ()=>setIsFocused(true)
15468
- ),
15469
- onBlur: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onBlur, ()=>setIsFocused(false)
15470
- )
15471
- }))));
15472
- });
15473
- /* -------------------------------------------------------------------------------------------------
15474
- * MenuRadioGroup
15475
- * -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$RADIO_GROUP_NAME = 'MenuRadioGroup';
15476
- $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$RADIO_GROUP_NAME, {
15477
- value: undefined,
15478
- onValueChange: ()=>{}
15479
- });
15480
- /* -------------------------------------------------------------------------------------------------
15481
- * MenuItemIndicator
15482
- * -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$ITEM_INDICATOR_NAME = 'MenuItemIndicator';
15483
- $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$ITEM_INDICATOR_NAME, {
15484
- checked: false
15485
- });
15486
- const $6cc32821e9371a1c$export$1cec7dcdd713e220 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15487
- const { __scopeMenu: __scopeMenu , ...separatorProps } = props;
15488
- return /*#__PURE__*/ React.createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.div, _extends({
15489
- role: "separator",
15490
- "aria-orientation": "horizontal"
15491
- }, separatorProps, {
15492
- ref: forwardedRef
15493
- }));
15494
- });
15495
- const $6cc32821e9371a1c$export$bcdda4773debf5fa = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15496
- const { __scopeMenu: __scopeMenu , ...arrowProps } = props;
15497
- const popperScope = $6cc32821e9371a1c$var$usePopperScope(__scopeMenu);
15498
- return /*#__PURE__*/ React.createElement($cf1ac5d9fe0e8206$export$21b07c8f274aebd5, _extends({}, popperScope, arrowProps, {
15499
- ref: forwardedRef
15500
- }));
15501
- });
15502
- /* -------------------------------------------------------------------------------------------------
15503
- * MenuSub
15504
- * -----------------------------------------------------------------------------------------------*/ const $6cc32821e9371a1c$var$SUB_NAME = 'MenuSub';
15505
- $6cc32821e9371a1c$var$createMenuContext($6cc32821e9371a1c$var$SUB_NAME);
15506
- /* -----------------------------------------------------------------------------------------------*/ function $6cc32821e9371a1c$var$getOpenState(open) {
15507
- return open ? 'open' : 'closed';
15508
- }
15509
- function $6cc32821e9371a1c$var$focusFirst(candidates) {
15510
- const PREVIOUSLY_FOCUSED_ELEMENT = document.activeElement;
15511
- for (const candidate of candidates){
15512
- // if focus is already where we want to go, we don't want to keep going through the candidates
15513
- if (candidate === PREVIOUSLY_FOCUSED_ELEMENT) return;
15514
- candidate.focus();
15515
- if (document.activeElement !== PREVIOUSLY_FOCUSED_ELEMENT) return;
15516
- }
15517
- }
15518
- /**
15519
- * Wraps an array around itself at a given start index
15520
- * Example: `wrapArray(['a', 'b', 'c', 'd'], 2) === ['c', 'd', 'a', 'b']`
15521
- */ function $6cc32821e9371a1c$var$wrapArray(array, startIndex) {
15522
- return array.map((_, index)=>array[(startIndex + index) % array.length]
15523
- );
15524
- }
15525
- /**
15526
- * This is the "meat" of the typeahead matching logic. It takes in all the values,
15527
- * the search and the current match, and returns the next match (or `undefined`).
15528
- *
15529
- * We normalize the search because if a user has repeatedly pressed a character,
15530
- * we want the exact same behavior as if we only had that one character
15531
- * (ie. cycle through options starting with that character)
15532
- *
15533
- * We also reorder the values by wrapping the array around the current match.
15534
- * This is so we always look forward from the current match, and picking the first
15535
- * match will always be the correct one.
15536
- *
15537
- * Finally, if the normalized search is exactly one character, we exclude the
15538
- * current match from the values because otherwise it would be the first to match always
15539
- * and focus would never move. This is as opposed to the regular case, where we
15540
- * don't want focus to move if the current match still matches.
15541
- */ function $6cc32821e9371a1c$var$getNextMatch(values, search, currentMatch) {
15542
- const isRepeated = search.length > 1 && Array.from(search).every((char)=>char === search[0]
15543
- );
15544
- const normalizedSearch = isRepeated ? search[0] : search;
15545
- const currentMatchIndex = currentMatch ? values.indexOf(currentMatch) : -1;
15546
- let wrappedValues = $6cc32821e9371a1c$var$wrapArray(values, Math.max(currentMatchIndex, 0));
15547
- const excludeCurrentMatch = normalizedSearch.length === 1;
15548
- if (excludeCurrentMatch) wrappedValues = wrappedValues.filter((v)=>v !== currentMatch
15549
- );
15550
- const nextMatch = wrappedValues.find((value)=>value.toLowerCase().startsWith(normalizedSearch.toLowerCase())
15551
- );
15552
- return nextMatch !== currentMatch ? nextMatch : undefined;
15553
- }
15554
- // Determine if a point is inside of a polygon.
15555
- // Based on https://github.com/substack/point-in-polygon
15556
- function $6cc32821e9371a1c$var$isPointInPolygon(point, polygon) {
15557
- const { x: x , y: y } = point;
15558
- let inside = false;
15559
- for(let i = 0, j = polygon.length - 1; i < polygon.length; j = i++){
15560
- const xi = polygon[i].x;
15561
- const yi = polygon[i].y;
15562
- const xj = polygon[j].x;
15563
- const yj = polygon[j].y; // prettier-ignore
15564
- const intersect = yi > y !== yj > y && x < (xj - xi) * (y - yi) / (yj - yi) + xi;
15565
- if (intersect) inside = !inside;
15566
- }
15567
- return inside;
15568
- }
15569
- function $6cc32821e9371a1c$var$isPointerInGraceArea(event, area) {
15570
- if (!area) return false;
15571
- const cursorPos = {
15572
- x: event.clientX,
15573
- y: event.clientY
15574
- };
15575
- return $6cc32821e9371a1c$var$isPointInPolygon(cursorPos, area);
15576
- }
15577
- function $6cc32821e9371a1c$var$whenMouse(handler) {
15578
- return (event)=>event.pointerType === 'mouse' ? handler(event) : undefined
15579
- ;
15580
- }
15581
- const $6cc32821e9371a1c$export$be92b6f5f03c0fe9 = $6cc32821e9371a1c$export$d9b273488cd8ce6f;
15582
- const $6cc32821e9371a1c$export$b688253958b8dfe7 = $6cc32821e9371a1c$export$9fa5ebd18bee4d43;
15583
- const $6cc32821e9371a1c$export$7c6e2c02157bb7d2 = $6cc32821e9371a1c$export$479f0f2f71193efe;
15584
- const $6cc32821e9371a1c$export$6d08773d2e66f8f2 = $6cc32821e9371a1c$export$2ce376c2cc3355c8;
15585
- const $6cc32821e9371a1c$export$1ff3c3f08ae963c0 = $6cc32821e9371a1c$export$1cec7dcdd713e220;
15586
- const $6cc32821e9371a1c$export$21b07c8f274aebd5 = $6cc32821e9371a1c$export$bcdda4773debf5fa;
15587
-
15588
- /* -------------------------------------------------------------------------------------------------
15589
- * DropdownMenu
15590
- * -----------------------------------------------------------------------------------------------*/ const $d08ef79370b62062$var$DROPDOWN_MENU_NAME = 'DropdownMenu';
15591
- const [$d08ef79370b62062$var$createDropdownMenuContext, $d08ef79370b62062$export$c0623cd925aeb687] = $c512c27ab02ef895$export$50c7b4e9d9f19c1($d08ef79370b62062$var$DROPDOWN_MENU_NAME, [
15592
- $6cc32821e9371a1c$export$4027731b685e72eb
15593
- ]);
15594
- const $d08ef79370b62062$var$useMenuScope = $6cc32821e9371a1c$export$4027731b685e72eb();
15595
- const [$d08ef79370b62062$var$DropdownMenuProvider, $d08ef79370b62062$var$useDropdownMenuContext] = $d08ef79370b62062$var$createDropdownMenuContext($d08ef79370b62062$var$DROPDOWN_MENU_NAME);
15596
- const $d08ef79370b62062$export$e44a253a59704894 = (props)=>{
15597
- const { __scopeDropdownMenu: __scopeDropdownMenu , children: children , dir: dir , open: openProp , defaultOpen: defaultOpen , onOpenChange: onOpenChange , modal: modal = true } = props;
15598
- const menuScope = $d08ef79370b62062$var$useMenuScope(__scopeDropdownMenu);
15599
- const triggerRef = React.useRef(null);
15600
- const [open = false, setOpen] = $71cd76cc60e0454e$export$6f32135080cb4c3({
15601
- prop: openProp,
15602
- defaultProp: defaultOpen,
15603
- onChange: onOpenChange
15604
- });
15605
- return /*#__PURE__*/ React.createElement($d08ef79370b62062$var$DropdownMenuProvider, {
15606
- scope: __scopeDropdownMenu,
15607
- triggerId: $1746a345f3d73bb7$export$f680877a34711e37(),
15608
- triggerRef: triggerRef,
15609
- contentId: $1746a345f3d73bb7$export$f680877a34711e37(),
15610
- open: open,
15611
- onOpenChange: setOpen,
15612
- onOpenToggle: React.useCallback(()=>setOpen((prevOpen)=>!prevOpen
15613
- )
15614
- , [
15615
- setOpen
15616
- ]),
15617
- modal: modal
15618
- }, /*#__PURE__*/ React.createElement($6cc32821e9371a1c$export$be92b6f5f03c0fe9, _extends({}, menuScope, {
15619
- open: open,
15620
- onOpenChange: setOpen,
15621
- dir: dir,
15622
- modal: modal
15623
- }), children));
15624
- };
15625
- /* -------------------------------------------------------------------------------------------------
15626
- * DropdownMenuTrigger
15627
- * -----------------------------------------------------------------------------------------------*/ const $d08ef79370b62062$var$TRIGGER_NAME = 'DropdownMenuTrigger';
15628
- const $d08ef79370b62062$export$d2469213b3befba9 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15629
- const { __scopeDropdownMenu: __scopeDropdownMenu , disabled: disabled = false , ...triggerProps } = props;
15630
- const context = $d08ef79370b62062$var$useDropdownMenuContext($d08ef79370b62062$var$TRIGGER_NAME, __scopeDropdownMenu);
15631
- const menuScope = $d08ef79370b62062$var$useMenuScope(__scopeDropdownMenu);
15632
- return /*#__PURE__*/ React.createElement($6cc32821e9371a1c$export$b688253958b8dfe7, _extends({
15633
- asChild: true
15634
- }, menuScope), /*#__PURE__*/ React.createElement($8927f6f2acc4f386$export$250ffa63cdc0d034.button, _extends({
15635
- type: "button",
15636
- id: context.triggerId,
15637
- "aria-haspopup": "menu",
15638
- "aria-expanded": context.open,
15639
- "aria-controls": context.open ? context.contentId : undefined,
15640
- "data-state": context.open ? 'open' : 'closed',
15641
- "data-disabled": disabled ? '' : undefined,
15642
- disabled: disabled
15643
- }, triggerProps, {
15644
- ref: $6ed0406888f73fc4$export$43e446d32b3d21af(forwardedRef, context.triggerRef),
15645
- onPointerDown: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onPointerDown, (event)=>{
15646
- // only call handler if it's the left button (mousedown gets triggered by all mouse buttons)
15647
- // but not when the control key is pressed (avoiding MacOS right click)
15648
- if (!disabled && event.button === 0 && event.ctrlKey === false) {
15649
- context.onOpenToggle(); // prevent trigger focusing when opening
15650
- // this allows the content to be given focus without competition
15651
- if (!context.open) event.preventDefault();
15652
- }
15653
- }),
15654
- onKeyDown: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onKeyDown, (event)=>{
15655
- if (disabled) return;
15656
- if ([
15657
- 'Enter',
15658
- ' '
15659
- ].includes(event.key)) context.onOpenToggle();
15660
- if (event.key === 'ArrowDown') context.onOpenChange(true); // prevent keydown from scrolling window / first focused item to execute
15661
- // that keydown (inadvertently closing the menu)
15662
- if ([
15663
- 'Enter',
15664
- ' ',
15665
- 'ArrowDown'
15666
- ].includes(event.key)) event.preventDefault();
15667
- })
15668
- })));
15669
- });
15670
- /* -------------------------------------------------------------------------------------------------
15671
- * DropdownMenuContent
15672
- * -----------------------------------------------------------------------------------------------*/ const $d08ef79370b62062$var$CONTENT_NAME = 'DropdownMenuContent';
15673
- const $d08ef79370b62062$export$6e76d93a37c01248 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15674
- const { __scopeDropdownMenu: __scopeDropdownMenu , ...contentProps } = props;
15675
- const context = $d08ef79370b62062$var$useDropdownMenuContext($d08ef79370b62062$var$CONTENT_NAME, __scopeDropdownMenu);
15676
- const menuScope = $d08ef79370b62062$var$useMenuScope(__scopeDropdownMenu);
15677
- const hasInteractedOutsideRef = React.useRef(false);
15678
- return /*#__PURE__*/ React.createElement($6cc32821e9371a1c$export$7c6e2c02157bb7d2, _extends({
15679
- id: context.contentId,
15680
- "aria-labelledby": context.triggerId
15681
- }, menuScope, contentProps, {
15682
- ref: forwardedRef,
15683
- onCloseAutoFocus: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onCloseAutoFocus, (event)=>{
15684
- var _context$triggerRef$c;
15685
- if (!hasInteractedOutsideRef.current) (_context$triggerRef$c = context.triggerRef.current) === null || _context$triggerRef$c === void 0 || _context$triggerRef$c.focus();
15686
- hasInteractedOutsideRef.current = false; // Always prevent auto focus because we either focus manually or want user agent focus
15687
- event.preventDefault();
15688
- }),
15689
- onInteractOutside: $e42e1063c40fb3ef$export$b9ecd428b558ff10(props.onInteractOutside, (event)=>{
15690
- const originalEvent = event.detail.originalEvent;
15691
- const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true;
15692
- const isRightClick = originalEvent.button === 2 || ctrlLeftClick;
15693
- if (!context.modal || isRightClick) hasInteractedOutsideRef.current = true;
15694
- }),
15695
- style: {
15696
- ...props.style,
15697
- '--radix-dropdown-menu-content-transform-origin': 'var(--radix-popper-transform-origin)',
15698
- '--radix-dropdown-menu-content-available-width': 'var(--radix-popper-available-width)',
15699
- '--radix-dropdown-menu-content-available-height': 'var(--radix-popper-available-height)',
15700
- '--radix-dropdown-menu-trigger-width': 'var(--radix-popper-anchor-width)',
15701
- '--radix-dropdown-menu-trigger-height': 'var(--radix-popper-anchor-height)'
15702
- }
15703
- }));
15704
- });
15705
- const $d08ef79370b62062$export$ed97964d1871885d = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15706
- const { __scopeDropdownMenu: __scopeDropdownMenu , ...itemProps } = props;
15707
- const menuScope = $d08ef79370b62062$var$useMenuScope(__scopeDropdownMenu);
15708
- return /*#__PURE__*/ React.createElement($6cc32821e9371a1c$export$6d08773d2e66f8f2, _extends({}, menuScope, itemProps, {
15709
- ref: forwardedRef
15710
- }));
15711
- });
15712
- const $d08ef79370b62062$export$da160178fd3bc7e9 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15713
- const { __scopeDropdownMenu: __scopeDropdownMenu , ...separatorProps } = props;
15714
- const menuScope = $d08ef79370b62062$var$useMenuScope(__scopeDropdownMenu);
15715
- return /*#__PURE__*/ React.createElement($6cc32821e9371a1c$export$1ff3c3f08ae963c0, _extends({}, menuScope, separatorProps, {
15716
- ref: forwardedRef
15717
- }));
15718
- });
15719
- const $d08ef79370b62062$export$34b8980744021ec5 = /*#__PURE__*/ React.forwardRef((props, forwardedRef)=>{
15720
- const { __scopeDropdownMenu: __scopeDropdownMenu , ...arrowProps } = props;
15721
- const menuScope = $d08ef79370b62062$var$useMenuScope(__scopeDropdownMenu);
15722
- return /*#__PURE__*/ React.createElement($6cc32821e9371a1c$export$21b07c8f274aebd5, _extends({}, menuScope, arrowProps, {
15723
- ref: forwardedRef
15724
- }));
15725
- });
15726
- /* -----------------------------------------------------------------------------------------------*/ const $d08ef79370b62062$export$be92b6f5f03c0fe9 = $d08ef79370b62062$export$e44a253a59704894;
15727
- const $d08ef79370b62062$export$41fb9f06171c75f4 = $d08ef79370b62062$export$d2469213b3befba9;
15728
- const $d08ef79370b62062$export$7c6e2c02157bb7d2 = $d08ef79370b62062$export$6e76d93a37c01248;
15729
- const $d08ef79370b62062$export$6d08773d2e66f8f2 = $d08ef79370b62062$export$ed97964d1871885d;
15730
- const $d08ef79370b62062$export$1ff3c3f08ae963c0 = $d08ef79370b62062$export$da160178fd3bc7e9;
15731
- const $d08ef79370b62062$export$21b07c8f274aebd5 = $d08ef79370b62062$export$34b8980744021ec5;
15732
-
15733
- const borderStyles = [
15734
- 'tw-border-solid',
15735
- 'tw-border',
15736
- 'tw-rounded-sm',
15737
- 'tw-border-sq-light-gray',
15738
- 'dark:tw-border-gray-700',
15739
- ].join(' ');
15740
- const bgStyles = ['tw-bg-sq-white', 'dark:tw-bg-sq-dark-background'].join(' ');
15741
- const disabledClasses = ['tw-opacity-50', 'tw-cursor-not-allowed'].join(' ');
15742
- const ButtonWithDropdown = ({ dropdownItems, triggerIcon, tooltipText, id, extraClassNames, testId, tooltipTestId, tooltipDelay, tooltipPlacement, disabled = false, align = 'end', placement = 'bottom', placementOffset = 2, alignOffset = -5, hasArrow = false, onOpenChange, isHtmlTooltip = false, isOpen, }) => {
15743
- let tooltipData = undefined;
15744
- if (tooltipText) {
15745
- tooltipData = {
15746
- 'data-qtip-text': tooltipText,
15747
- 'data-qtip-placement': tooltipPlacement,
15748
- 'data-qtip-is-html': isHtmlTooltip,
15749
- 'data-qtip-testid': tooltipTestId,
15750
- 'data-qtip-delay': tooltipDelay ?? DEFAULT_TOOL_TIP_DELAY,
15751
- };
15752
- }
15753
- return (React__namespace.createElement($d08ef79370b62062$export$be92b6f5f03c0fe9, { defaultOpen: false, open: isOpen, onOpenChange: onOpenChange },
15754
- React__namespace.createElement($d08ef79370b62062$export$41fb9f06171c75f4, { id: id, className: `tw-border-none focus-visible:tw-outline-none focus:tw-outline-none focus-within:tw-outline-none`, disabled: disabled, "data-testid": testId },
15755
- React__namespace.createElement("div", { ...tooltipData, className: `tw-bg-transparent tw-flex tw-flex-col tw-items-center focus-visible:tw-outline-none focus:tw-outline-none focus-within:tw-outline-none ${disabled ? disabledClasses : ''} ${extraClassNames || ''}` }, triggerIcon)),
15756
- React__namespace.createElement($d08ef79370b62062$export$7c6e2c02157bb7d2, { sideOffset: placementOffset, side: placement, align: align, alignOffset: alignOffset, asChild: true, className: "focus-visible:tw-outline-none tw-outline-none" },
15757
- React__namespace.createElement("div", { className: bgStyles +
15758
- ' tw-relative tw-z-[1000] tw-min-w-6 focus-visible:tw-outline-none tw-outline-none data-[state=open]:tw-animate-in data-[state=closed]:tw-animate-out' +
15759
- ' forceFont data-[side=top]:tw-animate-slideDownAndFade data-[side=right]:tw-animate-slideLeftAndFade data-[side=bottom]:tw-animate-slideUpAndFade data-[side=left]:tw-animate-slideRightAndFade ' +
15760
- borderStyles },
15761
- hasArrow && (React__namespace.createElement($d08ef79370b62062$export$21b07c8f274aebd5, { asChild: true },
15762
- React__namespace.createElement("div", { className: " tw-fill-transparent tw-bg-white tw-w-[6px] tw-h-[6px] tw-rotate-45 dark:tw-bg-sq-dark-background tw-border-b tw-border-r tw-border-sq-light-gray dark:tw-border-gray-700 tw-mt-[-2px]" }))),
15763
- dropdownItems.map((item, index) => (React__namespace.createElement("div", { key: item.label + index },
15764
- React__namespace.createElement($d08ef79370b62062$export$6d08773d2e66f8f2, { key: item.label + index, onSelect: (e) => {
15765
- item.onClick(e);
15766
- }, className: `tw-cursor-pointer tw-flex dark:tw-text-sq-white hover:tw-bg-sq-colored-hover hover:dark:tw-bg-sq-colored-hover-dark tw-leading-none tw-items-center tw-h-[27px] tw-px-[19px] tw-relative tw-select-none tw-outline-none data-[disabled]:tw-text-sq-disabled-gray data-[disabled]:tw-pointer-events-none ${item.containerExtraClassNames || ''}`, "data-testid": item.testId, disabled: item.disabled },
15767
- item.icon && (React__namespace.createElement(Icon, { icon: item.icon, testId: item.iconTestId, type: "text", extraClassNames: "tw-text-sq-text-color dark:tw-text-sq-white tw-w-[18px]" })),
15768
- React__namespace.createElement("div", { "data-testid": item.labelTestId, className: "tw-text-[13px] tw-ml-1" }, item.label)),
15769
- item.hasDivider && (React__namespace.createElement($d08ef79370b62062$export$1ff3c3f08ae963c0, { "data-testid": `dropdown-divider-${index}`, className: "tw-h-[1px] tw-bg-sq-light-gray dark:tw-bg-gray-700 tw-my-[8px]" })))))))));
15770
- };
15771
-
15772
14937
  exports.Accordion = Accordion;
15773
14938
  exports.Button = Button;
15774
- exports.ButtonWithDropdown = ButtonWithDropdown;
15775
- exports.ButtonWithPopover = ButtonWithPopover;
15776
14939
  exports.Checkbox = Checkbox;
15777
14940
  exports.Icon = Icon;
15778
14941
  exports.Modal = Modal;