@economic/taco 1.1.8 → 1.1.9-alpha.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.
- package/dist/esm/components/Badge/Badge.js +14 -14
- package/dist/esm/components/Badge/Badge.js.map +1 -1
- package/dist/esm/components/Calendar/Calendar.js +56 -71
- package/dist/esm/components/Calendar/Calendar.js.map +1 -1
- package/dist/esm/components/Card/Card.js +14 -12
- package/dist/esm/components/Card/Card.js.map +1 -1
- package/dist/esm/components/Checkbox/Checkbox.js +15 -18
- package/dist/esm/components/Checkbox/Checkbox.js.map +1 -1
- package/dist/esm/components/Combobox/Combobox.js +23 -25
- package/dist/esm/components/Combobox/Combobox.js.map +1 -1
- package/dist/esm/components/Datepicker/Datepicker.js +48 -52
- package/dist/esm/components/Datepicker/Datepicker.js.map +1 -1
- package/dist/esm/components/Dialog/Dialog.js +39 -58
- package/dist/esm/components/Dialog/Dialog.js.map +1 -1
- package/dist/esm/components/Field/Field.js +10 -12
- package/dist/esm/components/Field/Field.js.map +1 -1
- package/dist/esm/components/Form/Form.js +6 -8
- package/dist/esm/components/Form/Form.js.map +1 -1
- package/dist/esm/components/Group/Group.js +6 -8
- package/dist/esm/components/Group/Group.js.map +1 -1
- package/dist/esm/components/Hanger/Hanger.js +27 -35
- package/dist/esm/components/Hanger/Hanger.js.map +1 -1
- package/dist/esm/components/HoverCard/HoverCard.js +8 -9
- package/dist/esm/components/HoverCard/HoverCard.js.map +1 -1
- package/dist/esm/components/Icon/Icon.js +7 -8
- package/dist/esm/components/Icon/Icon.js.map +1 -1
- package/dist/esm/components/IconButton/IconButton.js +9 -11
- package/dist/esm/components/IconButton/IconButton.js.map +1 -1
- package/dist/esm/components/Input/Input.js +25 -25
- package/dist/esm/components/Input/Input.js.map +1 -1
- package/dist/esm/components/Listbox/Listbox.js +24 -25
- package/dist/esm/components/Listbox/Listbox.js.map +1 -1
- package/dist/esm/components/Menu/Menu.js +16 -34
- package/dist/esm/components/Menu/Menu.js.map +1 -1
- package/dist/esm/components/Navigation/Navigation.js +35 -44
- package/dist/esm/components/Navigation/Navigation.js.map +1 -1
- package/dist/esm/components/Pagination/Pagination.js +39 -56
- package/dist/esm/components/Pagination/Pagination.js.map +1 -1
- package/dist/esm/components/Popover/Popover.js +29 -34
- package/dist/esm/components/Popover/Popover.js.map +1 -1
- package/dist/esm/components/Progress/Progress.js +11 -15
- package/dist/esm/components/Progress/Progress.js.map +1 -1
- package/dist/esm/components/Provider/Provider.js +13 -18
- package/dist/esm/components/Provider/Provider.js.map +1 -1
- package/dist/esm/components/RadioGroup/RadioGroup.js +45 -57
- package/dist/esm/components/RadioGroup/RadioGroup.js.map +1 -1
- package/dist/esm/components/SearchInput/SearchInput.js +11 -11
- package/dist/esm/components/SearchInput/SearchInput.js.map +1 -1
- package/dist/esm/components/Select/Select.js +30 -31
- package/dist/esm/components/Select/Select.js.map +1 -1
- package/dist/esm/components/Spinner/Spinner.js +12 -19
- package/dist/esm/components/Spinner/Spinner.js.map +1 -1
- package/dist/esm/components/Switch/Switch.js +9 -10
- package/dist/esm/components/Switch/Switch.js.map +1 -1
- package/dist/esm/components/Tabs/Tabs.js +25 -27
- package/dist/esm/components/Tabs/Tabs.js.map +1 -1
- package/dist/esm/components/Textarea/Textarea.js +11 -9
- package/dist/esm/components/Textarea/Textarea.js.map +1 -1
- package/dist/esm/components/Toast/Toaster.js +88 -118
- package/dist/esm/components/Toast/Toaster.js.map +1 -1
- package/dist/esm/components/Tooltip/Tooltip.js +7 -8
- package/dist/esm/components/Tooltip/Tooltip.js.map +1 -1
- package/dist/esm/components/Tour/Tour.js +44 -50
- package/dist/esm/components/Tour/Tour.js.map +1 -1
- package/dist/esm/components/Treeview/Treeview.js +26 -36
- package/dist/esm/components/Treeview/Treeview.js.map +1 -1
- package/dist/esm/components/VisuallyHidden/VisuallyHidden.js +1 -1
- package/dist/esm/components/VisuallyHidden/VisuallyHidden.js.map +1 -1
- package/dist/esm/index.js +1 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/utils/hooks/useProxiedRef.js +3 -3
- package/dist/esm/utils/hooks/useProxiedRef.js.map +1 -1
- package/dist/index.d.ts +1 -0
- package/dist/taco.cjs.development.js +789 -944
- package/dist/taco.cjs.development.js.map +1 -1
- package/dist/taco.cjs.production.min.js +1 -1
- package/dist/taco.cjs.production.min.js.map +1 -1
- package/package.json +130 -131
- package/tailwind.config.js +5 -0
@@ -3188,17 +3188,17 @@ const icons = {
|
|
3188
3188
|
zoom: Zoom
|
3189
3189
|
};
|
3190
3190
|
|
3191
|
-
|
3192
|
-
var Icon = /*#__PURE__*/React__default.forwardRef(function Icon(props, ref) {
|
3191
|
+
const Icon = /*#__PURE__*/React__default.forwardRef(function Icon(props, ref) {
|
3193
3192
|
var _props$className;
|
3194
3193
|
|
3195
|
-
|
3196
|
-
|
3197
|
-
|
3198
|
-
|
3194
|
+
const {
|
3195
|
+
name,
|
3196
|
+
...otherProps
|
3197
|
+
} = props;
|
3198
|
+
const Component = icons[name];
|
3199
3199
|
/* 24x24 _at the base body font_ - must be em so that they scale with font size - tailwind spacing uses rem */
|
3200
3200
|
|
3201
|
-
|
3201
|
+
const className = cn('inline-flex h-[1.715em] w-[1.715em] flex-shrink-0', props.className, {
|
3202
3202
|
'p-[3px]': (_props$className = props.className) === null || _props$className === void 0 ? void 0 : _props$className.includes('rounded-full')
|
3203
3203
|
});
|
3204
3204
|
return Component ? React__default.createElement(Component, Object.assign({}, otherProps, {
|
@@ -3210,7 +3210,7 @@ var Icon = /*#__PURE__*/React__default.forwardRef(function Icon(props, ref) {
|
|
3210
3210
|
})) : null;
|
3211
3211
|
});
|
3212
3212
|
|
3213
|
-
var _excluded
|
3213
|
+
var _excluded = ["id"],
|
3214
3214
|
_excluded2 = ["id", "defaultId", "onChange", "as"];
|
3215
3215
|
var AccordionContext = /*#__PURE__*/React__default.createContext({
|
3216
3216
|
as: 'h2'
|
@@ -3248,7 +3248,7 @@ var Content = /*#__PURE__*/React__default.forwardRef(function AccordionContent(p
|
|
3248
3248
|
|
3249
3249
|
var Item = function Item(props) {
|
3250
3250
|
var id = props.id,
|
3251
|
-
otherProps = _objectWithoutPropertiesLoose(props, _excluded
|
3251
|
+
otherProps = _objectWithoutPropertiesLoose(props, _excluded);
|
3252
3252
|
|
3253
3253
|
return React__default.createElement(AccordionPrimitive.Item, Object.assign({}, otherProps, {
|
3254
3254
|
value: id
|
@@ -3303,7 +3303,7 @@ var Backdrop = /*#__PURE__*/React.forwardRef(function Backdrop(props, ref) {
|
|
3303
3303
|
}));
|
3304
3304
|
});
|
3305
3305
|
|
3306
|
-
|
3306
|
+
const VisuallyHidden = /*#__PURE__*/React.forwardRef(function VisuallyHidden(props, ref) {
|
3307
3307
|
return React.createElement("span", Object.assign({}, props, {
|
3308
3308
|
className: "sr-only",
|
3309
3309
|
ref: ref
|
@@ -3349,19 +3349,20 @@ const getOutlineClasses = state => {
|
|
3349
3349
|
}
|
3350
3350
|
};
|
3351
3351
|
|
3352
|
-
|
3353
|
-
|
3354
|
-
|
3355
|
-
|
3356
|
-
|
3357
|
-
|
3358
|
-
|
3359
|
-
|
3360
|
-
|
3361
|
-
|
3362
|
-
|
3363
|
-
|
3364
|
-
|
3352
|
+
const Badge = /*#__PURE__*/React.forwardRef(function Badge(props, ref) {
|
3353
|
+
const {
|
3354
|
+
children,
|
3355
|
+
compact = false,
|
3356
|
+
outline = false,
|
3357
|
+
state,
|
3358
|
+
...otherProps
|
3359
|
+
} = props;
|
3360
|
+
const className = cn('rounded-full border font-bold text-xs uppercase overflow-hidden whitespace-nowrap inline-flex items-center justify-center h-5', {
|
3361
|
+
[getOutlineClasses(state)]: outline,
|
3362
|
+
[`border-transparent ${getStateClasses(state)}`]: !outline,
|
3363
|
+
'h-2 w-2 min-w-0': compact,
|
3364
|
+
'h-5 py-0 px-1.5': !compact
|
3365
|
+
}, props.className);
|
3365
3366
|
return React.createElement("span", Object.assign({}, otherProps, {
|
3366
3367
|
"aria-atomic": "true",
|
3367
3368
|
"aria-live": "polite",
|
@@ -3421,13 +3422,13 @@ const Button = /*#__PURE__*/React.forwardRef(function Button(props, ref) {
|
|
3421
3422
|
}), React.Children.count(props.children) > 1 ? React.Children.map(props.children, child => typeof child === 'string' ? React.createElement("span", null, child) : child) : props.children);
|
3422
3423
|
});
|
3423
3424
|
|
3424
|
-
|
3425
|
-
|
3426
|
-
|
3427
|
-
|
3428
|
-
|
3429
|
-
|
3430
|
-
|
3425
|
+
const Tooltip = /*#__PURE__*/React.forwardRef(function Tooltip(props, ref) {
|
3426
|
+
const {
|
3427
|
+
title,
|
3428
|
+
children,
|
3429
|
+
placement,
|
3430
|
+
...otherProps
|
3431
|
+
} = props;
|
3431
3432
|
return React.createElement(TooltipPrimitive.Root, {
|
3432
3433
|
delayDuration: 50
|
3433
3434
|
}, React.createElement(TooltipPrimitive.Trigger, {
|
@@ -3519,14 +3520,13 @@ const createButton = (props, className, ref) => {
|
|
3519
3520
|
return button;
|
3520
3521
|
};
|
3521
3522
|
|
3522
|
-
|
3523
|
-
|
3524
|
-
|
3525
|
-
|
3526
|
-
|
3527
|
-
|
3528
|
-
|
3529
|
-
var className = cn('w-8', getButtonClasses(), getAppearanceClasses(otherProps.appearance, true), {
|
3523
|
+
const IconButton = /*#__PURE__*/React.forwardRef(function IconButton(props, ref) {
|
3524
|
+
const {
|
3525
|
+
icon,
|
3526
|
+
rounded = false,
|
3527
|
+
...otherProps
|
3528
|
+
} = props;
|
3529
|
+
const className = cn('w-8', getButtonClasses(), getAppearanceClasses(otherProps.appearance, true), {
|
3530
3530
|
'rounded-full': rounded,
|
3531
3531
|
rounded: !rounded,
|
3532
3532
|
'cursor-not-allowed opacity-50': props.disabled,
|
@@ -3537,13 +3537,13 @@ var IconButton = /*#__PURE__*/React.forwardRef(function IconButton(props, ref) {
|
|
3537
3537
|
return null;
|
3538
3538
|
}
|
3539
3539
|
|
3540
|
-
return createButton(
|
3540
|
+
return createButton({ ...otherProps,
|
3541
3541
|
children: React.createElement(Icon, {
|
3542
3542
|
name: icon,
|
3543
3543
|
className: "m-0 p-0"
|
3544
3544
|
}),
|
3545
3545
|
'data-taco': 'icon-button'
|
3546
|
-
}
|
3546
|
+
}, className, ref);
|
3547
3547
|
});
|
3548
3548
|
|
3549
3549
|
var Banner = /*#__PURE__*/React.forwardRef(function Banner(props, ref) {
|
@@ -3563,10 +3563,10 @@ var Banner = /*#__PURE__*/React.forwardRef(function Banner(props, ref) {
|
|
3563
3563
|
}) : null);
|
3564
3564
|
});
|
3565
3565
|
|
3566
|
-
var _excluded$
|
3566
|
+
var _excluded$1 = ["fluid"];
|
3567
3567
|
var Button$1 = /*#__PURE__*/React.forwardRef(function Button(props, ref) {
|
3568
3568
|
var fluid = props.fluid,
|
3569
|
-
otherProps = _objectWithoutPropertiesLoose(props, _excluded$
|
3569
|
+
otherProps = _objectWithoutPropertiesLoose(props, _excluded$1);
|
3570
3570
|
|
3571
3571
|
var className = cn(getButtonClasses(), getAppearanceClasses(otherProps.appearance), 'rounded px-3', {
|
3572
3572
|
'cursor-not-allowed opacity-50': props.disabled,
|
@@ -3637,27 +3637,21 @@ function useTimer(duration = 0, callback) {
|
|
3637
3637
|
};
|
3638
3638
|
}
|
3639
3639
|
|
3640
|
-
|
3641
|
-
|
3642
|
-
|
3643
|
-
|
3644
|
-
|
3645
|
-
|
3646
|
-
|
3647
|
-
|
3648
|
-
|
3649
|
-
setVisibility = _React$useState[1];
|
3650
|
-
|
3651
|
-
React__default.useEffect(function () {
|
3652
|
-
var timeout;
|
3640
|
+
const Spinner$1 = /*#__PURE__*/React__default.forwardRef(function Spinner(props, ref) {
|
3641
|
+
const {
|
3642
|
+
delay = 500,
|
3643
|
+
label,
|
3644
|
+
...otherProps
|
3645
|
+
} = props;
|
3646
|
+
const [visible, setVisibility] = React__default.useState(!delay);
|
3647
|
+
React__default.useEffect(() => {
|
3648
|
+
let timeout;
|
3653
3649
|
|
3654
3650
|
if (delay) {
|
3655
|
-
timeout = window.setTimeout(
|
3656
|
-
return setVisibility(true);
|
3657
|
-
}, delay);
|
3651
|
+
timeout = window.setTimeout(() => setVisibility(true), delay);
|
3658
3652
|
}
|
3659
3653
|
|
3660
|
-
return
|
3654
|
+
return () => {
|
3661
3655
|
if (timeout) {
|
3662
3656
|
clearTimeout(timeout);
|
3663
3657
|
}
|
@@ -3668,7 +3662,7 @@ var Spinner$1 = /*#__PURE__*/React__default.forwardRef(function Spinner(props, r
|
|
3668
3662
|
return null;
|
3669
3663
|
}
|
3670
3664
|
|
3671
|
-
|
3665
|
+
const className = cn('inline-flex flex-col relative items-center', otherProps.className);
|
3672
3666
|
return React__default.createElement("div", Object.assign({}, otherProps, {
|
3673
3667
|
className: className,
|
3674
3668
|
"data-taco": "spinner",
|
@@ -3794,62 +3788,49 @@ const Toast = ({
|
|
3794
3788
|
}));
|
3795
3789
|
};
|
3796
3790
|
|
3797
|
-
|
3798
|
-
|
3799
|
-
var ToastContext = /*#__PURE__*/React.createContext({});
|
3791
|
+
const DEFAULT_AUTO_CLOSE_TIMEOUT = 7500;
|
3792
|
+
const ToastContext = /*#__PURE__*/React.createContext({});
|
3800
3793
|
|
3801
|
-
|
3802
|
-
|
3803
|
-
|
3804
|
-
return JSON.stringify(toast.content) === JSON.stringify(content);
|
3805
|
-
});
|
3794
|
+
const insertToastWithoutDuplicates = (currentToasts, id, content, options, close) => {
|
3795
|
+
const nextToasts = [...currentToasts];
|
3796
|
+
const existingToastIndex = currentToasts.findIndex(toast => JSON.stringify(toast.content) === JSON.stringify(content));
|
3806
3797
|
|
3807
3798
|
if (existingToastIndex > -1) {
|
3808
3799
|
nextToasts[existingToastIndex].lastDuplicateId = id;
|
3809
3800
|
nextToasts[existingToastIndex].lastUpdated = Date.now();
|
3810
3801
|
} else {
|
3811
3802
|
nextToasts.push({
|
3812
|
-
id
|
3803
|
+
id,
|
3813
3804
|
content: typeof content === 'function' ? content(close) : content,
|
3814
|
-
options
|
3805
|
+
options
|
3815
3806
|
});
|
3816
3807
|
}
|
3817
3808
|
|
3818
3809
|
return nextToasts;
|
3819
3810
|
};
|
3820
3811
|
|
3821
|
-
|
3822
|
-
|
3823
|
-
|
3824
|
-
|
3825
|
-
|
3826
|
-
toasts = _React$useState[0],
|
3827
|
-
setToasts = _React$useState[1];
|
3812
|
+
const ToastProvider = ({
|
3813
|
+
children,
|
3814
|
+
...props
|
3815
|
+
}) => {
|
3816
|
+
const [toasts, setToasts] = React.useState([]);
|
3828
3817
|
|
3829
|
-
|
3830
|
-
setToasts(
|
3831
|
-
return currentToasts.filter(function (toast) {
|
3832
|
-
return toast.id !== id;
|
3833
|
-
});
|
3834
|
-
});
|
3818
|
+
const handleClose = id => {
|
3819
|
+
setToasts(currentToasts => currentToasts.filter(toast => toast.id !== id));
|
3835
3820
|
}; // memoize (useCallback) this function,
|
3836
3821
|
// it is the value of the context provider and we don't want it to trigger state tree re-renders on provider children
|
3837
3822
|
|
3838
3823
|
|
3839
|
-
|
3840
|
-
|
3824
|
+
const toaster = React.useCallback((content, options) => {
|
3825
|
+
const id = uuid.v4();
|
3841
3826
|
|
3842
|
-
|
3843
|
-
return handleClose(id);
|
3844
|
-
};
|
3827
|
+
const close = () => handleClose(id);
|
3845
3828
|
|
3846
|
-
setToasts(
|
3847
|
-
return insertToastWithoutDuplicates(currentToasts, id, content, options, close);
|
3848
|
-
});
|
3829
|
+
setToasts(currentToasts => insertToastWithoutDuplicates(currentToasts, id, content, options, close));
|
3849
3830
|
|
3850
|
-
|
3851
|
-
setToasts(
|
3852
|
-
|
3831
|
+
const update = (content, options) => {
|
3832
|
+
setToasts(currentToasts => {
|
3833
|
+
const nextToasts = currentToasts.filter(toast => {
|
3853
3834
|
if (toast.lastDuplicateId) {
|
3854
3835
|
return toast.lastDuplicateId !== id;
|
3855
3836
|
}
|
@@ -3860,80 +3841,70 @@ var ToastProvider = function ToastProvider(_ref) {
|
|
3860
3841
|
});
|
3861
3842
|
};
|
3862
3843
|
|
3863
|
-
|
3864
|
-
update(content,
|
3865
|
-
autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT
|
3866
|
-
|
3844
|
+
const success = (content, options) => {
|
3845
|
+
update(content, {
|
3846
|
+
autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT,
|
3847
|
+
...options,
|
3867
3848
|
type: 'success'
|
3868
|
-
})
|
3849
|
+
});
|
3869
3850
|
};
|
3870
3851
|
|
3871
|
-
|
3872
|
-
update(content,
|
3852
|
+
const error = (content, options) => {
|
3853
|
+
update(content, { ...options,
|
3873
3854
|
type: 'error'
|
3874
|
-
})
|
3855
|
+
});
|
3875
3856
|
};
|
3876
3857
|
|
3877
|
-
|
3878
|
-
update(content,
|
3858
|
+
const warning = (content, options) => {
|
3859
|
+
update(content, { ...options,
|
3879
3860
|
type: 'warning'
|
3880
|
-
})
|
3861
|
+
});
|
3881
3862
|
};
|
3882
3863
|
|
3883
|
-
|
3884
|
-
update(content,
|
3864
|
+
const information = (content, options) => {
|
3865
|
+
update(content, { ...options,
|
3885
3866
|
type: 'information'
|
3886
|
-
})
|
3867
|
+
});
|
3887
3868
|
};
|
3888
3869
|
|
3889
|
-
|
3890
|
-
update(content,
|
3870
|
+
const loading = (content, options) => {
|
3871
|
+
update(content, { ...options,
|
3891
3872
|
type: 'loading'
|
3892
|
-
})
|
3873
|
+
});
|
3893
3874
|
};
|
3894
3875
|
|
3895
3876
|
return {
|
3896
|
-
success
|
3897
|
-
error
|
3898
|
-
warning
|
3899
|
-
information
|
3900
|
-
loading
|
3901
|
-
close
|
3877
|
+
success,
|
3878
|
+
error,
|
3879
|
+
warning,
|
3880
|
+
information,
|
3881
|
+
loading,
|
3882
|
+
close
|
3902
3883
|
};
|
3903
3884
|
}, []); // no need to rebind these every render, do them once in an effect
|
3904
3885
|
|
3905
|
-
React.useEffect(
|
3906
|
-
toaster.success =
|
3907
|
-
|
3908
|
-
|
3909
|
-
|
3910
|
-
|
3911
|
-
}));
|
3912
|
-
};
|
3886
|
+
React.useEffect(() => {
|
3887
|
+
toaster.success = (content, options) => toaster(content, {
|
3888
|
+
autoClose: DEFAULT_AUTO_CLOSE_TIMEOUT,
|
3889
|
+
...options,
|
3890
|
+
type: 'success'
|
3891
|
+
});
|
3913
3892
|
|
3914
|
-
toaster.error =
|
3915
|
-
|
3916
|
-
|
3917
|
-
}));
|
3918
|
-
};
|
3893
|
+
toaster.error = (content, options) => toaster(content, { ...options,
|
3894
|
+
type: 'error'
|
3895
|
+
});
|
3919
3896
|
|
3920
|
-
toaster.warning =
|
3921
|
-
|
3922
|
-
|
3923
|
-
}));
|
3924
|
-
};
|
3897
|
+
toaster.warning = (content, options) => toaster(content, { ...options,
|
3898
|
+
type: 'warning'
|
3899
|
+
});
|
3925
3900
|
|
3926
|
-
toaster.information =
|
3927
|
-
|
3928
|
-
|
3929
|
-
}));
|
3930
|
-
};
|
3901
|
+
toaster.information = (content, options) => toaster(content, { ...options,
|
3902
|
+
type: 'information'
|
3903
|
+
});
|
3931
3904
|
|
3932
|
-
toaster.loading =
|
3933
|
-
|
3934
|
-
|
3935
|
-
}));
|
3936
|
-
};
|
3905
|
+
toaster.loading = (content, options) => toaster(content, { ...options,
|
3906
|
+
type: 'loading'
|
3907
|
+
});
|
3937
3908
|
}, []);
|
3938
3909
|
return React.createElement(ToastContext.Provider, Object.assign({}, props, {
|
3939
3910
|
value: toaster
|
@@ -3943,43 +3914,37 @@ var ToastProvider = function ToastProvider(_ref) {
|
|
3943
3914
|
role: "log"
|
3944
3915
|
}, React.createElement(framerMotion.AnimatePresence, {
|
3945
3916
|
initial: false
|
3946
|
-
}, toasts.map(
|
3947
|
-
|
3948
|
-
|
3917
|
+
}, toasts.map(toast => React.createElement(framerMotion.motion.div, {
|
3918
|
+
key: toast.id,
|
3919
|
+
transition: {
|
3920
|
+
type: 'spring',
|
3921
|
+
damping: 20,
|
3922
|
+
stiffness: 300
|
3923
|
+
},
|
3924
|
+
initial: {
|
3925
|
+
opacity: 0,
|
3926
|
+
y: 10,
|
3927
|
+
scale: 0.5
|
3928
|
+
},
|
3929
|
+
animate: {
|
3930
|
+
opacity: 1,
|
3931
|
+
y: 0,
|
3932
|
+
scale: 1
|
3933
|
+
},
|
3934
|
+
exit: {
|
3935
|
+
opacity: 0,
|
3936
|
+
scale: 0.5,
|
3949
3937
|
transition: {
|
3950
|
-
|
3951
|
-
damping: 20,
|
3952
|
-
stiffness: 300
|
3953
|
-
},
|
3954
|
-
initial: {
|
3955
|
-
opacity: 0,
|
3956
|
-
y: 10,
|
3957
|
-
scale: 0.5
|
3958
|
-
},
|
3959
|
-
animate: {
|
3960
|
-
opacity: 1,
|
3961
|
-
y: 0,
|
3962
|
-
scale: 1
|
3963
|
-
},
|
3964
|
-
exit: {
|
3965
|
-
opacity: 0,
|
3966
|
-
scale: 0.5,
|
3967
|
-
transition: {
|
3968
|
-
duration: 0.2
|
3969
|
-
}
|
3938
|
+
duration: 0.2
|
3970
3939
|
}
|
3971
|
-
}
|
3972
|
-
|
3973
|
-
|
3974
|
-
|
3975
|
-
})));
|
3976
|
-
}))));
|
3977
|
-
};
|
3978
|
-
var useToast = function useToast() {
|
3979
|
-
return React.useContext(ToastContext);
|
3940
|
+
}
|
3941
|
+
}, React.createElement(Toast, Object.assign({}, toast, {
|
3942
|
+
onClose: () => handleClose(toast.id)
|
3943
|
+
})))))));
|
3980
3944
|
};
|
3945
|
+
const useToast = () => React.useContext(ToastContext);
|
3981
3946
|
|
3982
|
-
|
3947
|
+
const defaultLocalisationTexts = {
|
3983
3948
|
calendar: {
|
3984
3949
|
months: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'],
|
3985
3950
|
weekdaysShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'],
|
@@ -4054,67 +4019,62 @@ var defaultLocalisationTexts = {
|
|
4054
4019
|
inputLabel: 'Search...'
|
4055
4020
|
}
|
4056
4021
|
};
|
4057
|
-
|
4022
|
+
const defaultLocalizationContext = {
|
4058
4023
|
locale: 'en-GB',
|
4059
4024
|
texts: defaultLocalisationTexts,
|
4060
4025
|
formatting: {
|
4061
4026
|
date: 'dd.mm.yy'
|
4062
4027
|
}
|
4063
4028
|
};
|
4064
|
-
|
4029
|
+
const Context = /*#__PURE__*/React.createContext({
|
4065
4030
|
localization: defaultLocalizationContext
|
4066
4031
|
});
|
4067
|
-
|
4068
|
-
|
4069
|
-
|
4070
|
-
|
4071
|
-
|
4072
|
-
|
4073
|
-
|
4074
|
-
|
4075
|
-
}, [localization]);
|
4032
|
+
const Provider = props => {
|
4033
|
+
const {
|
4034
|
+
children,
|
4035
|
+
localization = defaultLocalizationContext
|
4036
|
+
} = props;
|
4037
|
+
const value = React.useMemo(() => ({
|
4038
|
+
localization
|
4039
|
+
}), [localization]);
|
4076
4040
|
return React.createElement(Context.Provider, {
|
4077
4041
|
value: value
|
4078
4042
|
}, React.createElement(ToastProvider, null, children));
|
4079
4043
|
};
|
4080
|
-
|
4081
|
-
|
4082
|
-
};
|
4083
|
-
var useLocalization = function useLocalization() {
|
4084
|
-
return useTaco().localization;
|
4085
|
-
};
|
4044
|
+
const useTaco = () => React.useContext(Context);
|
4045
|
+
const useLocalization = () => useTaco().localization;
|
4086
4046
|
|
4087
|
-
|
4047
|
+
const renderDay = (day, modifiers) => modifiers.disabled ? React.createElement("span", {
|
4048
|
+
className: "dot"
|
4049
|
+
}) : day.getDate();
|
4088
4050
|
|
4089
|
-
|
4090
|
-
|
4091
|
-
className: "dot"
|
4092
|
-
}) : day.getDate();
|
4093
|
-
};
|
4094
|
-
|
4095
|
-
var thisYear = /*#__PURE__*/new Date().getFullYear();
|
4096
|
-
var years = [];
|
4051
|
+
const thisYear = /*#__PURE__*/new Date().getFullYear();
|
4052
|
+
const years = [];
|
4097
4053
|
|
4098
|
-
for (
|
4054
|
+
for (let i = thisYear - 10; i <= thisYear + 10; i += 1) {
|
4099
4055
|
years.push(i);
|
4100
4056
|
}
|
4101
4057
|
|
4102
|
-
|
4103
|
-
|
4104
|
-
|
4105
|
-
|
4106
|
-
|
4107
|
-
|
4108
|
-
|
4109
|
-
|
4110
|
-
|
4111
|
-
|
4112
|
-
|
4058
|
+
const Navbar = /*#__PURE__*/React.memo(({
|
4059
|
+
onMonthChange,
|
4060
|
+
onNextClick,
|
4061
|
+
onPreviousClick,
|
4062
|
+
value = new Date()
|
4063
|
+
}) => {
|
4064
|
+
const {
|
4065
|
+
texts: {
|
4066
|
+
calendar: {
|
4067
|
+
actions,
|
4068
|
+
months
|
4069
|
+
}
|
4070
|
+
}
|
4071
|
+
} = useLocalization();
|
4113
4072
|
|
4114
|
-
|
4115
|
-
|
4116
|
-
|
4117
|
-
|
4073
|
+
const handleChange = function handleChange(event) {
|
4074
|
+
const {
|
4075
|
+
year,
|
4076
|
+
month
|
4077
|
+
} = event.target.form;
|
4118
4078
|
onMonthChange(new Date(year.value, month.value));
|
4119
4079
|
};
|
4120
4080
|
|
@@ -4127,59 +4087,49 @@ var Navbar = /*#__PURE__*/React.memo(function (_ref) {
|
|
4127
4087
|
name: "month",
|
4128
4088
|
onChange: handleChange,
|
4129
4089
|
value: value.getMonth()
|
4130
|
-
}, months.map(
|
4131
|
-
|
4132
|
-
|
4133
|
-
|
4134
|
-
}, month);
|
4135
|
-
})), React.createElement("select", {
|
4090
|
+
}, months.map((month, i) => React.createElement("option", {
|
4091
|
+
key: month,
|
4092
|
+
value: i
|
4093
|
+
}, month))), React.createElement("select", {
|
4136
4094
|
className: "h-8 px-2",
|
4137
4095
|
name: "year",
|
4138
4096
|
onChange: handleChange,
|
4139
4097
|
value: value.getFullYear()
|
4140
|
-
}, years.map(
|
4141
|
-
|
4142
|
-
|
4143
|
-
|
4144
|
-
}, String(year));
|
4145
|
-
}))), React.createElement("div", null, React.createElement(IconButton, {
|
4098
|
+
}, years.map(year => React.createElement("option", {
|
4099
|
+
key: year,
|
4100
|
+
value: year
|
4101
|
+
}, String(year))))), React.createElement("div", null, React.createElement(IconButton, {
|
4146
4102
|
appearance: "discrete",
|
4147
4103
|
icon: "chevron-left",
|
4148
4104
|
"aria-label": actions.previousMonth,
|
4149
|
-
onClick:
|
4150
|
-
return onPreviousClick();
|
4151
|
-
},
|
4105
|
+
onClick: () => onPreviousClick(),
|
4152
4106
|
rounded: true
|
4153
4107
|
}), React.createElement(IconButton, {
|
4154
4108
|
appearance: "discrete",
|
4155
4109
|
icon: "chevron-right",
|
4156
4110
|
"aria-label": actions.nextMonth,
|
4157
|
-
onClick:
|
4158
|
-
return onNextClick();
|
4159
|
-
},
|
4111
|
+
onClick: () => onNextClick(),
|
4160
4112
|
rounded: true
|
4161
4113
|
})));
|
4162
4114
|
});
|
4163
|
-
|
4164
|
-
|
4165
|
-
|
4166
|
-
|
4167
|
-
|
4168
|
-
|
4169
|
-
|
4170
|
-
|
4171
|
-
|
4172
|
-
|
4173
|
-
|
4174
|
-
|
4175
|
-
|
4176
|
-
React.useEffect(function () {
|
4115
|
+
const Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
|
4116
|
+
const {
|
4117
|
+
onChange: handleChange,
|
4118
|
+
value,
|
4119
|
+
...otherProps
|
4120
|
+
} = props;
|
4121
|
+
const {
|
4122
|
+
locale,
|
4123
|
+
texts
|
4124
|
+
} = useLocalization();
|
4125
|
+
const [visibleMonth, setVisibleMonth] = React.useState(value !== null && value !== void 0 ? value : new Date());
|
4126
|
+
React.useEffect(() => {
|
4177
4127
|
if (visibleMonth !== value) {
|
4178
4128
|
setVisibleMonth(value !== null && value !== void 0 ? value : new Date());
|
4179
4129
|
}
|
4180
4130
|
}, [value]);
|
4181
4131
|
|
4182
|
-
|
4132
|
+
const handleDayClick = (date, modifiers, event) => {
|
4183
4133
|
if (modifiers.outside || modifiers.disabled) {
|
4184
4134
|
return;
|
4185
4135
|
}
|
@@ -4187,8 +4137,8 @@ var Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
|
|
4187
4137
|
handleChange(date, event);
|
4188
4138
|
};
|
4189
4139
|
|
4190
|
-
|
4191
|
-
|
4140
|
+
const handleCalendarClickToday = () => {
|
4141
|
+
const today = new Date(); // set to midday to avoid UTC offset causing dates to be mismatched server side
|
4192
4142
|
|
4193
4143
|
today.setHours(12);
|
4194
4144
|
today.setMinutes(0);
|
@@ -4196,7 +4146,7 @@ var Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
|
|
4196
4146
|
handleChange(today);
|
4197
4147
|
};
|
4198
4148
|
|
4199
|
-
|
4149
|
+
const className = cn('flex bg-white text-xs p-4', otherProps.className);
|
4200
4150
|
return React.createElement("div", {
|
4201
4151
|
"data-taco": "calendar"
|
4202
4152
|
}, React.createElement(ReactDayPicker, Object.assign({}, otherProps, {
|
@@ -4207,18 +4157,14 @@ var Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
|
|
4207
4157
|
firstDayOfWeek: 1,
|
4208
4158
|
months: texts.calendar.months,
|
4209
4159
|
weekdaysShort: texts.calendar.weekdaysShort,
|
4210
|
-
navbarElement:
|
4211
|
-
|
4212
|
-
|
4213
|
-
|
4214
|
-
}));
|
4215
|
-
},
|
4160
|
+
navbarElement: navProps => React.createElement(Navbar, Object.assign({}, navProps, {
|
4161
|
+
onMonthChange: setVisibleMonth,
|
4162
|
+
value: visibleMonth
|
4163
|
+
})),
|
4216
4164
|
onDayClick: handleDayClick,
|
4217
4165
|
onMonthChange: setVisibleMonth,
|
4218
4166
|
onTodayButtonClick: handleCalendarClickToday,
|
4219
|
-
captionElement:
|
4220
|
-
return null;
|
4221
|
-
},
|
4167
|
+
captionElement: () => null,
|
4222
4168
|
todayButton: texts.calendar.actions.today,
|
4223
4169
|
showOutsideDays: true,
|
4224
4170
|
renderDay: renderDay,
|
@@ -4227,32 +4173,30 @@ var Calendar$1 = /*#__PURE__*/React.forwardRef(function Calendar(props, ref) {
|
|
4227
4173
|
})));
|
4228
4174
|
});
|
4229
4175
|
|
4230
|
-
|
4231
|
-
|
4232
|
-
|
4233
|
-
|
4234
|
-
|
4235
|
-
|
4236
|
-
|
4237
|
-
|
4238
|
-
|
4239
|
-
|
4240
|
-
|
4176
|
+
const Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(props, ref) {
|
4177
|
+
const {
|
4178
|
+
checked,
|
4179
|
+
highlighted,
|
4180
|
+
indeterminate,
|
4181
|
+
invalid,
|
4182
|
+
label,
|
4183
|
+
onChange,
|
4184
|
+
...otherProps
|
4185
|
+
} = props;
|
4186
|
+
const className = cn('bg-white h-5 w-5 border rounded text-sm flex-shrink-0 self-start mt-[0.1rem] focus:yt-focus', //hover:shadow-[0_0_0_1px_rgba(235,235,235,1)]
|
4241
4187
|
props.className, {
|
4242
4188
|
'border-grey-dark text-blue hover:text-blue-light focus:border-blue focus:hover:border-blue-light': !props.disabled && !invalid,
|
4243
4189
|
'border-grey text-blue-light cursor-not-allowed': props.disabled,
|
4244
4190
|
'bg-[rgba(255,255,0,0.2)] disabled:bg-[rgba(255,255,0,0.075)]': highlighted,
|
4245
4191
|
'border-red text-red hover:text-red-light hover:border-red-light focus:border-red focus:hover:border-red-light': invalid && !props.disabled
|
4246
4192
|
});
|
4247
|
-
|
4193
|
+
let handleChange;
|
4248
4194
|
|
4249
4195
|
if (onChange) {
|
4250
|
-
handleChange =
|
4251
|
-
return onChange(checked === 'indeterminate' ? false : checked);
|
4252
|
-
};
|
4196
|
+
handleChange = checked => onChange(checked === 'indeterminate' ? false : checked);
|
4253
4197
|
}
|
4254
4198
|
|
4255
|
-
|
4199
|
+
const element = React.createElement(CheckboxPrimitive.Root, Object.assign({}, otherProps, {
|
4256
4200
|
"data-taco": "checkbox",
|
4257
4201
|
checked: indeterminate ? 'indeterminate' : checked,
|
4258
4202
|
className: className,
|
@@ -4266,7 +4210,7 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(props, ref) {
|
|
4266
4210
|
})));
|
4267
4211
|
|
4268
4212
|
if (label) {
|
4269
|
-
|
4213
|
+
const labelClassName = cn('flex items-center cursor-pointer gap-2', {
|
4270
4214
|
'cursor-not-allowed text-grey-dark': props.disabled
|
4271
4215
|
}, props.className);
|
4272
4216
|
return React.createElement("label", {
|
@@ -4277,9 +4221,9 @@ var Checkbox = /*#__PURE__*/React.forwardRef(function Checkbox(props, ref) {
|
|
4277
4221
|
return element;
|
4278
4222
|
});
|
4279
4223
|
|
4280
|
-
|
4281
|
-
|
4282
|
-
React.useEffect(()
|
4224
|
+
var useProxiedRef = function useProxiedRef(ref) {
|
4225
|
+
var internalRef = React.useRef(null);
|
4226
|
+
React.useEffect(function () {
|
4283
4227
|
if (ref) {
|
4284
4228
|
if (typeof ref === 'function') {
|
4285
4229
|
ref(internalRef.current);
|
@@ -4309,21 +4253,22 @@ const getButtonStateClasses = invalid => {
|
|
4309
4253
|
return '!border-grey-dark focus:!border-blue-light peer-focus:!border-blue-light peer-focus:peer-active:!border-blue-dark';
|
4310
4254
|
};
|
4311
4255
|
|
4312
|
-
|
4313
|
-
|
4314
|
-
|
4315
|
-
|
4316
|
-
|
4317
|
-
|
4318
|
-
|
4319
|
-
|
4320
|
-
|
4321
|
-
|
4322
|
-
|
4323
|
-
|
4256
|
+
const Input = /*#__PURE__*/React.forwardRef(function Input(props, ref) {
|
4257
|
+
const {
|
4258
|
+
button,
|
4259
|
+
icon,
|
4260
|
+
highlighted,
|
4261
|
+
invalid,
|
4262
|
+
onKeyDown,
|
4263
|
+
autoFocus,
|
4264
|
+
...otherProps
|
4265
|
+
} = props;
|
4266
|
+
const inputRef = useProxiedRef(ref);
|
4267
|
+
const hasContainer = button || icon;
|
4268
|
+
const className = cn(getInputClasses(props), 'min-h-[theme(spacing.8)] pointer-events-all', {
|
4324
4269
|
'pr-8': !!hasContainer
|
4325
4270
|
}, !hasContainer && otherProps.className);
|
4326
|
-
React.useEffect(
|
4271
|
+
React.useEffect(() => {
|
4327
4272
|
if (autoFocus && inputRef.current) {
|
4328
4273
|
inputRef.current.focus();
|
4329
4274
|
}
|
@@ -4331,10 +4276,10 @@ var Input = /*#__PURE__*/React.forwardRef(function Input(props, ref) {
|
|
4331
4276
|
// if it has scroll height then the browser reverts to native scrolling behaviour only
|
4332
4277
|
// so we manually override it to ensure _our_ desired behaviour remains intact
|
4333
4278
|
|
4334
|
-
|
4279
|
+
const handleKeyDown = event => {
|
4335
4280
|
if (!event.shiftKey && (event.key === 'Home' || event.key === 'End')) {
|
4336
4281
|
event.preventDefault();
|
4337
|
-
|
4282
|
+
const position = event.key === 'End' ? event.currentTarget.value.length : 0;
|
4338
4283
|
event.currentTarget.setSelectionRange(position, position);
|
4339
4284
|
}
|
4340
4285
|
|
@@ -4343,7 +4288,7 @@ var Input = /*#__PURE__*/React.forwardRef(function Input(props, ref) {
|
|
4343
4288
|
}
|
4344
4289
|
};
|
4345
4290
|
|
4346
|
-
|
4291
|
+
const input = React.createElement("input", Object.assign({}, otherProps, {
|
4347
4292
|
className: className,
|
4348
4293
|
"data-taco": "input",
|
4349
4294
|
onKeyDown: handleKeyDown,
|
@@ -4351,19 +4296,19 @@ var Input = /*#__PURE__*/React.forwardRef(function Input(props, ref) {
|
|
4351
4296
|
}));
|
4352
4297
|
|
4353
4298
|
if (hasContainer) {
|
4354
|
-
|
4299
|
+
let extra;
|
4355
4300
|
|
4356
4301
|
if (button) {
|
4357
|
-
|
4358
|
-
|
4359
|
-
|
4360
|
-
|
4302
|
+
const disabled = button.props.disabled || otherProps.disabled;
|
4303
|
+
const buttonClassName = cn('items-center flex justify-center border absolute rounded-l-none rounded-r right-0 h-full focus:rounded focus:outline-none', {
|
4304
|
+
[getButtonStateClasses(invalid)]: !props.disabled
|
4305
|
+
}, button.props.className);
|
4361
4306
|
extra = React.cloneElement(button, {
|
4362
4307
|
className: buttonClassName,
|
4363
|
-
disabled
|
4308
|
+
disabled
|
4364
4309
|
});
|
4365
4310
|
} else if (icon) {
|
4366
|
-
|
4311
|
+
const iconClassName = cn('items-center flex justify-center absolute pointer-events-none mr-1 p-px right-0 w-5 top-1/2 -translate-y-1/2', {
|
4367
4312
|
'text-grey-dark': props.disabled,
|
4368
4313
|
'text-grey-darkest': !props.disabled
|
4369
4314
|
});
|
@@ -4375,7 +4320,7 @@ var Input = /*#__PURE__*/React.forwardRef(function Input(props, ref) {
|
|
4375
4320
|
});
|
4376
4321
|
}
|
4377
4322
|
|
4378
|
-
|
4323
|
+
const containerClassName = cn('bg-white inline-flex relative rounded w-full', otherProps.className);
|
4379
4324
|
return React.createElement("div", {
|
4380
4325
|
className: containerClassName,
|
4381
4326
|
"data-taco": "input-container"
|
@@ -5146,27 +5091,26 @@ var useBoundingClientRectListener = function useBoundingClientRectListener(ref)
|
|
5146
5091
|
return dimensions;
|
5147
5092
|
};
|
5148
5093
|
|
5149
|
-
|
5150
|
-
|
5151
|
-
|
5152
|
-
|
5153
|
-
|
5154
|
-
|
5155
|
-
|
5156
|
-
|
5157
|
-
|
5158
|
-
|
5159
|
-
|
5160
|
-
|
5161
|
-
|
5162
|
-
|
5163
|
-
|
5164
|
-
|
5165
|
-
|
5166
|
-
|
5167
|
-
|
5168
|
-
|
5169
|
-
var className = cn('inline-flex relative', {
|
5094
|
+
const Combobox = /*#__PURE__*/React.forwardRef(function Combobox(props, ref) {
|
5095
|
+
const {
|
5096
|
+
className: externalClassName,
|
5097
|
+
dialog,
|
5098
|
+
style,
|
5099
|
+
...otherProps
|
5100
|
+
} = props;
|
5101
|
+
const {
|
5102
|
+
combobox,
|
5103
|
+
button,
|
5104
|
+
input,
|
5105
|
+
popover,
|
5106
|
+
list
|
5107
|
+
} = useCombobox(otherProps, ref);
|
5108
|
+
const internalRef = React.useRef(null);
|
5109
|
+
const {
|
5110
|
+
texts
|
5111
|
+
} = useLocalization();
|
5112
|
+
const selectDimensions = useBoundingClientRectListener(internalRef);
|
5113
|
+
const className = cn('inline-flex relative', {
|
5170
5114
|
'yt-combobox--inline': props.inline
|
5171
5115
|
}, externalClassName);
|
5172
5116
|
return React.createElement("span", {
|
@@ -5185,7 +5129,7 @@ var Combobox = /*#__PURE__*/React.forwardRef(function Combobox(props, ref) {
|
|
5185
5129
|
appearance: "discrete",
|
5186
5130
|
className: "!border-l-0 focus:!border-none focus:!shadow-none active:!border-none",
|
5187
5131
|
icon: popover.open ? 'chevron-up' : 'chevron-down',
|
5188
|
-
onClick:
|
5132
|
+
onClick: () => {
|
5189
5133
|
var _input$ref$current;
|
5190
5134
|
|
5191
5135
|
popover.onOpenChange(true);
|
@@ -5196,7 +5140,7 @@ var Combobox = /*#__PURE__*/React.forwardRef(function Combobox(props, ref) {
|
|
5196
5140
|
icon: "list-search",
|
5197
5141
|
disabled: props.readOnly || props.disabled,
|
5198
5142
|
dialog: dialog,
|
5199
|
-
onFocus:
|
5143
|
+
onFocus: event => {
|
5200
5144
|
var _input$ref$current2;
|
5201
5145
|
|
5202
5146
|
// Prevents the default focus behaviour of showing the tooltip, on parent tooltip element
|
@@ -5209,7 +5153,7 @@ var Combobox = /*#__PURE__*/React.forwardRef(function Combobox(props, ref) {
|
|
5209
5153
|
}) : undefined
|
5210
5154
|
})))), React.createElement(PopoverPrimitive.Content, {
|
5211
5155
|
align: "start",
|
5212
|
-
onOpenAutoFocus:
|
5156
|
+
onOpenAutoFocus: event => {
|
5213
5157
|
event.preventDefault();
|
5214
5158
|
},
|
5215
5159
|
sideOffset: 4
|
@@ -5443,19 +5387,18 @@ function mergeRefs(refs) {
|
|
5443
5387
|
};
|
5444
5388
|
}
|
5445
5389
|
|
5446
|
-
|
5447
|
-
var PopoverContext = /*#__PURE__*/React.createContext({
|
5390
|
+
const PopoverContext = /*#__PURE__*/React.createContext({
|
5448
5391
|
props: {},
|
5449
5392
|
ref: null
|
5450
5393
|
});
|
5451
|
-
|
5394
|
+
const Trigger$1 = /*#__PURE__*/React.forwardRef(function PopoverTrigger(props, ref) {
|
5452
5395
|
var _props$children;
|
5453
5396
|
|
5454
|
-
|
5455
|
-
|
5397
|
+
const context = React.useContext(PopoverContext);
|
5398
|
+
let children = props.children;
|
5456
5399
|
|
5457
5400
|
if (React.isValidElement(props.children) && typeof ((_props$children = props.children) === null || _props$children === void 0 ? void 0 : _props$children.type) === 'function') {
|
5458
|
-
console.warn(
|
5401
|
+
console.warn(`Popover.Trigger requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '${props.children.type.name}' in React.forwardRef()? Taco has wrapped '${props.children.type.name}' in a 'span' to maintain functionality, but this may cause unintended behaviour`);
|
5459
5402
|
children = React.createElement("span", null, props.children);
|
5460
5403
|
}
|
5461
5404
|
|
@@ -5465,22 +5408,22 @@ var Trigger$1 = /*#__PURE__*/React.forwardRef(function PopoverTrigger(props, ref
|
|
5465
5408
|
asChild: true
|
5466
5409
|
}));
|
5467
5410
|
});
|
5468
|
-
|
5469
|
-
|
5470
|
-
|
5471
|
-
|
5472
|
-
|
5411
|
+
const RenderPropWrapper = /*#__PURE__*/React.forwardRef(function RenderPropWrapper({
|
5412
|
+
children,
|
5413
|
+
onClick
|
5414
|
+
}, ref) {
|
5415
|
+
const close = () => {
|
5473
5416
|
onClick(new CustomEvent('hide'));
|
5474
5417
|
};
|
5475
5418
|
|
5476
5419
|
return children({
|
5477
|
-
close
|
5478
|
-
ref
|
5420
|
+
close,
|
5421
|
+
ref
|
5479
5422
|
});
|
5480
5423
|
});
|
5481
|
-
|
5482
|
-
|
5483
|
-
|
5424
|
+
const Content$1 = /*#__PURE__*/React.forwardRef(function PopoverContent(props, ref) {
|
5425
|
+
const className = cn('bg-white focus:border-blue-light', props.className);
|
5426
|
+
let output;
|
5484
5427
|
|
5485
5428
|
if (typeof props.children === 'function') {
|
5486
5429
|
output = React.createElement(PopoverPrimitive.Close, {
|
@@ -5498,23 +5441,20 @@ var Content$1 = /*#__PURE__*/React.forwardRef(function PopoverContent(props, ref
|
|
5498
5441
|
className: "text-white"
|
5499
5442
|
}));
|
5500
5443
|
});
|
5501
|
-
|
5502
|
-
|
5503
|
-
|
5504
|
-
|
5505
|
-
|
5506
|
-
|
5507
|
-
|
5508
|
-
|
5509
|
-
|
5510
|
-
|
5511
|
-
|
5512
|
-
|
5513
|
-
|
5514
|
-
|
5515
|
-
ref: ref
|
5516
|
-
};
|
5517
|
-
}, [otherProps]);
|
5444
|
+
const Close$1 = /*#__PURE__*/React.forwardRef((props, ref) => React.createElement(PopoverPrimitive.Close, Object.assign({}, props, {
|
5445
|
+
ref: ref,
|
5446
|
+
asChild: true
|
5447
|
+
})));
|
5448
|
+
const Popover = /*#__PURE__*/React.forwardRef(function Popover(props, ref) {
|
5449
|
+
const {
|
5450
|
+
children,
|
5451
|
+
trigger,
|
5452
|
+
...otherProps
|
5453
|
+
} = props;
|
5454
|
+
const context = React.useMemo(() => ({
|
5455
|
+
props: otherProps,
|
5456
|
+
ref
|
5457
|
+
}), [otherProps]);
|
5518
5458
|
return React.createElement(PopoverContext.Provider, {
|
5519
5459
|
value: context
|
5520
5460
|
}, React.createElement(PopoverPrimitive.Root, null, trigger && React.createElement(Trigger$1, null, trigger), children));
|
@@ -5523,23 +5463,23 @@ Popover.Trigger = Trigger$1;
|
|
5523
5463
|
Popover.Content = Content$1;
|
5524
5464
|
Popover.Close = Close$1;
|
5525
5465
|
|
5526
|
-
|
5527
|
-
|
5528
|
-
|
5529
|
-
|
5530
|
-
|
5531
|
-
|
5532
|
-
|
5533
|
-
|
5534
|
-
|
5535
|
-
|
5536
|
-
|
5537
|
-
|
5538
|
-
|
5539
|
-
|
5540
|
-
|
5541
|
-
|
5542
|
-
|
5466
|
+
const Datepicker = /*#__PURE__*/React.forwardRef(function Datepicker(props, ref) {
|
5467
|
+
const {
|
5468
|
+
className: externalClassName,
|
5469
|
+
onReset: handleReset,
|
5470
|
+
style,
|
5471
|
+
shortcuts,
|
5472
|
+
shortcutsText,
|
5473
|
+
...otherProps
|
5474
|
+
} = props;
|
5475
|
+
const {
|
5476
|
+
calendar,
|
5477
|
+
input
|
5478
|
+
} = useDatepicker(otherProps, ref);
|
5479
|
+
const {
|
5480
|
+
texts
|
5481
|
+
} = useLocalization();
|
5482
|
+
const className = cn('inline-flex w-full text-black font-normal', externalClassName);
|
5543
5483
|
return React.createElement("span", {
|
5544
5484
|
className: className,
|
5545
5485
|
"data-taco": "datepicker",
|
@@ -5549,40 +5489,37 @@ var Datepicker = /*#__PURE__*/React.forwardRef(function Datepicker(props, ref) {
|
|
5549
5489
|
"aria-label": texts.datepicker.expand,
|
5550
5490
|
disabled: input.disabled || input.readOnly,
|
5551
5491
|
icon: "calendar"
|
5552
|
-
})), React.createElement(Popover.Content, null,
|
5553
|
-
|
5554
|
-
|
5555
|
-
|
5556
|
-
|
5557
|
-
|
5558
|
-
|
5559
|
-
|
5560
|
-
|
5561
|
-
|
5562
|
-
|
5563
|
-
|
5564
|
-
|
5565
|
-
|
5566
|
-
|
5567
|
-
|
5568
|
-
|
5569
|
-
|
5570
|
-
|
5571
|
-
|
5572
|
-
|
5573
|
-
|
5574
|
-
|
5575
|
-
|
5576
|
-
|
5577
|
-
|
5578
|
-
|
5579
|
-
|
5580
|
-
|
5581
|
-
|
5582
|
-
|
5583
|
-
}
|
5584
|
-
}, texts.datepicker.clear)));
|
5585
|
-
}))
|
5492
|
+
})), React.createElement(Popover.Content, null, ({
|
5493
|
+
close
|
5494
|
+
}) => React.createElement("div", {
|
5495
|
+
className: "-m-3 flex"
|
5496
|
+
}, React.createElement(Calendar$1, Object.assign({}, calendar, {
|
5497
|
+
onChange: (date, event) => {
|
5498
|
+
calendar.onChange(date, event);
|
5499
|
+
close();
|
5500
|
+
},
|
5501
|
+
tabIndex: -1
|
5502
|
+
})), shortcuts && React.createElement("div", {
|
5503
|
+
className: "border-grey-dark flex flex-col border-l"
|
5504
|
+
}, React.createElement("span", {
|
5505
|
+
className: "m-4 mb-3 flex h-8 w-32 items-center text-xs font-semibold"
|
5506
|
+
}, shortcutsText !== null && shortcutsText !== void 0 ? shortcutsText : texts.datepicker.shortcuts), React.createElement("ul", null, shortcuts.map((shortcut, i) => React.createElement("li", {
|
5507
|
+
key: i
|
5508
|
+
}, React.createElement("button", {
|
5509
|
+
className: "hover:bg-grey-light flex w-full items-start px-4 py-1 text-xs",
|
5510
|
+
onClick: event => {
|
5511
|
+
event.persist();
|
5512
|
+
shortcut.onClick(event);
|
5513
|
+
close();
|
5514
|
+
}
|
5515
|
+
}, shortcut.text)))), handleReset && React.createElement("button", {
|
5516
|
+
className: "text-blue hover:text-blue-light my-4 mx-auto mt-auto inline-flex cursor-pointer border-none bg-transparent text-xs",
|
5517
|
+
onClick: event => {
|
5518
|
+
event.persist();
|
5519
|
+
handleReset(event);
|
5520
|
+
close();
|
5521
|
+
}
|
5522
|
+
}, texts.datepicker.clear)))))
|
5586
5523
|
})));
|
5587
5524
|
});
|
5588
5525
|
|
@@ -5825,14 +5762,12 @@ const Extra = /*#__PURE__*/React.forwardRef(function DialogExtra(props, ref) {
|
|
5825
5762
|
});
|
5826
5763
|
Extra.displayName = 'DialogExtra';
|
5827
5764
|
|
5828
|
-
|
5829
|
-
|
5830
|
-
|
5831
|
-
|
5832
|
-
|
5833
|
-
|
5834
|
-
var extra;
|
5835
|
-
React.Children.toArray(initialChildren).forEach(function (child) {
|
5765
|
+
const useSeparatedChildren = initialChildren => {
|
5766
|
+
return React.useMemo(() => {
|
5767
|
+
const children = [];
|
5768
|
+
let drawer;
|
5769
|
+
let extra;
|
5770
|
+
React.Children.toArray(initialChildren).forEach(child => {
|
5836
5771
|
var _child$type, _child$type2;
|
5837
5772
|
|
5838
5773
|
if (((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.displayName) === Drawer.displayName) {
|
@@ -5847,55 +5782,39 @@ var useSeparatedChildren = function useSeparatedChildren(initialChildren) {
|
|
5847
5782
|
}, [initialChildren]);
|
5848
5783
|
};
|
5849
5784
|
|
5850
|
-
|
5851
|
-
|
5852
|
-
|
5853
|
-
|
5854
|
-
|
5855
|
-
|
5856
|
-
|
5857
|
-
|
5858
|
-
|
5859
|
-
|
5860
|
-
|
5861
|
-
|
5862
|
-
|
5863
|
-
|
5864
|
-
|
5865
|
-
|
5866
|
-
|
5867
|
-
|
5868
|
-
|
5869
|
-
|
5870
|
-
|
5871
|
-
|
5872
|
-
|
5873
|
-
|
5874
|
-
|
5875
|
-
|
5876
|
-
|
5877
|
-
|
5878
|
-
|
5879
|
-
|
5880
|
-
|
5881
|
-
|
5882
|
-
|
5883
|
-
return setDrawerOpen(function (isDrawerOpen) {
|
5884
|
-
return !isDrawerOpen;
|
5885
|
-
});
|
5886
|
-
}
|
5887
|
-
},
|
5888
|
-
elements: {
|
5889
|
-
drawer: drawer,
|
5890
|
-
extra: extra
|
5891
|
-
},
|
5892
|
-
onClose: onClose,
|
5893
|
-
props: otherProps,
|
5894
|
-
showCloseButton: showCloseButton,
|
5895
|
-
size: size,
|
5896
|
-
ref: ref
|
5897
|
-
};
|
5898
|
-
}, [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]);
|
5785
|
+
const Dialog = /*#__PURE__*/React.forwardRef(function Dialog(props, ref) {
|
5786
|
+
const {
|
5787
|
+
children: initialChildren,
|
5788
|
+
closeOnEscape = true,
|
5789
|
+
defaultOpen,
|
5790
|
+
draggable = false,
|
5791
|
+
onChange,
|
5792
|
+
onClose,
|
5793
|
+
open,
|
5794
|
+
showCloseButton = true,
|
5795
|
+
size = 'sm',
|
5796
|
+
trigger,
|
5797
|
+
...otherProps
|
5798
|
+
} = props;
|
5799
|
+
const [children, drawer, extra] = useSeparatedChildren(initialChildren);
|
5800
|
+
const [drawerOpen, setDrawerOpen] = React.useState(false);
|
5801
|
+
const context = React.useMemo(() => ({
|
5802
|
+
closeOnEscape,
|
5803
|
+
draggable,
|
5804
|
+
drawer: {
|
5805
|
+
open: drawerOpen,
|
5806
|
+
toggle: () => setDrawerOpen(isDrawerOpen => !isDrawerOpen)
|
5807
|
+
},
|
5808
|
+
elements: {
|
5809
|
+
drawer,
|
5810
|
+
extra
|
5811
|
+
},
|
5812
|
+
onClose,
|
5813
|
+
props: otherProps,
|
5814
|
+
showCloseButton,
|
5815
|
+
size,
|
5816
|
+
ref
|
5817
|
+
}), [closeOnEscape, drawerOpen, draggable, drawer, extra, open, otherProps, showCloseButton]);
|
5899
5818
|
return React.createElement(DialogContext.Provider, {
|
5900
5819
|
value: context
|
5901
5820
|
}, React.createElement(DialogPrimitive.Root, {
|
@@ -5912,19 +5831,18 @@ Dialog.Extra = Extra;
|
|
5912
5831
|
Dialog.Drawer = Drawer;
|
5913
5832
|
Dialog.Close = Close$2;
|
5914
5833
|
|
5915
|
-
|
5916
|
-
|
5917
|
-
|
5918
|
-
|
5919
|
-
|
5920
|
-
|
5921
|
-
|
5922
|
-
|
5923
|
-
|
5924
|
-
var className = cn('flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]', {
|
5834
|
+
const Field = /*#__PURE__*/React.forwardRef(function Field(props, ref) {
|
5835
|
+
const {
|
5836
|
+
disabled,
|
5837
|
+
children,
|
5838
|
+
invalid = false,
|
5839
|
+
message,
|
5840
|
+
...otherProps
|
5841
|
+
} = props;
|
5842
|
+
const className = cn('flex flex-col font-bold text-xs leading-loose pb-4 min-h-[theme(spacing.18)]', {
|
5925
5843
|
'text-grey-dark': disabled
|
5926
5844
|
}, props.className);
|
5927
|
-
|
5845
|
+
const messageClassName = cn('h-4 text-xs text-left leading-normal font-normal truncate -mb-4', {
|
5928
5846
|
'text-grey-darkest': !invalid,
|
5929
5847
|
'text-red': invalid,
|
5930
5848
|
'opacity-50': disabled
|
@@ -5939,13 +5857,12 @@ var Field = /*#__PURE__*/React.forwardRef(function Field(props, ref) {
|
|
5939
5857
|
}, message));
|
5940
5858
|
});
|
5941
5859
|
|
5942
|
-
|
5943
|
-
|
5944
|
-
|
5945
|
-
|
5946
|
-
|
5947
|
-
|
5948
|
-
var className = cn('yt-form', {
|
5860
|
+
const Form = /*#__PURE__*/React.forwardRef(function Form(props, ref) {
|
5861
|
+
const {
|
5862
|
+
horizontal = false,
|
5863
|
+
...otherProps
|
5864
|
+
} = props;
|
5865
|
+
const className = cn('yt-form', {
|
5949
5866
|
'yt-form--horizontal flex flex-wrap': horizontal
|
5950
5867
|
}, props.className);
|
5951
5868
|
return React.createElement("form", Object.assign({}, otherProps, {
|
@@ -5955,13 +5872,12 @@ var Form = /*#__PURE__*/React.forwardRef(function Form(props, ref) {
|
|
5955
5872
|
}));
|
5956
5873
|
});
|
5957
5874
|
|
5958
|
-
|
5959
|
-
|
5960
|
-
|
5961
|
-
|
5962
|
-
|
5963
|
-
|
5964
|
-
var className = cn('flex ', props.className);
|
5875
|
+
const Group = /*#__PURE__*/React.forwardRef(function Group(props, ref) {
|
5876
|
+
const {
|
5877
|
+
as: Tag = 'span',
|
5878
|
+
...otherProps
|
5879
|
+
} = props;
|
5880
|
+
const className = cn('flex ', props.className);
|
5965
5881
|
return React.createElement(Tag, Object.assign({}, otherProps, {
|
5966
5882
|
className: className,
|
5967
5883
|
"data-taco": "group",
|
@@ -5969,19 +5885,18 @@ var Group = /*#__PURE__*/React.forwardRef(function Group(props, ref) {
|
|
5969
5885
|
}));
|
5970
5886
|
});
|
5971
5887
|
|
5972
|
-
|
5973
|
-
var HangerContext = /*#__PURE__*/React.createContext({
|
5888
|
+
const HangerContext = /*#__PURE__*/React.createContext({
|
5974
5889
|
props: {},
|
5975
5890
|
ref: null
|
5976
5891
|
});
|
5977
|
-
|
5892
|
+
const Anchor = /*#__PURE__*/React.forwardRef(function HangerAnchor(props, ref) {
|
5978
5893
|
var _props$children;
|
5979
5894
|
|
5980
|
-
|
5981
|
-
|
5895
|
+
const context = React.useContext(HangerContext);
|
5896
|
+
let children = props.children;
|
5982
5897
|
|
5983
5898
|
if (React.isValidElement(props.children) && typeof ((_props$children = props.children) === null || _props$children === void 0 ? void 0 : _props$children.type) === 'function') {
|
5984
|
-
console.warn(
|
5899
|
+
console.warn(`Hanger.Anchor requires its child to forwardRef so that it can attach to the dom element. Did you mean to wrap '${props.children.type.name}' in React.forwardRef()? Taco has wrapped '${props.children.type.name}' in a 'span' to maintain functionality, but this may cause unintended behaviour`);
|
5985
5900
|
children = React.createElement("span", null, props.children);
|
5986
5901
|
}
|
5987
5902
|
|
@@ -5991,22 +5906,21 @@ var Anchor = /*#__PURE__*/React.forwardRef(function HangerAnchor(props, ref) {
|
|
5991
5906
|
asChild: true
|
5992
5907
|
}));
|
5993
5908
|
});
|
5994
|
-
|
5995
|
-
|
5909
|
+
const Title$1 = /*#__PURE__*/React.forwardRef(function DialogTitle(props, ref) {
|
5910
|
+
const className = cn('mb-1 text-base font-bold flex w-full', props.className);
|
5996
5911
|
return React.createElement("span", Object.assign({}, props, {
|
5997
5912
|
className: className,
|
5998
5913
|
ref: ref
|
5999
5914
|
}));
|
6000
5915
|
});
|
6001
|
-
|
6002
|
-
|
6003
|
-
|
6004
|
-
|
6005
|
-
|
6006
|
-
|
6007
|
-
var className = cn('wcag-blue border border-transparent rounded p-3 pr-12 yt-shadow z-[996] focus:border-transparent max-w-sm', props.className);
|
5916
|
+
const Content$3 = /*#__PURE__*/React.forwardRef(function HangerContent(props, ref) {
|
5917
|
+
const context = React.useContext(HangerContext);
|
5918
|
+
const {
|
5919
|
+
texts
|
5920
|
+
} = useLocalization();
|
5921
|
+
const className = cn('wcag-blue border border-transparent rounded p-3 pr-12 yt-shadow z-[996] focus:border-transparent max-w-sm', props.className);
|
6008
5922
|
|
6009
|
-
|
5923
|
+
const handleInteractOutside = event => {
|
6010
5924
|
event.preventDefault();
|
6011
5925
|
};
|
6012
5926
|
|
@@ -6028,25 +5942,20 @@ var Content$3 = /*#__PURE__*/React.forwardRef(function HangerContent(props, ref)
|
|
6028
5942
|
onClick: context.props.onClose
|
6029
5943
|
})));
|
6030
5944
|
});
|
6031
|
-
|
6032
|
-
|
6033
|
-
|
6034
|
-
|
6035
|
-
|
6036
|
-
|
6037
|
-
|
6038
|
-
|
6039
|
-
|
6040
|
-
|
6041
|
-
|
6042
|
-
};
|
6043
|
-
}, [otherProps]); // we do this to ensure hangers are mounted after their containers, e.g. if the container is another portal
|
6044
|
-
|
6045
|
-
var _React$useState = React.useState(false),
|
6046
|
-
open = _React$useState[0],
|
6047
|
-
setOpen = _React$useState[1];
|
5945
|
+
const Hanger = /*#__PURE__*/React.forwardRef(function Hanger(props, ref) {
|
5946
|
+
const {
|
5947
|
+
anchor,
|
5948
|
+
children,
|
5949
|
+
defaultOpen = true,
|
5950
|
+
...otherProps
|
5951
|
+
} = props;
|
5952
|
+
const context = React.useMemo(() => ({
|
5953
|
+
props: otherProps,
|
5954
|
+
ref
|
5955
|
+
}), [otherProps]); // we do this to ensure hangers are mounted after their containers, e.g. if the container is another portal
|
6048
5956
|
|
6049
|
-
React.
|
5957
|
+
const [open, setOpen] = React.useState(false);
|
5958
|
+
React.useEffect(() => {
|
6050
5959
|
if (defaultOpen) {
|
6051
5960
|
setOpen(defaultOpen);
|
6052
5961
|
}
|
@@ -6062,25 +5971,25 @@ Hanger.Anchor = Anchor;
|
|
6062
5971
|
Hanger.Content = Content$3;
|
6063
5972
|
Hanger.Title = Title$1;
|
6064
5973
|
|
6065
|
-
|
6066
|
-
var Trigger$3 = /*#__PURE__*/React.forwardRef(function HoverCardTrigger(props, ref) {
|
5974
|
+
const Trigger$3 = /*#__PURE__*/React.forwardRef(function HoverCardTrigger(props, ref) {
|
6067
5975
|
return React.createElement(HoverCardPrimitive.Trigger, Object.assign({}, props, {
|
6068
5976
|
asChild: true,
|
6069
5977
|
ref: ref
|
6070
5978
|
}));
|
6071
5979
|
});
|
6072
|
-
|
6073
|
-
|
6074
|
-
|
6075
|
-
|
6076
|
-
|
5980
|
+
const Content$4 = /*#__PURE__*/React.forwardRef(function HoverCardContent(externalProps, ref) {
|
5981
|
+
const {
|
5982
|
+
placement,
|
5983
|
+
...props
|
5984
|
+
} = externalProps;
|
5985
|
+
const className = cn('bg-white rounded p-3 yt-shadow', props.className);
|
6077
5986
|
return React.createElement(HoverCardPrimitive.Content, Object.assign({}, props, {
|
6078
5987
|
className: className,
|
6079
5988
|
ref: ref,
|
6080
5989
|
side: placement
|
6081
5990
|
}));
|
6082
5991
|
});
|
6083
|
-
|
5992
|
+
const HoverCard = props => {
|
6084
5993
|
return React.createElement(HoverCardPrimitive.Root, Object.assign({}, props, {
|
6085
5994
|
openDelay: 300
|
6086
5995
|
}));
|
@@ -6088,24 +5997,24 @@ var HoverCard = function HoverCard(props) {
|
|
6088
5997
|
HoverCard.Trigger = Trigger$3;
|
6089
5998
|
HoverCard.Content = Content$4;
|
6090
5999
|
|
6091
|
-
|
6092
|
-
|
6093
|
-
|
6094
|
-
|
6095
|
-
|
6096
|
-
|
6097
|
-
|
6000
|
+
const SearchInput = /*#__PURE__*/React.forwardRef(function SearchInput({
|
6001
|
+
onSearch,
|
6002
|
+
...props
|
6003
|
+
}, ref) {
|
6004
|
+
const {
|
6005
|
+
texts
|
6006
|
+
} = useLocalization();
|
6098
6007
|
|
6099
|
-
|
6008
|
+
const handleClick = () => {
|
6100
6009
|
if (!props.disabled) {
|
6101
6010
|
onSearch === null || onSearch === void 0 ? void 0 : onSearch(props.value);
|
6102
6011
|
}
|
6103
6012
|
};
|
6104
6013
|
|
6105
|
-
|
6014
|
+
const handleKeyDown = event => {
|
6106
6015
|
var _props$onKeyDown;
|
6107
6016
|
|
6108
|
-
|
6017
|
+
const isEnterKeyPressed = event.keyCode === keycode('enter');
|
6109
6018
|
|
6110
6019
|
if (isEnterKeyPressed) {
|
6111
6020
|
handleClick();
|
@@ -6474,49 +6383,49 @@ const useMultiListbox = ({
|
|
6474
6383
|
};
|
6475
6384
|
};
|
6476
6385
|
|
6477
|
-
|
6478
|
-
|
6479
|
-
|
6480
|
-
|
6481
|
-
|
6482
|
-
|
6483
|
-
|
6484
|
-
|
6485
|
-
|
6486
|
-
|
6487
|
-
var className = cn('bg-white inline-flex relative w-full', externalClassName);
|
6386
|
+
const Listbox = /*#__PURE__*/React.forwardRef(function Listbox(props, ref) {
|
6387
|
+
const {
|
6388
|
+
className: externalClassName,
|
6389
|
+
...otherProps
|
6390
|
+
} = props;
|
6391
|
+
const {
|
6392
|
+
list,
|
6393
|
+
input
|
6394
|
+
} = useListbox(otherProps, ref);
|
6395
|
+
const className = cn('bg-white inline-flex relative w-full', externalClassName);
|
6488
6396
|
return React.createElement("span", {
|
6489
6397
|
"data-taco": "listbox",
|
6490
6398
|
className: className
|
6491
6399
|
}, React.createElement(ScrollableList, Object.assign({}, list, {
|
6492
|
-
style:
|
6400
|
+
style: { ...list.style,
|
6493
6401
|
maxHeight: 'calc(12rem + 2px)'
|
6494
6402
|
/* (6 * option height) + listbox border */
|
6495
6403
|
|
6496
|
-
}
|
6404
|
+
}
|
6497
6405
|
})), React.createElement("input", Object.assign({}, input, {
|
6498
6406
|
className: "hidden",
|
6499
6407
|
type: "text"
|
6500
6408
|
})));
|
6501
6409
|
});
|
6502
|
-
|
6503
|
-
|
6504
|
-
|
6505
|
-
|
6506
|
-
|
6507
|
-
|
6508
|
-
|
6509
|
-
|
6510
|
-
|
6410
|
+
const MultiListbox = /*#__PURE__*/React.forwardRef(function Listbox(props, ref) {
|
6411
|
+
const {
|
6412
|
+
className: externalClassName,
|
6413
|
+
...otherProps
|
6414
|
+
} = props;
|
6415
|
+
const {
|
6416
|
+
list,
|
6417
|
+
input
|
6418
|
+
} = useMultiListbox(otherProps, ref);
|
6419
|
+
const className = cn('bg-white inline-flex relative w-full', externalClassName);
|
6511
6420
|
return React.createElement("span", {
|
6512
6421
|
"data-taco": "listbox",
|
6513
6422
|
className: className
|
6514
6423
|
}, React.createElement(ScrollableList, Object.assign({}, list, {
|
6515
|
-
style:
|
6424
|
+
style: { ...list.style,
|
6516
6425
|
maxHeight: 'calc(12rem + 2px + 2px)'
|
6517
6426
|
/* (6 * option height) + listbox border + ALL_OPTIONS bottom border */
|
6518
6427
|
|
6519
|
-
}
|
6428
|
+
}
|
6520
6429
|
})), React.createElement("input", Object.assign({}, input, {
|
6521
6430
|
className: "hidden",
|
6522
6431
|
type: "text"
|
@@ -6699,34 +6608,26 @@ const Checkbox$1 = props => {
|
|
6699
6608
|
})), children);
|
6700
6609
|
};
|
6701
6610
|
|
6702
|
-
|
6703
|
-
|
6704
|
-
|
6705
|
-
return String(value !== null && value !== void 0 ? value : '');
|
6706
|
-
};
|
6707
|
-
var findByValue$1 = function findByValue(values, valueAsString) {
|
6708
|
-
return values.find(function (value) {
|
6709
|
-
return getRadioGroupItemValueAsString(value) === valueAsString;
|
6710
|
-
});
|
6711
|
-
};
|
6712
|
-
var RadioGroupContext = /*#__PURE__*/React.createContext({
|
6611
|
+
const getRadioGroupItemValueAsString = value => String(value !== null && value !== void 0 ? value : '');
|
6612
|
+
const findByValue$1 = (values, valueAsString) => values.find(value => getRadioGroupItemValueAsString(value) === valueAsString);
|
6613
|
+
const RadioGroupContext = /*#__PURE__*/React.createContext({
|
6713
6614
|
disabled: false,
|
6714
6615
|
invalid: false
|
6715
6616
|
});
|
6716
|
-
|
6717
|
-
|
6718
|
-
|
6719
|
-
|
6720
|
-
|
6721
|
-
|
6722
|
-
|
6723
|
-
|
6724
|
-
|
6617
|
+
const RadioGroupItem = /*#__PURE__*/React.forwardRef(function RadioGroupItem(props, ref) {
|
6618
|
+
const context = React.useContext(RadioGroupContext);
|
6619
|
+
const {
|
6620
|
+
children,
|
6621
|
+
value,
|
6622
|
+
...otherProps
|
6623
|
+
} = props;
|
6624
|
+
const isDisabled = context.disabled || props.disabled;
|
6625
|
+
const className = cn('flex flex-shrink-0 self-start items-center justify-center h-4 w-4 mt-[0.2rem] rounded-full bg-white border-2', {
|
6725
6626
|
'border-grey-dark hover:border-4 focus:yt-focus aria-checked:bg-blue aria-checked:border-blue hover:aria-checked:border-blue-light': !isDisabled && !context.invalid,
|
6726
6627
|
'border-grey cursor-not-allowed aria-checked:bg-blue-light aria-checked:border-blue-light ': isDisabled,
|
6727
6628
|
'border-red hover:border-4 text-red focus:border-red focus:yt-focus-red aria-checked:bg-red aria-checked:border-red': context.invalid && !isDisabled
|
6728
6629
|
});
|
6729
|
-
|
6630
|
+
const labelClassName = cn('flex items-center gap-2', {
|
6730
6631
|
'cursor-pointer': !isDisabled,
|
6731
6632
|
'cursor-not-allowed text-grey-dark': isDisabled
|
6732
6633
|
}, props.className);
|
@@ -6741,38 +6642,34 @@ var RadioGroupItem = /*#__PURE__*/React.forwardRef(function RadioGroupItem(props
|
|
6741
6642
|
className: "h-2 w-2 rounded-full bg-white"
|
6742
6643
|
})), children);
|
6743
6644
|
});
|
6744
|
-
|
6745
|
-
|
6746
|
-
|
6747
|
-
|
6748
|
-
|
6749
|
-
|
6750
|
-
|
6751
|
-
|
6752
|
-
|
6753
|
-
|
6754
|
-
|
6755
|
-
|
6756
|
-
|
6757
|
-
React.Children.forEach(children,
|
6645
|
+
const useRadioGroup = props => {
|
6646
|
+
const {
|
6647
|
+
children,
|
6648
|
+
defaultValue,
|
6649
|
+
disabled,
|
6650
|
+
invalid,
|
6651
|
+
onChange,
|
6652
|
+
orientation = 'vertical',
|
6653
|
+
value,
|
6654
|
+
...otherProps
|
6655
|
+
} = props;
|
6656
|
+
const values = React.useMemo(() => {
|
6657
|
+
const radioGroupItemValues = [];
|
6658
|
+
React.Children.forEach(children, child => {
|
6758
6659
|
if (React.isValidElement(child)) {
|
6759
6660
|
radioGroupItemValues.push(child.props.value);
|
6760
6661
|
}
|
6761
6662
|
});
|
6762
6663
|
return radioGroupItemValues;
|
6763
6664
|
}, [children]);
|
6764
|
-
|
6765
|
-
|
6766
|
-
|
6767
|
-
|
6768
|
-
|
6769
|
-
}, [disabled, invalid]);
|
6770
|
-
var valueProps;
|
6665
|
+
const context = React.useMemo(() => ({
|
6666
|
+
disabled: disabled !== null && disabled !== void 0 ? disabled : false,
|
6667
|
+
invalid: invalid !== null && invalid !== void 0 ? invalid : false
|
6668
|
+
}), [disabled, invalid]);
|
6669
|
+
let valueProps;
|
6771
6670
|
|
6772
6671
|
if (onChange !== undefined) {
|
6773
|
-
|
6774
|
-
return onChange(findByValue$1(values, value));
|
6775
|
-
};
|
6672
|
+
const handleChange = value => onChange(findByValue$1(values, value));
|
6776
6673
|
|
6777
6674
|
valueProps = {
|
6778
6675
|
onValueChange: handleChange,
|
@@ -6785,19 +6682,20 @@ var useRadioGroup = function useRadioGroup(props) {
|
|
6785
6682
|
}
|
6786
6683
|
|
6787
6684
|
return {
|
6788
|
-
context
|
6789
|
-
props:
|
6790
|
-
|
6791
|
-
|
6792
|
-
|
6685
|
+
context,
|
6686
|
+
props: { ...otherProps,
|
6687
|
+
...valueProps,
|
6688
|
+
children,
|
6689
|
+
orientation
|
6690
|
+
}
|
6793
6691
|
};
|
6794
6692
|
};
|
6795
|
-
|
6796
|
-
|
6797
|
-
|
6798
|
-
|
6799
|
-
|
6800
|
-
|
6693
|
+
const RadioGroup = /*#__PURE__*/React.forwardRef(function RadioGroup(props, ref) {
|
6694
|
+
const {
|
6695
|
+
context,
|
6696
|
+
props: otherProps
|
6697
|
+
} = useRadioGroup(props);
|
6698
|
+
const className = cn('flex items-start gap-y-2', {
|
6801
6699
|
'flex-wrap gap-x-4 ': otherProps.orientation === 'horizontal',
|
6802
6700
|
'flex-col': otherProps.orientation === 'vertical'
|
6803
6701
|
}, otherProps.className);
|
@@ -6868,39 +6766,22 @@ const Header = props => {
|
|
6868
6766
|
}));
|
6869
6767
|
};
|
6870
6768
|
|
6871
|
-
|
6872
|
-
|
6873
|
-
|
6874
|
-
|
6875
|
-
|
6876
|
-
|
6877
|
-
|
6878
|
-
|
6879
|
-
|
6880
|
-
|
6881
|
-
|
6882
|
-
|
6883
|
-
|
6884
|
-
|
6885
|
-
|
6886
|
-
|
6887
|
-
_setMinWidth = _React$useState3[1];
|
6888
|
-
|
6889
|
-
var context = React.useMemo(function () {
|
6890
|
-
return {
|
6891
|
-
indented: indented,
|
6892
|
-
registerIndentation: function registerIndentation() {
|
6893
|
-
return setIndented(true);
|
6894
|
-
},
|
6895
|
-
minWidth: minWidth,
|
6896
|
-
setMinWidth: function setMinWidth(width) {
|
6897
|
-
return _setMinWidth(width);
|
6898
|
-
},
|
6899
|
-
close: function close() {
|
6900
|
-
return setOpen(false);
|
6901
|
-
}
|
6902
|
-
};
|
6903
|
-
}, [indented, minWidth]);
|
6769
|
+
const Menu$1 = externalProps => {
|
6770
|
+
const {
|
6771
|
+
children,
|
6772
|
+
trigger,
|
6773
|
+
...props
|
6774
|
+
} = externalProps;
|
6775
|
+
const [open, setOpen] = React.useState(false);
|
6776
|
+
const [indented, setIndented] = React.useState(false);
|
6777
|
+
const [minWidth, setMinWidth] = React.useState(undefined);
|
6778
|
+
const context = React.useMemo(() => ({
|
6779
|
+
indented,
|
6780
|
+
registerIndentation: () => setIndented(true),
|
6781
|
+
minWidth,
|
6782
|
+
setMinWidth: width => setMinWidth(width),
|
6783
|
+
close: () => setOpen(false)
|
6784
|
+
}), [indented, minWidth]);
|
6904
6785
|
return React.createElement(MenuContext.Provider, {
|
6905
6786
|
value: context
|
6906
6787
|
}, React.createElement(DropdownMenuPrimitive.Root, Object.assign({}, props, {
|
@@ -6918,44 +6799,39 @@ Menu$1.Separator = Separator;
|
|
6918
6799
|
Menu$1.Header = Header;
|
6919
6800
|
Menu$1.RadioGroup = RadioGroup$1;
|
6920
6801
|
|
6921
|
-
|
6922
|
-
var TreeviewItem = /*#__PURE__*/React__default.forwardRef(function TreeviewItem(props, ref) {
|
6802
|
+
const TreeviewItem = /*#__PURE__*/React__default.forwardRef(function TreeviewItem(props, ref) {
|
6923
6803
|
return React__default.createElement("a", Object.assign({}, props, {
|
6924
6804
|
ref: ref
|
6925
6805
|
}));
|
6926
6806
|
});
|
6927
|
-
|
6928
|
-
|
6929
|
-
|
6930
|
-
|
6931
|
-
|
6932
|
-
|
6933
|
-
|
6934
|
-
|
6935
|
-
|
6936
|
-
|
6937
|
-
|
6938
|
-
|
6939
|
-
setExpanded = _React$useState[1];
|
6940
|
-
|
6941
|
-
React__default.useEffect(function () {
|
6807
|
+
const TreeviewGroup = /*#__PURE__*/React__default.forwardRef(function TreeviewGroup(props, ref) {
|
6808
|
+
const {
|
6809
|
+
children,
|
6810
|
+
className: externalClassName,
|
6811
|
+
expanded: initialExpanded = false,
|
6812
|
+
title,
|
6813
|
+
fixed,
|
6814
|
+
onClick,
|
6815
|
+
...otherProps
|
6816
|
+
} = props;
|
6817
|
+
const [expanded, setExpanded] = React__default.useState(fixed || initialExpanded);
|
6818
|
+
React__default.useEffect(() => {
|
6942
6819
|
if (!fixed) {
|
6943
6820
|
setExpanded(fixed || initialExpanded);
|
6944
6821
|
}
|
6945
6822
|
}, [fixed, initialExpanded]);
|
6946
|
-
|
6823
|
+
const listClassName = cn('flex-col mb-0', {
|
6947
6824
|
flex: expanded,
|
6948
6825
|
hidden: !expanded
|
6949
6826
|
});
|
6950
|
-
|
6951
|
-
var itemProps = _extends({}, otherProps, {
|
6827
|
+
const itemProps = { ...otherProps,
|
6952
6828
|
'aria-expanded': expanded,
|
6953
6829
|
role: 'treeitem',
|
6954
6830
|
tabIndex: -1
|
6955
|
-
}
|
6831
|
+
};
|
6956
6832
|
|
6957
|
-
|
6958
|
-
|
6833
|
+
const handleClick = event => {
|
6834
|
+
const nextState = !expanded;
|
6959
6835
|
|
6960
6836
|
if (!fixed) {
|
6961
6837
|
setExpanded(nextState);
|
@@ -6966,7 +6842,7 @@ var TreeviewGroup = /*#__PURE__*/React__default.forwardRef(function TreeviewGrou
|
|
6966
6842
|
}
|
6967
6843
|
};
|
6968
6844
|
|
6969
|
-
|
6845
|
+
const className = typeof externalClassName === 'function' ? externalClassName(expanded) : externalClassName;
|
6970
6846
|
return React__default.createElement("div", Object.assign({}, itemProps, {
|
6971
6847
|
className: className,
|
6972
6848
|
ref: ref
|
@@ -6975,18 +6851,14 @@ var TreeviewGroup = /*#__PURE__*/React__default.forwardRef(function TreeviewGrou
|
|
6975
6851
|
}, typeof title === 'function' ? title(expanded) : title), React__default.createElement("ul", {
|
6976
6852
|
role: "group",
|
6977
6853
|
className: listClassName
|
6978
|
-
}, React__default.Children.toArray(children).filter(
|
6979
|
-
|
6980
|
-
|
6981
|
-
|
6982
|
-
|
6983
|
-
|
6984
|
-
}, React__default.cloneElement(item, {
|
6985
|
-
role: 'treeitem'
|
6986
|
-
}));
|
6987
|
-
})));
|
6854
|
+
}, React__default.Children.toArray(children).filter(item => !!item).map((item, i) => React__default.createElement("li", {
|
6855
|
+
key: i,
|
6856
|
+
role: "none"
|
6857
|
+
}, React__default.cloneElement(item, {
|
6858
|
+
role: 'treeitem'
|
6859
|
+
})))));
|
6988
6860
|
});
|
6989
|
-
|
6861
|
+
const Treeview = /*#__PURE__*/React__default.forwardRef(function Treeview(props, ref) {
|
6990
6862
|
return React__default.createElement("div", Object.assign({}, props, {
|
6991
6863
|
ref: ref,
|
6992
6864
|
role: "tree"
|
@@ -7029,25 +6901,20 @@ const useDropTarget = onDrop => {
|
|
7029
6901
|
return [isDraggedOver, props];
|
7030
6902
|
};
|
7031
6903
|
|
7032
|
-
|
7033
|
-
|
7034
|
-
|
7035
|
-
|
7036
|
-
|
7037
|
-
|
7038
|
-
|
7039
|
-
|
7040
|
-
|
7041
|
-
|
7042
|
-
|
7043
|
-
|
7044
|
-
|
7045
|
-
|
7046
|
-
isDraggedOver = _useDropTarget[0],
|
7047
|
-
dropTargetProps = _useDropTarget[1];
|
7048
|
-
|
7049
|
-
var isTreeitem = role === 'treeitem';
|
7050
|
-
var className = cn('yt-navigation__item cursor-pointer', {
|
6904
|
+
const Item$2 = /*#__PURE__*/React__default.forwardRef(function Item(props, ref) {
|
6905
|
+
const {
|
6906
|
+
active,
|
6907
|
+
children,
|
6908
|
+
onDrop,
|
6909
|
+
postfix,
|
6910
|
+
prefix,
|
6911
|
+
role,
|
6912
|
+
...otherProps
|
6913
|
+
} = props;
|
6914
|
+
const proxyRef = useProxiedRef(ref);
|
6915
|
+
const [isDraggedOver, dropTargetProps] = useDropTarget(onDrop);
|
6916
|
+
const isTreeitem = role === 'treeitem';
|
6917
|
+
const className = cn('yt-navigation__item cursor-pointer', {
|
7051
6918
|
'w-full mb-px py-1 px-3 flex items-center hover:bg-grey-dark': isTreeitem,
|
7052
6919
|
'bg-white w-full h-10 px-3 flex-shrink-0 flex items-center justify-between cursor-pointer': !isTreeitem,
|
7053
6920
|
'yt-navigation__item--active': active && !isDraggedOver,
|
@@ -7055,7 +6922,7 @@ var Item$2 = /*#__PURE__*/React__default.forwardRef(function Item(props, ref) {
|
|
7055
6922
|
'yt-navigation__item--dropping bg-blue': isDraggedOver
|
7056
6923
|
}, props.className);
|
7057
6924
|
|
7058
|
-
|
6925
|
+
const handleClick = event => {
|
7059
6926
|
if (event.target instanceof HTMLAnchorElement || event.target instanceof HTMLButtonElement) {
|
7060
6927
|
return;
|
7061
6928
|
}
|
@@ -7078,19 +6945,19 @@ var Item$2 = /*#__PURE__*/React__default.forwardRef(function Item(props, ref) {
|
|
7078
6945
|
className: "yt-navigation__item__postfix ml-1"
|
7079
6946
|
}, postfix));
|
7080
6947
|
});
|
7081
|
-
|
6948
|
+
const Panel = /*#__PURE__*/React__default.forwardRef(function Panel(props, ref) {
|
7082
6949
|
return React__default.createElement("div", Object.assign({}, props, {
|
7083
6950
|
className: cn('w-full bg-white p-3', props.className),
|
7084
6951
|
ref: ref
|
7085
6952
|
}));
|
7086
6953
|
});
|
7087
|
-
|
7088
|
-
|
6954
|
+
const MenuGroup = /*#__PURE__*/React__default.forwardRef(function MenuGroup(props, ref) {
|
6955
|
+
const className = cn('flex-shrink-0 space-y-1 outline-none', {
|
7089
6956
|
'bg-white pb-2': props.fixed
|
7090
6957
|
}, props.className);
|
7091
6958
|
|
7092
|
-
|
7093
|
-
|
6959
|
+
const title = expanded => {
|
6960
|
+
const className = cn('bg-white h-10 pl-3 pr-1 flex items-center justify-between w-full', {
|
7094
6961
|
'mb-1': expanded,
|
7095
6962
|
'cursor-pointer hover:text-blue': !props.fixed
|
7096
6963
|
});
|
@@ -7107,16 +6974,14 @@ var MenuGroup = /*#__PURE__*/React__default.forwardRef(function MenuGroup(props,
|
|
7107
6974
|
ref: ref
|
7108
6975
|
}));
|
7109
6976
|
});
|
7110
|
-
|
7111
|
-
|
7112
|
-
|
7113
|
-
React__default.Children.toArray(props.children).filter(
|
7114
|
-
return !!child;
|
7115
|
-
}).map(function (child) {
|
6977
|
+
const Menu$2 = /*#__PURE__*/React__default.forwardRef(function Menu(props, ref) {
|
6978
|
+
const scrollableAreas = React__default.useMemo(() => {
|
6979
|
+
const scrollableAreas = [];
|
6980
|
+
React__default.Children.toArray(props.children).filter(child => !!child).map(child => {
|
7116
6981
|
if (child.props.fixed) {
|
7117
6982
|
scrollableAreas.push(child);
|
7118
6983
|
} else {
|
7119
|
-
|
6984
|
+
const x = scrollableAreas[scrollableAreas.length - 1];
|
7120
6985
|
|
7121
6986
|
if (Array.isArray(x)) {
|
7122
6987
|
x.push(child);
|
@@ -7130,19 +6995,18 @@ var Menu$2 = /*#__PURE__*/React__default.forwardRef(function Menu(props, ref) {
|
|
7130
6995
|
return React__default.createElement(Treeview, Object.assign({}, props, {
|
7131
6996
|
className: cn('divide-grey-light flex flex-grow flex-col divide-y-2 overflow-y-auto', props.className),
|
7132
6997
|
ref: ref
|
7133
|
-
}), scrollableAreas.map(
|
7134
|
-
|
7135
|
-
|
7136
|
-
|
7137
|
-
}, area) : area;
|
7138
|
-
}));
|
6998
|
+
}), scrollableAreas.map((area, i) => Array.isArray(area) ? React__default.createElement("div", {
|
6999
|
+
className: "divide-grey-light flex h-0 flex-auto flex-shrink-0 flex-grow flex-col divide-y-2 overflow-y-auto",
|
7000
|
+
key: i
|
7001
|
+
}, area) : area));
|
7139
7002
|
});
|
7140
7003
|
Menu$2.Group = MenuGroup;
|
7141
|
-
|
7142
|
-
|
7143
|
-
|
7144
|
-
|
7145
|
-
|
7004
|
+
const Navigation = /*#__PURE__*/React__default.forwardRef(function Navigation(props, ref) {
|
7005
|
+
const {
|
7006
|
+
children,
|
7007
|
+
...otherProps
|
7008
|
+
} = props;
|
7009
|
+
const className = cn('h-full flex flex-col bg-grey-light divide-y-2 divide-grey-light', props.className);
|
7146
7010
|
return React__default.createElement("div", Object.assign({}, otherProps, {
|
7147
7011
|
className: className,
|
7148
7012
|
"data-taco": "navigation",
|
@@ -7398,54 +7262,52 @@ const useSelect = ({
|
|
7398
7262
|
};
|
7399
7263
|
};
|
7400
7264
|
|
7401
|
-
|
7402
|
-
|
7403
|
-
|
7404
|
-
|
7405
|
-
|
7406
|
-
|
7407
|
-
|
7408
|
-
|
7409
|
-
|
7410
|
-
|
7411
|
-
|
7412
|
-
|
7413
|
-
|
7414
|
-
|
7415
|
-
|
7416
|
-
|
7417
|
-
|
7418
|
-
|
7419
|
-
|
7420
|
-
var className = cn('inline-flex relative w-full', {
|
7265
|
+
const BaseSelect = /*#__PURE__*/React.forwardRef(function BaseSelect(props, ref) {
|
7266
|
+
const {
|
7267
|
+
autoFocus,
|
7268
|
+
className: externalClassName,
|
7269
|
+
highlighted,
|
7270
|
+
style,
|
7271
|
+
...otherProps
|
7272
|
+
} = props;
|
7273
|
+
const {
|
7274
|
+
button,
|
7275
|
+
listbox,
|
7276
|
+
popover,
|
7277
|
+
input,
|
7278
|
+
text,
|
7279
|
+
more = 0
|
7280
|
+
} = useSelect(otherProps, ref);
|
7281
|
+
const internalRef = React.useRef(null);
|
7282
|
+
const selectDimensions = useBoundingClientRectListener(internalRef);
|
7283
|
+
const className = cn('inline-flex relative w-full', {
|
7421
7284
|
'yt-select--readonly': props.readOnly
|
7422
7285
|
}, externalClassName);
|
7423
|
-
|
7286
|
+
const inputClassname = cn(getInputClasses(props), 'h-8 text-left pr-0', {
|
7424
7287
|
'border-blue': popover.open
|
7425
7288
|
});
|
7426
|
-
React.useEffect(
|
7289
|
+
React.useEffect(() => {
|
7427
7290
|
if (autoFocus && internalRef.current) {
|
7428
7291
|
internalRef.current.focus();
|
7429
7292
|
}
|
7430
7293
|
}, []);
|
7431
7294
|
|
7432
|
-
|
7295
|
+
const renderMultiSelection = () => {
|
7433
7296
|
return React.createElement(React.Fragment, null, React.createElement("span", {
|
7434
7297
|
className: "flex-grow truncate text-left"
|
7435
7298
|
}, text), more > 0 && React.createElement(Badge, {
|
7436
7299
|
className: "ml-2"
|
7437
|
-
},
|
7300
|
+
}, `+${more}`));
|
7438
7301
|
};
|
7439
7302
|
|
7440
|
-
|
7303
|
+
const commonListboxProps = { ...listbox,
|
7441
7304
|
className: 'w-auto',
|
7442
7305
|
invalid: undefined,
|
7443
7306
|
style: {
|
7444
7307
|
minWidth: selectDimensions === null || selectDimensions === void 0 ? void 0 : selectDimensions.width
|
7445
7308
|
},
|
7446
7309
|
tabIndex: popover.open ? 0 : -1
|
7447
|
-
}
|
7448
|
-
|
7310
|
+
};
|
7449
7311
|
return React.createElement("span", {
|
7450
7312
|
className: className,
|
7451
7313
|
"data-taco": "select",
|
@@ -7468,9 +7330,11 @@ var BaseSelect = /*#__PURE__*/React.forwardRef(function BaseSelect(props, ref) {
|
|
7468
7330
|
type: "text"
|
7469
7331
|
}))));
|
7470
7332
|
});
|
7471
|
-
|
7472
|
-
|
7473
|
-
|
7333
|
+
const Select = /*#__PURE__*/React.forwardRef(function Select(props, ref) {
|
7334
|
+
const {
|
7335
|
+
editable,
|
7336
|
+
...otherProps
|
7337
|
+
} = props;
|
7474
7338
|
|
7475
7339
|
if (editable) {
|
7476
7340
|
return React.createElement(Combobox, Object.assign({}, otherProps, {
|
@@ -7541,47 +7405,41 @@ const usePagination = (initialPageIndex = 0, initialPageSize = 10) => {
|
|
7541
7405
|
};
|
7542
7406
|
};
|
7543
7407
|
|
7544
|
-
|
7545
|
-
|
7546
|
-
|
7547
|
-
var minItemIndex = pageIndex * pageSize + 1;
|
7548
|
-
var maxItemIndex = (pageIndex + 1) * pageSize;
|
7408
|
+
const getShowingLabel = (length, pageIndex, pageSize, texts) => {
|
7409
|
+
const minItemIndex = pageIndex * pageSize + 1;
|
7410
|
+
const maxItemIndex = (pageIndex + 1) * pageSize;
|
7549
7411
|
return texts.pagination.showingXofYofTotal.replace('[X]', length === 0 ? '0' : String(minItemIndex)).replace('[Y]', String(maxItemIndex > length ? length : maxItemIndex)).replace('[total]', String(length));
|
7550
7412
|
};
|
7551
7413
|
|
7552
|
-
|
7553
|
-
|
7554
|
-
|
7555
|
-
|
7556
|
-
|
7557
|
-
|
7558
|
-
|
7559
|
-
|
7560
|
-
|
7561
|
-
|
7562
|
-
|
7563
|
-
|
7564
|
-
|
7565
|
-
|
7566
|
-
|
7567
|
-
|
7568
|
-
|
7569
|
-
|
7570
|
-
|
7571
|
-
texts = _useLocalization.texts;
|
7572
|
-
|
7573
|
-
var maxPageIndex = Math.ceil(length / pageSize) - 1;
|
7574
|
-
var showShortcutTexts = dangerouslyHijackGlobalKeyboardNavigation;
|
7414
|
+
const Pagination = /*#__PURE__*/React.forwardRef(function Pagination(props, ref) {
|
7415
|
+
const {
|
7416
|
+
length,
|
7417
|
+
pageIndex,
|
7418
|
+
pageSize,
|
7419
|
+
pageSizes = [10, 25, 50, 100, 500],
|
7420
|
+
setPageIndex,
|
7421
|
+
setPageSize,
|
7422
|
+
showPageControls = true,
|
7423
|
+
showPageNumbers = true,
|
7424
|
+
showPageSize = true,
|
7425
|
+
dangerouslyHijackGlobalKeyboardNavigation = false,
|
7426
|
+
...otherProps
|
7427
|
+
} = props;
|
7428
|
+
const {
|
7429
|
+
texts
|
7430
|
+
} = useLocalization();
|
7431
|
+
const maxPageIndex = Math.ceil(length / pageSize) - 1;
|
7432
|
+
const showShortcutTexts = dangerouslyHijackGlobalKeyboardNavigation;
|
7575
7433
|
usePaginationShortcuts({
|
7576
|
-
setPageIndex
|
7577
|
-
maxPageIndex
|
7578
|
-
pageIndex
|
7579
|
-
dangerouslyHijackGlobalKeyboardNavigation
|
7434
|
+
setPageIndex,
|
7435
|
+
maxPageIndex,
|
7436
|
+
pageIndex,
|
7437
|
+
dangerouslyHijackGlobalKeyboardNavigation
|
7580
7438
|
});
|
7581
|
-
|
7582
|
-
|
7583
|
-
|
7584
|
-
|
7439
|
+
const pageCount = Math.ceil(length / pageSize);
|
7440
|
+
const canPreviousPage = pageIndex > 0;
|
7441
|
+
const canNextPage = pageIndex < pageCount - 1;
|
7442
|
+
const className = cn('inline-flex relative justify-between items-center', props.className);
|
7585
7443
|
return React.createElement("div", Object.assign({}, otherProps, {
|
7586
7444
|
className: className,
|
7587
7445
|
"data-taco": "pagination",
|
@@ -7591,13 +7449,11 @@ var Pagination = /*#__PURE__*/React.forwardRef(function Pagination(props, ref) {
|
|
7591
7449
|
}, getShowingLabel(length, pageIndex, pageSize, texts), React.createElement(Select, {
|
7592
7450
|
"aria-label": texts.pagination.pageSize,
|
7593
7451
|
className: "ml-4 !w-20",
|
7594
|
-
data: pageSizes.map(
|
7595
|
-
|
7596
|
-
|
7597
|
-
|
7598
|
-
|
7599
|
-
}),
|
7600
|
-
onChange: function onChange(event) {
|
7452
|
+
data: pageSizes.map(pageSize => ({
|
7453
|
+
text: String(pageSize),
|
7454
|
+
value: pageSize
|
7455
|
+
})),
|
7456
|
+
onChange: event => {
|
7601
7457
|
setPageIndex(0);
|
7602
7458
|
setPageSize(Number(event.target.value));
|
7603
7459
|
},
|
@@ -7609,18 +7465,14 @@ var Pagination = /*#__PURE__*/React.forwardRef(function Pagination(props, ref) {
|
|
7609
7465
|
appearance: "default",
|
7610
7466
|
disabled: !canPreviousPage,
|
7611
7467
|
icon: "arrow-start",
|
7612
|
-
onClick:
|
7613
|
-
return setPageIndex(0);
|
7614
|
-
},
|
7468
|
+
onClick: () => setPageIndex(0),
|
7615
7469
|
"aria-label": showShortcutTexts ? texts.pagination.actions.firstPageWithShortcut : texts.pagination.actions.firstPage,
|
7616
7470
|
tooltip: showShortcutTexts ? texts.pagination.actions.firstPageWithShortcut : texts.pagination.actions.firstPage
|
7617
7471
|
}), React.createElement(IconButton, {
|
7618
7472
|
appearance: "default",
|
7619
7473
|
disabled: !canPreviousPage,
|
7620
7474
|
icon: "arrow-left",
|
7621
|
-
onClick:
|
7622
|
-
return setPageIndex(pageIndex - 1);
|
7623
|
-
},
|
7475
|
+
onClick: () => setPageIndex(pageIndex - 1),
|
7624
7476
|
"aria-label": showShortcutTexts ? texts.pagination.actions.previousPageWithShortcut : texts.pagination.actions.previousPage,
|
7625
7477
|
tooltip: showShortcutTexts ? texts.pagination.actions.previousPageWithShortcut : texts.pagination.actions.previousPage
|
7626
7478
|
}), showPageNumbers && pageCount > 0 && React.createElement(PageNumbers, {
|
@@ -7631,43 +7483,36 @@ var Pagination = /*#__PURE__*/React.forwardRef(function Pagination(props, ref) {
|
|
7631
7483
|
appearance: "default",
|
7632
7484
|
disabled: !canNextPage,
|
7633
7485
|
icon: "arrow-right",
|
7634
|
-
onClick:
|
7635
|
-
return setPageIndex(pageIndex + 1);
|
7636
|
-
},
|
7486
|
+
onClick: () => setPageIndex(pageIndex + 1),
|
7637
7487
|
"aria-label": showShortcutTexts ? texts.pagination.actions.nextPageWithShortcut : texts.pagination.actions.nextPage,
|
7638
7488
|
tooltip: showShortcutTexts ? texts.pagination.actions.nextPageWithShortcut : texts.pagination.actions.nextPage
|
7639
7489
|
}), React.createElement(IconButton, {
|
7640
7490
|
appearance: "default",
|
7641
7491
|
disabled: !canNextPage,
|
7642
7492
|
icon: "arrow-end",
|
7643
|
-
onClick:
|
7644
|
-
return setPageIndex(pageCount - 1);
|
7645
|
-
},
|
7493
|
+
onClick: () => setPageIndex(pageCount - 1),
|
7646
7494
|
"aria-label": showShortcutTexts ? texts.pagination.actions.lastPageWithShortcut : texts.pagination.actions.lastPage,
|
7647
7495
|
tooltip: showShortcutTexts ? texts.pagination.actions.lastPageWithShortcut : texts.pagination.actions.lastPage
|
7648
7496
|
})));
|
7649
7497
|
});
|
7650
7498
|
|
7651
|
-
|
7652
|
-
|
7653
|
-
|
7654
|
-
|
7655
|
-
|
7656
|
-
duration = _ref$duration === void 0 ? undefined : _ref$duration,
|
7657
|
-
props = _objectWithoutPropertiesLoose(_ref, _excluded$s);
|
7658
|
-
|
7659
|
-
var style;
|
7499
|
+
const Progress = ({
|
7500
|
+
duration = undefined,
|
7501
|
+
...props
|
7502
|
+
}) => {
|
7503
|
+
let style;
|
7660
7504
|
|
7661
7505
|
if (duration) {
|
7662
7506
|
style = {
|
7663
|
-
animationDuration: duration
|
7507
|
+
animationDuration: `${duration}ms`
|
7664
7508
|
};
|
7665
7509
|
}
|
7666
7510
|
|
7667
|
-
|
7668
|
-
|
7669
|
-
"w-full before:h-1 before:bg-grey-dark before:block before:animate-[progress-indeterminate_2s_cubic-bezier(0.4,0,0.2,1)_infinite] before:content-[' ']": !duration
|
7670
|
-
|
7511
|
+
const className = cn('bg-grey-light rounded block h-1 overflow-hidden w-full', props.className);
|
7512
|
+
const progressClassName = cn('yt-progress__bar block h-1', {
|
7513
|
+
"w-full before:h-1 before:bg-grey-dark before:block before:animate-[progress-indeterminate_2s_cubic-bezier(0.4,0,0.2,1)_infinite] before:content-[' ']": !duration,
|
7514
|
+
[`w-0 bg-grey-dark animate-[progress_linear]`]: duration
|
7515
|
+
});
|
7671
7516
|
return React__default.createElement("span", Object.assign({}, props, {
|
7672
7517
|
"data-taco": "progress",
|
7673
7518
|
className: className
|
@@ -9282,19 +9127,16 @@ const useTableRowCreation = (data, tableRef) => {
|
|
9282
9127
|
};
|
9283
9128
|
};
|
9284
9129
|
|
9285
|
-
|
9286
|
-
|
9287
|
-
|
9288
|
-
|
9289
|
-
|
9290
|
-
|
9291
|
-
|
9292
|
-
|
9293
|
-
|
9294
|
-
|
9295
|
-
otherProps = _objectWithoutPropertiesLoose(props, _excluded$t);
|
9296
|
-
|
9297
|
-
var className = cn('yt-tabs', "yt-tabs--" + orientation, {
|
9130
|
+
const Tabs = /*#__PURE__*/React.forwardRef(function Tabs(props, ref) {
|
9131
|
+
const {
|
9132
|
+
id,
|
9133
|
+
defaultId,
|
9134
|
+
children,
|
9135
|
+
onChange,
|
9136
|
+
orientation = 'horizontal',
|
9137
|
+
...otherProps
|
9138
|
+
} = props;
|
9139
|
+
const className = cn('yt-tabs', `yt-tabs--${orientation}`, {
|
9298
9140
|
'flex w-full': orientation === 'vertical'
|
9299
9141
|
}, props.className);
|
9300
9142
|
return React.createElement(TabsPrimitive.Root, Object.assign({}, otherProps, {
|
@@ -9308,19 +9150,20 @@ var Tabs = /*#__PURE__*/React.forwardRef(function Tabs(props, ref) {
|
|
9308
9150
|
value: id
|
9309
9151
|
}), children);
|
9310
9152
|
});
|
9311
|
-
|
9312
|
-
|
9153
|
+
const TabList = /*#__PURE__*/React.forwardRef(function Tab(props, ref) {
|
9154
|
+
const className = cn('yt-tab__list border-b border-grey-light flex flex-row m-0 mb-4', props.className);
|
9313
9155
|
return React.createElement(TabsPrimitive.List, Object.assign({}, props, {
|
9314
9156
|
className: className,
|
9315
9157
|
ref: ref
|
9316
9158
|
}));
|
9317
9159
|
});
|
9318
|
-
|
9319
|
-
|
9320
|
-
|
9321
|
-
|
9322
|
-
|
9323
|
-
|
9160
|
+
const TabTrigger = /*#__PURE__*/React.forwardRef(function Tab(props, ref) {
|
9161
|
+
const {
|
9162
|
+
id,
|
9163
|
+
disabled,
|
9164
|
+
...otherProps
|
9165
|
+
} = props;
|
9166
|
+
const className = cn('yt-tab bg-transparent border-b-2 border-transparent text-grey-darkest m-0 py-2 px-4', disabled ? 'cursor-not-allowed !text-grey-darker' : 'cursor-pointer rounded-t hover:border-grey-dark aria-selected:border-blue aria-selected:text-black aria-selected:hover:border-blue-light hover:text-black active:yt-focus active:border-blue focus:yt-focus focus:border-blue', props.className);
|
9324
9167
|
return React.createElement(TabsPrimitive.Trigger, Object.assign({}, otherProps, {
|
9325
9168
|
className: className,
|
9326
9169
|
disabled: disabled,
|
@@ -9331,11 +9174,12 @@ var TabTrigger = /*#__PURE__*/React.forwardRef(function Tab(props, ref) {
|
|
9331
9174
|
value: id
|
9332
9175
|
}));
|
9333
9176
|
});
|
9334
|
-
|
9335
|
-
|
9336
|
-
|
9337
|
-
|
9338
|
-
|
9177
|
+
const TabContent = /*#__PURE__*/React.forwardRef(function Tab(props, ref) {
|
9178
|
+
const {
|
9179
|
+
id,
|
9180
|
+
...otherProps
|
9181
|
+
} = props;
|
9182
|
+
const className = cn('yt-tab__panel outline-none', props.className);
|
9339
9183
|
return React.createElement(TabsPrimitive.Content, Object.assign({}, otherProps, {
|
9340
9184
|
className: className,
|
9341
9185
|
ref: ref,
|
@@ -9346,19 +9190,22 @@ Tabs.List = TabList;
|
|
9346
9190
|
Tabs.Trigger = TabTrigger;
|
9347
9191
|
Tabs.Content = TabContent;
|
9348
9192
|
|
9349
|
-
|
9350
|
-
|
9351
|
-
|
9352
|
-
|
9353
|
-
|
9354
|
-
|
9193
|
+
const Textarea = /*#__PURE__*/React.forwardRef(function Textarea(props, ref) {
|
9194
|
+
const {
|
9195
|
+
defaultValue: _,
|
9196
|
+
highlighted,
|
9197
|
+
invalid,
|
9198
|
+
onKeyDown,
|
9199
|
+
...otherProps
|
9200
|
+
} = props;
|
9201
|
+
const classNames = cn(getInputClasses(props), 'py-1 min-h-[75px] disabled:resize-none', props.className); // home and end keys only navigate to the start/end of textarea value if the textarea container does not scroll
|
9355
9202
|
// if it has scroll height then the browser reverts to native scrolling behaviour only
|
9356
9203
|
// so we manually override it to ensure _our_ desired behaviour remains intact
|
9357
9204
|
|
9358
|
-
|
9205
|
+
const handleKeyDown = event => {
|
9359
9206
|
if (event.key === 'Home' || event.key === 'End') {
|
9360
9207
|
event.preventDefault();
|
9361
|
-
|
9208
|
+
const position = event.key === 'End' ? event.currentTarget.value.length : 0;
|
9362
9209
|
event.currentTarget.setSelectionRange(position, position);
|
9363
9210
|
event.currentTarget.scrollTop = event.key === 'End' ? event.currentTarget.scrollHeight : 0;
|
9364
9211
|
}
|
@@ -9376,18 +9223,18 @@ var Textarea = /*#__PURE__*/React.forwardRef(function Textarea(props, ref) {
|
|
9376
9223
|
}));
|
9377
9224
|
});
|
9378
9225
|
|
9379
|
-
|
9380
|
-
|
9381
|
-
|
9382
|
-
|
9383
|
-
|
9384
|
-
|
9385
|
-
|
9226
|
+
const Switch = /*#__PURE__*/React.forwardRef(function Switch(props, ref) {
|
9227
|
+
const {
|
9228
|
+
label,
|
9229
|
+
onChange,
|
9230
|
+
...otherProps
|
9231
|
+
} = props;
|
9232
|
+
const className = cn('group h-5 w-9 flex rounded-full inline-flex', {
|
9386
9233
|
'mr-2': !!label,
|
9387
9234
|
'bg-grey-darker hover:bg-grey-dark aria-checked:bg-blue aria-checked:hover:bg-blue-light focus:yt-focus': !props.disabled,
|
9388
9235
|
'bg-grey-light cursor-not-allowed aria-checked:bg-blue-light': props.disabled
|
9389
9236
|
}, props.className);
|
9390
|
-
|
9237
|
+
const element = React.createElement(PrimitiveSwitch.Root, Object.assign({}, otherProps, {
|
9391
9238
|
className: className,
|
9392
9239
|
onCheckedChange: onChange,
|
9393
9240
|
ref: ref
|
@@ -9396,7 +9243,7 @@ var Switch = /*#__PURE__*/React.forwardRef(function Switch(props, ref) {
|
|
9396
9243
|
}));
|
9397
9244
|
|
9398
9245
|
if (label) {
|
9399
|
-
|
9246
|
+
const labelClassName = cn('flex items-center cursor-pointer', {
|
9400
9247
|
'cursor-not-allowed text-grey-dark': props.disabled
|
9401
9248
|
});
|
9402
9249
|
return React.createElement("label", {
|
@@ -9407,23 +9254,22 @@ var Switch = /*#__PURE__*/React.forwardRef(function Switch(props, ref) {
|
|
9407
9254
|
return element;
|
9408
9255
|
});
|
9409
9256
|
|
9410
|
-
|
9411
|
-
|
9412
|
-
|
9413
|
-
|
9414
|
-
|
9415
|
-
|
9416
|
-
|
9417
|
-
|
9418
|
-
|
9419
|
-
|
9420
|
-
|
9421
|
-
|
9422
|
-
|
9423
|
-
|
9424
|
-
|
9425
|
-
|
9426
|
-
var onWindowKeyDown = function onWindowKeyDown(event) {
|
9257
|
+
const Tooltip$1 = ({
|
9258
|
+
continuous,
|
9259
|
+
index,
|
9260
|
+
isLastStep,
|
9261
|
+
step,
|
9262
|
+
backProps,
|
9263
|
+
primaryProps,
|
9264
|
+
skipProps,
|
9265
|
+
tooltipProps,
|
9266
|
+
size,
|
9267
|
+
locale,
|
9268
|
+
disableTourSkipOnEsc
|
9269
|
+
}) => {
|
9270
|
+
const skipButtonRef = React.useRef(null);
|
9271
|
+
React.useEffect(() => {
|
9272
|
+
const onWindowKeyDown = event => {
|
9427
9273
|
if (!disableTourSkipOnEsc) {
|
9428
9274
|
if (event.keyCode === keycode('esc') && skipButtonRef.current !== null) {
|
9429
9275
|
event.preventDefault();
|
@@ -9434,7 +9280,7 @@ var Tooltip$1 = function Tooltip(_ref) {
|
|
9434
9280
|
};
|
9435
9281
|
|
9436
9282
|
window.addEventListener('keydown', onWindowKeyDown);
|
9437
|
-
return
|
9283
|
+
return () => {
|
9438
9284
|
window.removeEventListener('keydown', onWindowKeyDown);
|
9439
9285
|
};
|
9440
9286
|
}, []);
|
@@ -9453,30 +9299,30 @@ var Tooltip$1 = function Tooltip(_ref) {
|
|
9453
9299
|
appearance: "discrete"
|
9454
9300
|
}), locale.back), React.createElement(Button$1, Object.assign({}, primaryProps, {
|
9455
9301
|
appearance: "primary"
|
9456
|
-
}), continuous ? isLastStep ? locale.last
|
9302
|
+
}), continuous ? isLastStep ? `${locale.last} (${index + 1}/${size})` : `${locale.next} (${index + 1}/${size})` : locale.close)));
|
9457
9303
|
}; // eslint-disable-next-line @typescript-eslint/no-unused-vars
|
9458
9304
|
|
9459
9305
|
|
9460
|
-
|
9461
|
-
|
9462
|
-
|
9463
|
-
|
9464
|
-
|
9465
|
-
|
9466
|
-
|
9467
|
-
|
9468
|
-
|
9469
|
-
|
9470
|
-
|
9471
|
-
|
9472
|
-
|
9473
|
-
|
9474
|
-
|
9475
|
-
|
9476
|
-
|
9477
|
-
|
9478
|
-
return React.Children.map(props.children,
|
9479
|
-
|
9306
|
+
const TourStep = _props => null;
|
9307
|
+
const Tour = props => {
|
9308
|
+
const {
|
9309
|
+
texts: {
|
9310
|
+
tour
|
9311
|
+
}
|
9312
|
+
} = useLocalization();
|
9313
|
+
const {
|
9314
|
+
autoStart: run,
|
9315
|
+
onComplete,
|
9316
|
+
onClose,
|
9317
|
+
onReady,
|
9318
|
+
spotlightClicks,
|
9319
|
+
disableCloseOnEsc: disableTourSkipOnEsc,
|
9320
|
+
disableScrollParentFix = false,
|
9321
|
+
...rest
|
9322
|
+
} = props;
|
9323
|
+
const steps = React.useMemo(() => {
|
9324
|
+
return React.Children.map(props.children, child => {
|
9325
|
+
const step = {
|
9480
9326
|
disableBeacon: !child.props.showBeacon,
|
9481
9327
|
target: child.props.selector,
|
9482
9328
|
placement: child.props.position,
|
@@ -9486,12 +9332,10 @@ var Tour = function Tour(props) {
|
|
9486
9332
|
return step;
|
9487
9333
|
});
|
9488
9334
|
}, [props.children]);
|
9489
|
-
|
9335
|
+
const getStep = React.useCallback(selector => {
|
9490
9336
|
var _props$children$find;
|
9491
9337
|
|
9492
|
-
return (_props$children$find = props.children.find(
|
9493
|
-
return child.props.selector === selector;
|
9494
|
-
})) === null || _props$children$find === void 0 ? void 0 : _props$children$find.props;
|
9338
|
+
return (_props$children$find = props.children.find(child => child.props.selector === selector)) === null || _props$children$find === void 0 ? void 0 : _props$children$find.props;
|
9495
9339
|
}, [props.children]);
|
9496
9340
|
|
9497
9341
|
function callback(state) {
|
@@ -9521,12 +9365,10 @@ var Tour = function Tour(props) {
|
|
9521
9365
|
floaterProps: {
|
9522
9366
|
disableAnimation: true
|
9523
9367
|
},
|
9524
|
-
tooltipComponent:
|
9525
|
-
|
9526
|
-
|
9527
|
-
|
9528
|
-
}));
|
9529
|
-
},
|
9368
|
+
tooltipComponent: tooltipProps => React.createElement(Tooltip$1, Object.assign({}, tooltipProps, {
|
9369
|
+
locale: tour,
|
9370
|
+
disableTourSkipOnEsc: disableTourSkipOnEsc
|
9371
|
+
})),
|
9530
9372
|
locale: tour,
|
9531
9373
|
spotlightPadding: 8,
|
9532
9374
|
spotlightClicks: spotlightClicks,
|
@@ -9567,12 +9409,12 @@ var useOnClickOutside = function useOnClickOutside(ref, callback) {
|
|
9567
9409
|
}, [ref, callback]);
|
9568
9410
|
};
|
9569
9411
|
|
9570
|
-
|
9571
|
-
|
9572
|
-
|
9573
|
-
|
9574
|
-
|
9575
|
-
|
9412
|
+
const Content$6 = /*#__PURE__*/React.forwardRef(function CardContent(externalProps, ref) {
|
9413
|
+
const {
|
9414
|
+
noPadding,
|
9415
|
+
...props
|
9416
|
+
} = externalProps;
|
9417
|
+
const className = cn('flex-grow overflow-auto', {
|
9576
9418
|
'mx-4 mb-4': !noPadding
|
9577
9419
|
}, props.className);
|
9578
9420
|
return React.createElement("div", Object.assign({}, props, {
|
@@ -9580,11 +9422,13 @@ var Content$6 = /*#__PURE__*/React.forwardRef(function CardContent(externalProps
|
|
9580
9422
|
ref: ref
|
9581
9423
|
}));
|
9582
9424
|
});
|
9583
|
-
|
9584
|
-
|
9585
|
-
|
9586
|
-
|
9587
|
-
|
9425
|
+
const Card = /*#__PURE__*/React.forwardRef(function Card(props, ref) {
|
9426
|
+
const {
|
9427
|
+
title,
|
9428
|
+
menu,
|
9429
|
+
children
|
9430
|
+
} = props;
|
9431
|
+
const className = cn('bg-white flex flex-col rounded-xl shadow-[0px_0px_1px_rgba(0,0,0,0.1),0px_6px_18px_rgba(47,51,68,0.2)]', props.className);
|
9588
9432
|
return React.createElement("div", {
|
9589
9433
|
className: className,
|
9590
9434
|
"data-taco": "card",
|
@@ -9666,6 +9510,7 @@ exports.useListScrollTo = useListScrollTo;
|
|
9666
9510
|
exports.useLocalization = useLocalization;
|
9667
9511
|
exports.useOnClickOutside = useOnClickOutside;
|
9668
9512
|
exports.usePagination = usePagination;
|
9513
|
+
exports.useProxiedRef = useProxiedRef;
|
9669
9514
|
exports.useRadioGroup = useRadioGroup;
|
9670
9515
|
exports.useTableRowCreation = useTableRowCreation;
|
9671
9516
|
exports.useTaco = useTaco;
|