@staffbase/design 20.1.0 → 20.1.2

package/dist/main.cjs

@@ -321,7 +321,7 @@ var Popup$6 = (0, react.forwardRef)((props, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react.AlertDialog.Portal, {
 		container,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.AlertDialog.Backdrop, { className: "ds-alert-dialog__backdrop" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.AlertDialog.Popup, {
-			"data-c13y-component": "alert-dialog-popover",
+			"data-c13y-component": "alert-dialog-popup",
 			className: (0, clsx.default)("ds-alert-dialog__popup", className),
 			...rest,
 			ref,
@@ -8922,7 +8922,6 @@ var Root$9 = (0, react.forwardRef)((props, ref) => {
 			children: ICONS[variant]
 		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			className: "ds-banner__content",
-			"data-c13y-component": "banner-content",
 			children
 		})]
 	});
@@ -8987,7 +8986,7 @@ var Popup$5 = (0, react.forwardRef)((props, ref) => {
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_drawer.Drawer.Backdrop, { className: "ds-bottom-sheet__backdrop" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_drawer.Drawer.Viewport, {
 			className: "ds-bottom-sheet__viewport",
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react_drawer.Drawer.Popup, {
-				"data-c13y-component": "bottom-sheet-popover",
+				"data-c13y-component": "bottom-sheet-popup",
 				className: (0, clsx.default)("ds-bottom-sheet__popup", className),
 				...rest,
 				ref,
@@ -9045,7 +9044,6 @@ var BottomSheet = {
 var ButtonDeprecated = (0, react.forwardRef)(function Button(props, ref) {
 	const { children, className = "", variant = "primary", icon = null, disabled, iconPosition = "leading", ...rest } = props;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-		"data-c13y-component": "button",
 		className: `ds-button-deprecated ds-button-deprecated--${variant} ${className}`,
 		disabled,
 		...rest,
@@ -9064,7 +9062,6 @@ var ButtonDeprecated = (0, react.forwardRef)(function Button(props, ref) {
 var IconButton = (0, react.forwardRef)(function IconButton(props, ref) {
 	const { icon, className = "", variant = "primary", ...rest } = props;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-		"data-c13y-component": "button",
 		className: (0, clsx.default)("ds-button-deprecated", "ds-icon-button", `ds-button-deprecated--${variant}`, `${className}`),
 		...rest,
 		ref,
@@ -9239,7 +9236,7 @@ var Popup$4 = (0, react.forwardRef)((props, ref) => {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(_base_ui_react.Dialog.Portal, {
 		container,
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Dialog.Backdrop, { className: "ds-dialog__backdrop" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react.Dialog.Popup, {
-			"data-c13y-component": "dialog-popover",
+			"data-c13y-component": "dialog-popup",
 			className: (0, clsx.default)("ds-dialog__popup", className),
 			...rest,
 			ref,
@@ -9895,7 +9892,7 @@ var FilterContentWrapper = (0, react.forwardRef)(function PopoverContent(props,
 		modal: false,
 		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 			ref,
-			"data-c13y-component": "filter-popover",
+			"data-c13y-component": "filter-popup",
 			style: {
 				...floatingContext.floatingStyles,
 				width: "max-content",
@@ -10017,7 +10014,6 @@ Filter.displayName = "Filter";
 var GhostButton = (0, react.forwardRef)(function GhostButton(props, ref) {
 	const { children, className = "", variant = "primary", icon = null, disabled, iconPosition = "leading", ...rest } = props;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("button", {
-		"data-c13y-component": "ghost-button",
 		className: `ds-ghost-button ds-ghost-button--${variant} ${className}`,
 		disabled,
 		...rest,
@@ -10036,7 +10032,6 @@ var GhostButton = (0, react.forwardRef)(function GhostButton(props, ref) {
 var IconGhostButton = (0, react.forwardRef)(function IconGhostButton(props, ref) {
 	const { icon, className = "", variant = "primary", ...rest } = props;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-		"data-c13y-component": "ghost-button",
 		className: (0, clsx.default)("ds-ghost-button", "ds-ghost-icon-button", `ds-ghost-button--${variant}`, `${className}`),
 		...rest,
 		ref,
@@ -10047,20 +10042,20 @@ GhostButton.displayName = "GhostButton";
 IconGhostButton.displayName = "IconGhostButton";
 //#endregion
 //#region src/components/growl/Growl.tsx
+/** @deprecated Not an accessible UI pattern — no replacement */
 var PlainGrowl = (0, react.forwardRef)(function PlainGrowl(props, ref) {
 	const { variant = "success", className = "", ...rest } = props;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
 		...rest,
-		"data-c13y-component": "plain-growl",
 		className: (0, clsx.clsx)(`ds-growl ds-growl--${variant}`, className),
 		role: "alert",
 		ref
 	});
 });
+/** @deprecated Not an accessible UI pattern — no replacement */
 function Growl(props) {
 	const { children, variant = "success", className = "" } = props;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.m.div, {
-		"data-c13y-component": "growl",
 		className: (0, clsx.clsx)(`ds-growl ds-growl--${variant}`, className),
 		initial: {
 			opacity: 0,
@@ -10082,6 +10077,7 @@ function Growl(props) {
 		children
 	});
 }
+/** @deprecated Not an accessible UI pattern — no replacement */
 function GrowlContainer(props) {
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(motion_react.LazyMotion, {
 		features: motion_react.domAnimation,
@@ -10093,10 +10089,10 @@ Growl.displayName = "Growl";
 GrowlContainer.displayName = "GrowlContainer";
 //#endregion
 //#region src/components/helpButton/HelpButton.tsx
+/** @deprecated Not an accessible UI pattern — no replacement */
 var HelpButton = (0, react.forwardRef)(function HelpButton(props, ref) {
 	const { className = "", title, ...rest } = props;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-		"data-c13y-component": "help-button",
 		className: (0, clsx.default)("ds-help-button", className),
 		"aria-label": title,
 		ref,
@@ -10108,14 +10104,14 @@ HelpButton.displayName = "HelpButton";
 //#endregion
 //#region src/utils/splitC13yProps.ts
 /**
-* Splits a props object into its `data-c13y-*` customizability attributes and
+* Splits a props object into its `data-c13y-*` customisability attributes and
 * everything else.
 *
 * Portalled overlays render a positioner wrapper around the visible popup. The
 * public prop type extends the positioner's props, so a consumer-supplied
 * `data-c13y-region` / `data-c13y-purpose` / `data-c13y-id` would otherwise land
 * on the invisible positioner instead of the visible popup that carries
-* `data-c13y-component`. Use this to forward the customizability attributes onto
+* `data-c13y-component`. Use this to forward the customisability attributes onto
 * the popup while keeping positioner props (`align`, `sideOffset`, …) on the
 * positioner.
 */
@@ -10157,7 +10153,7 @@ var Popup$3 = (0, react.forwardRef)((props, ref) => {
 			...positionerProps,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_menu.Menu.Popup, {
 				...c13y,
-				"data-c13y-component": "menu-popover",
+				"data-c13y-component": "menu-popup",
 				className: (0, clsx.default)("ds-menu__popup", className),
 				children,
 				ref
@@ -10801,7 +10797,7 @@ var Popup$2 = (0, react.forwardRef)((props, ref) => {
 			...positionerProps,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_combobox.Combobox.Popup, {
 				...c13y,
-				"data-c13y-component": "searchable-multi-select-popover",
+				"data-c13y-component": "searchable-multi-select-popup",
 				className: (0, clsx.default)("ds-searchable-multi-select__popup", className),
 				children,
 				ref
@@ -10991,7 +10987,7 @@ var Popup$1 = (0, react.forwardRef)((props, ref) => {
 			...positionerProps,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_combobox.Combobox.Popup, {
 				...c13y,
-				"data-c13y-component": "searchable-single-select-popover",
+				"data-c13y-component": "searchable-single-select-popup",
 				className: (0, clsx.default)("ds-searchable-single-select__popup", className),
 				children,
 				ref
@@ -11017,17 +11013,6 @@ var Separator$2 = (0, react.forwardRef)((props, ref) => {
 		...rest
 	});
 });
-var ItemIndicator$1 = (0, react.forwardRef)((props, ref) => {
-	const { className, ...rest } = props;
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_combobox.Combobox.ItemIndicator, {
-		"data-c13y-component": "searchable-single-select-item-indicator",
-		keepMounted: true,
-		className: "ds-searchable-single-select__item-indicator-wrapper",
-		ref,
-		...rest,
-		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", { className: (0, clsx.default)("ds-searchable-single-select__item-indicator", className) })
-	});
-});
 var GroupLabel$1 = (0, react.forwardRef)((props, ref) => {
 	const { className, ...rest } = props;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_combobox.Combobox.GroupLabel, {
@@ -11055,7 +11040,6 @@ var SearchableSingleSelect = {
 	GroupLabel: GroupLabel$1,
 	Popup: Popup$1,
 	Item: Item$2,
-	ItemIndicator: ItemIndicator$1,
 	Separator: Separator$2,
 	Input,
 	Empty: Empty$1
@@ -11119,7 +11103,7 @@ var Popup = (0, react.forwardRef)((props, ref) => {
 			...positionerProps,
 			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_select.Select.Popup, {
 				...c13y,
-				"data-c13y-component": "select-popover",
+				"data-c13y-component": "select-popup",
 				className: (0, clsx.default)("ds-select__popup", className),
 				children,
 				ref
@@ -11661,7 +11645,6 @@ var TextField = (0, react.forwardRef)((props, ref) => {
 			}),
 			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_input.Input, {
 				className: (0, clsx.default)("ds-text-field__input", { "ds-text-field__input--has-leading-icon": leadingIcon }, { "ds-text-field__input--has-trailing-icon": trailingIcon }, className),
-				"data-c13y-component": "text-field-input",
 				ref,
 				...rest
 			}),
@@ -11837,7 +11820,7 @@ var Tooltip = {
 				...positionerProps,
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_base_ui_react_tooltip.Tooltip.Popup, {
 					...c13y,
-					"data-c13y-component": "tooltip-popover",
+					"data-c13y-component": "tooltip",
 					className: (0, clsx.default)(`ds-tooltip--${variant}`, "ds-tooltip", className),
 					id: context?.id,
 					children,