@staffbase/design 20.1.1 → 20.1.3
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/main.cjs +11 -32
- package/dist/main.cjs.map +1 -1
- package/dist/main.d.ts +0 -2
- package/dist/main.js +11 -32
- package/dist/main.js.map +1 -1
- package/package.json +1 -1
package/dist/main.d.ts
CHANGED
|
@@ -14,7 +14,6 @@ import { ChangeEvent } from 'react';
|
|
|
14
14
|
import { ClassAttributes } from 'react';
|
|
15
15
|
import { Combobox } from '@base-ui/react/combobox';
|
|
16
16
|
import { ComboboxChipProps } from '@base-ui/react';
|
|
17
|
-
import { ComboboxItemIndicatorProps } from '@base-ui/react';
|
|
18
17
|
import { ComboboxItemProps } from '@base-ui/react';
|
|
19
18
|
import { ComponentProps } from 'react';
|
|
20
19
|
import { ComponentPropsWithoutRef } from 'react';
|
|
@@ -1784,7 +1783,6 @@ export declare const SearchableSingleSelect: {
|
|
|
1784
1783
|
GroupLabel: ForwardRefExoticComponent<Omit< AutocompleteGroupLabelProps, "ref"> & RefAttributes<HTMLDivElement>>;
|
|
1785
1784
|
Popup: ForwardRefExoticComponent<Omit<PopupProps_6, "ref"> & RefAttributes<HTMLDivElement>>;
|
|
1786
1785
|
Item: ForwardRefExoticComponent<Omit< ComboboxItemProps, "ref"> & RefAttributes<HTMLDivElement>>;
|
|
1787
|
-
ItemIndicator: ForwardRefExoticComponent<Omit< ComboboxItemIndicatorProps, "ref"> & RefAttributes<HTMLSpanElement>>;
|
|
1788
1786
|
Separator: ForwardRefExoticComponent<Omit< SeparatorProps, "ref"> & RefAttributes<HTMLDivElement>>;
|
|
1789
1787
|
Input: ForwardRefExoticComponent<Omit<InputProps, "ref"> & RefAttributes<HTMLInputElement>>;
|
|
1790
1788
|
Empty: ForwardRefExoticComponent<Omit< AutocompleteEmptyProps, "ref"> & RefAttributes<HTMLDivElement>>;
|
package/dist/main.js
CHANGED
|
@@ -315,7 +315,7 @@ var Popup$6 = forwardRef((props, ref) => {
|
|
|
315
315
|
return /* @__PURE__ */ jsxs(AlertDialog$1.Portal, {
|
|
316
316
|
container,
|
|
317
317
|
children: [/* @__PURE__ */ jsx(AlertDialog$1.Backdrop, { className: "ds-alert-dialog__backdrop" }), /* @__PURE__ */ jsx(AlertDialog$1.Popup, {
|
|
318
|
-
"data-c13y-component": "alert-dialog-
|
|
318
|
+
"data-c13y-component": "alert-dialog-popup",
|
|
319
319
|
className: clsx$1("ds-alert-dialog__popup", className),
|
|
320
320
|
...rest,
|
|
321
321
|
ref,
|
|
@@ -8916,7 +8916,6 @@ var Root$9 = forwardRef((props, ref) => {
|
|
|
8916
8916
|
children: ICONS[variant]
|
|
8917
8917
|
}), /* @__PURE__ */ jsx("div", {
|
|
8918
8918
|
className: "ds-banner__content",
|
|
8919
|
-
"data-c13y-component": "banner-content",
|
|
8920
8919
|
children
|
|
8921
8920
|
})]
|
|
8922
8921
|
});
|
|
@@ -8981,7 +8980,7 @@ var Popup$5 = forwardRef((props, ref) => {
|
|
|
8981
8980
|
children: [/* @__PURE__ */ jsx(Drawer.Backdrop, { className: "ds-bottom-sheet__backdrop" }), /* @__PURE__ */ jsx(Drawer.Viewport, {
|
|
8982
8981
|
className: "ds-bottom-sheet__viewport",
|
|
8983
8982
|
children: /* @__PURE__ */ jsxs(Drawer.Popup, {
|
|
8984
|
-
"data-c13y-component": "bottom-sheet-
|
|
8983
|
+
"data-c13y-component": "bottom-sheet-popup",
|
|
8985
8984
|
className: clsx$1("ds-bottom-sheet__popup", className),
|
|
8986
8985
|
...rest,
|
|
8987
8986
|
ref,
|
|
@@ -9039,7 +9038,6 @@ var BottomSheet = {
|
|
|
9039
9038
|
var ButtonDeprecated = forwardRef(function Button(props, ref) {
|
|
9040
9039
|
const { children, className = "", variant = "primary", icon = null, disabled, iconPosition = "leading", ...rest } = props;
|
|
9041
9040
|
return /* @__PURE__ */ jsxs("button", {
|
|
9042
|
-
"data-c13y-component": "button",
|
|
9043
9041
|
className: `ds-button-deprecated ds-button-deprecated--${variant} ${className}`,
|
|
9044
9042
|
disabled,
|
|
9045
9043
|
...rest,
|
|
@@ -9058,7 +9056,6 @@ var ButtonDeprecated = forwardRef(function Button(props, ref) {
|
|
|
9058
9056
|
var IconButton = forwardRef(function IconButton(props, ref) {
|
|
9059
9057
|
const { icon, className = "", variant = "primary", ...rest } = props;
|
|
9060
9058
|
return /* @__PURE__ */ jsx("button", {
|
|
9061
|
-
"data-c13y-component": "button",
|
|
9062
9059
|
className: clsx$1("ds-button-deprecated", "ds-icon-button", `ds-button-deprecated--${variant}`, `${className}`),
|
|
9063
9060
|
...rest,
|
|
9064
9061
|
ref,
|
|
@@ -9233,7 +9230,7 @@ var Popup$4 = forwardRef((props, ref) => {
|
|
|
9233
9230
|
return /* @__PURE__ */ jsxs(Dialog$1.Portal, {
|
|
9234
9231
|
container,
|
|
9235
9232
|
children: [/* @__PURE__ */ jsx(Dialog$1.Backdrop, { className: "ds-dialog__backdrop" }), /* @__PURE__ */ jsx(Dialog$1.Popup, {
|
|
9236
|
-
"data-c13y-component": "dialog-
|
|
9233
|
+
"data-c13y-component": "dialog-popup",
|
|
9237
9234
|
className: clsx$1("ds-dialog__popup", className),
|
|
9238
9235
|
...rest,
|
|
9239
9236
|
ref,
|
|
@@ -9889,7 +9886,7 @@ var FilterContentWrapper = forwardRef(function PopoverContent(props, propRef) {
|
|
|
9889
9886
|
modal: false,
|
|
9890
9887
|
children: /* @__PURE__ */ jsx("div", {
|
|
9891
9888
|
ref,
|
|
9892
|
-
"data-c13y-component": "filter-
|
|
9889
|
+
"data-c13y-component": "filter-popup",
|
|
9893
9890
|
style: {
|
|
9894
9891
|
...floatingContext.floatingStyles,
|
|
9895
9892
|
width: "max-content",
|
|
@@ -10011,7 +10008,6 @@ Filter.displayName = "Filter";
|
|
|
10011
10008
|
var GhostButton = forwardRef(function GhostButton(props, ref) {
|
|
10012
10009
|
const { children, className = "", variant = "primary", icon = null, disabled, iconPosition = "leading", ...rest } = props;
|
|
10013
10010
|
return /* @__PURE__ */ jsxs("button", {
|
|
10014
|
-
"data-c13y-component": "ghost-button",
|
|
10015
10011
|
className: `ds-ghost-button ds-ghost-button--${variant} ${className}`,
|
|
10016
10012
|
disabled,
|
|
10017
10013
|
...rest,
|
|
@@ -10030,7 +10026,6 @@ var GhostButton = forwardRef(function GhostButton(props, ref) {
|
|
|
10030
10026
|
var IconGhostButton = forwardRef(function IconGhostButton(props, ref) {
|
|
10031
10027
|
const { icon, className = "", variant = "primary", ...rest } = props;
|
|
10032
10028
|
return /* @__PURE__ */ jsx("button", {
|
|
10033
|
-
"data-c13y-component": "ghost-button",
|
|
10034
10029
|
className: clsx$1("ds-ghost-button", "ds-ghost-icon-button", `ds-ghost-button--${variant}`, `${className}`),
|
|
10035
10030
|
...rest,
|
|
10036
10031
|
ref,
|
|
@@ -10046,7 +10041,6 @@ var PlainGrowl = forwardRef(function PlainGrowl(props, ref) {
|
|
|
10046
10041
|
const { variant = "success", className = "", ...rest } = props;
|
|
10047
10042
|
return /* @__PURE__ */ jsx("div", {
|
|
10048
10043
|
...rest,
|
|
10049
|
-
"data-c13y-component": "plain-growl",
|
|
10050
10044
|
className: clsx(`ds-growl ds-growl--${variant}`, className),
|
|
10051
10045
|
role: "alert",
|
|
10052
10046
|
ref
|
|
@@ -10056,7 +10050,6 @@ var PlainGrowl = forwardRef(function PlainGrowl(props, ref) {
|
|
|
10056
10050
|
function Growl(props) {
|
|
10057
10051
|
const { children, variant = "success", className = "" } = props;
|
|
10058
10052
|
return /* @__PURE__ */ jsx(m.div, {
|
|
10059
|
-
"data-c13y-component": "growl",
|
|
10060
10053
|
className: clsx(`ds-growl ds-growl--${variant}`, className),
|
|
10061
10054
|
initial: {
|
|
10062
10055
|
opacity: 0,
|
|
@@ -10094,7 +10087,6 @@ GrowlContainer.displayName = "GrowlContainer";
|
|
|
10094
10087
|
var HelpButton = forwardRef(function HelpButton(props, ref) {
|
|
10095
10088
|
const { className = "", title, ...rest } = props;
|
|
10096
10089
|
return /* @__PURE__ */ jsx("button", {
|
|
10097
|
-
"data-c13y-component": "help-button",
|
|
10098
10090
|
className: clsx$1("ds-help-button", className),
|
|
10099
10091
|
"aria-label": title,
|
|
10100
10092
|
ref,
|
|
@@ -10106,14 +10098,14 @@ HelpButton.displayName = "HelpButton";
|
|
|
10106
10098
|
//#endregion
|
|
10107
10099
|
//#region src/utils/splitC13yProps.ts
|
|
10108
10100
|
/**
|
|
10109
|
-
* Splits a props object into its `data-c13y-*`
|
|
10101
|
+
* Splits a props object into its `data-c13y-*` customisability attributes and
|
|
10110
10102
|
* everything else.
|
|
10111
10103
|
*
|
|
10112
10104
|
* Portalled overlays render a positioner wrapper around the visible popup. The
|
|
10113
10105
|
* public prop type extends the positioner's props, so a consumer-supplied
|
|
10114
10106
|
* `data-c13y-region` / `data-c13y-purpose` / `data-c13y-id` would otherwise land
|
|
10115
10107
|
* on the invisible positioner instead of the visible popup that carries
|
|
10116
|
-
* `data-c13y-component`. Use this to forward the
|
|
10108
|
+
* `data-c13y-component`. Use this to forward the customisability attributes onto
|
|
10117
10109
|
* the popup while keeping positioner props (`align`, `sideOffset`, …) on the
|
|
10118
10110
|
* positioner.
|
|
10119
10111
|
*/
|
|
@@ -10155,7 +10147,7 @@ var Popup$3 = forwardRef((props, ref) => {
|
|
|
10155
10147
|
...positionerProps,
|
|
10156
10148
|
children: /* @__PURE__ */ jsx(Menu$1.Popup, {
|
|
10157
10149
|
...c13y,
|
|
10158
|
-
"data-c13y-component": "menu-
|
|
10150
|
+
"data-c13y-component": "menu-popup",
|
|
10159
10151
|
className: clsx$1("ds-menu__popup", className),
|
|
10160
10152
|
children,
|
|
10161
10153
|
ref
|
|
@@ -10799,7 +10791,7 @@ var Popup$2 = forwardRef((props, ref) => {
|
|
|
10799
10791
|
...positionerProps,
|
|
10800
10792
|
children: /* @__PURE__ */ jsx(Combobox.Popup, {
|
|
10801
10793
|
...c13y,
|
|
10802
|
-
"data-c13y-component": "searchable-multi-select-
|
|
10794
|
+
"data-c13y-component": "searchable-multi-select-popup",
|
|
10803
10795
|
className: clsx$1("ds-searchable-multi-select__popup", className),
|
|
10804
10796
|
children,
|
|
10805
10797
|
ref
|
|
@@ -10989,7 +10981,7 @@ var Popup$1 = forwardRef((props, ref) => {
|
|
|
10989
10981
|
...positionerProps,
|
|
10990
10982
|
children: /* @__PURE__ */ jsx(Combobox.Popup, {
|
|
10991
10983
|
...c13y,
|
|
10992
|
-
"data-c13y-component": "searchable-single-select-
|
|
10984
|
+
"data-c13y-component": "searchable-single-select-popup",
|
|
10993
10985
|
className: clsx$1("ds-searchable-single-select__popup", className),
|
|
10994
10986
|
children,
|
|
10995
10987
|
ref
|
|
@@ -11015,17 +11007,6 @@ var Separator$2 = forwardRef((props, ref) => {
|
|
|
11015
11007
|
...rest
|
|
11016
11008
|
});
|
|
11017
11009
|
});
|
|
11018
|
-
var ItemIndicator$1 = forwardRef((props, ref) => {
|
|
11019
|
-
const { className, ...rest } = props;
|
|
11020
|
-
return /* @__PURE__ */ jsx(Combobox.ItemIndicator, {
|
|
11021
|
-
"data-c13y-component": "searchable-single-select-item-indicator",
|
|
11022
|
-
keepMounted: true,
|
|
11023
|
-
className: "ds-searchable-single-select__item-indicator-wrapper",
|
|
11024
|
-
ref,
|
|
11025
|
-
...rest,
|
|
11026
|
-
children: /* @__PURE__ */ jsx("div", { className: clsx$1("ds-searchable-single-select__item-indicator", className) })
|
|
11027
|
-
});
|
|
11028
|
-
});
|
|
11029
11010
|
var GroupLabel$1 = forwardRef((props, ref) => {
|
|
11030
11011
|
const { className, ...rest } = props;
|
|
11031
11012
|
return /* @__PURE__ */ jsx(Combobox.GroupLabel, {
|
|
@@ -11053,7 +11034,6 @@ var SearchableSingleSelect = {
|
|
|
11053
11034
|
GroupLabel: GroupLabel$1,
|
|
11054
11035
|
Popup: Popup$1,
|
|
11055
11036
|
Item: Item$2,
|
|
11056
|
-
ItemIndicator: ItemIndicator$1,
|
|
11057
11037
|
Separator: Separator$2,
|
|
11058
11038
|
Input: Input$1,
|
|
11059
11039
|
Empty: Empty$1
|
|
@@ -11117,7 +11097,7 @@ var Popup = forwardRef((props, ref) => {
|
|
|
11117
11097
|
...positionerProps,
|
|
11118
11098
|
children: /* @__PURE__ */ jsx(Select$1.Popup, {
|
|
11119
11099
|
...c13y,
|
|
11120
|
-
"data-c13y-component": "select-
|
|
11100
|
+
"data-c13y-component": "select-popup",
|
|
11121
11101
|
className: clsx$1("ds-select__popup", className),
|
|
11122
11102
|
children,
|
|
11123
11103
|
ref
|
|
@@ -11659,7 +11639,6 @@ var TextField = forwardRef((props, ref) => {
|
|
|
11659
11639
|
}),
|
|
11660
11640
|
/* @__PURE__ */ jsx(Input, {
|
|
11661
11641
|
className: clsx$1("ds-text-field__input", { "ds-text-field__input--has-leading-icon": leadingIcon }, { "ds-text-field__input--has-trailing-icon": trailingIcon }, className),
|
|
11662
|
-
"data-c13y-component": "text-field-input",
|
|
11663
11642
|
ref,
|
|
11664
11643
|
...rest
|
|
11665
11644
|
}),
|
|
@@ -11835,7 +11814,7 @@ var Tooltip = {
|
|
|
11835
11814
|
...positionerProps,
|
|
11836
11815
|
children: /* @__PURE__ */ jsx(Tooltip$1.Popup, {
|
|
11837
11816
|
...c13y,
|
|
11838
|
-
"data-c13y-component": "tooltip
|
|
11817
|
+
"data-c13y-component": "tooltip",
|
|
11839
11818
|
className: clsx$1(`ds-tooltip--${variant}`, "ds-tooltip", className),
|
|
11840
11819
|
id: context?.id,
|
|
11841
11820
|
children,
|