@plitzi/sdk-elements 0.37.1 → 0.37.3

package/dist/elements/advanced/Reference/Settings.d.ts

@@ -4,5 +4,5 @@ type SettingsProps = {
     referenceContainer?: string;
     onUpdate?: (key: string, value: string | number | boolean) => void;
 };
-declare const Settings: ({ referenceType, referenceId, referenceContainer, onUpdate }: SettingsProps) => import("react").JSX.Element;
+declare const Settings: ({ referenceType, referenceId, referenceContainer, onUpdate }: SettingsProps) => import('react').JSX.Element;
 export default Settings;

package/dist/elements/advanced/Reference/index.d.ts

@@ -1,5 +1,5 @@
 declare const Reference: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Reference').ReferenceProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Reference').ReferenceProps>): import('react').JSX.Element;
     displayName: string;
 } & {
     readonly type: "reference";

package/dist/elements/basic/Button/Button.d.ts

@@ -20,14 +20,21 @@ export type ButtonProps = {
      * What the button does, in words — shown as a tooltip on hover, and the button's accessible name when it has no text
      * of its own. An icon-only button without one is announced as nothing at all.
      *
-     * The browser falls back to it by itself, so it is never copied into `aria-label`: an `aria-label` would win over a
-     * visually-hidden label among the children, which is how a button with an empty `content` names itself.
+     * The browser falls back to it by itself, so it is never copied into `aria-label` — and neither is `content`: the
+     * button's name is what it SHOWS, content and children together. An `aria-label` taken from `content` named a button
+     * whose words were among its children after the default "Button" instead.
      */
     title?: string;
+    /**
+     * The button's name, for when the words it shows do not say what it does: a key hint beside an icon ("V"), a count,
+     * an arrow. Read in place of everything inside it by screen readers and browser agents, so it says the whole of it —
+     * "Select (V)". Left empty, the button is named by what it shows, then by `title`.
+     */
+    label?: string;
 };
-declare const Button: ({ ref, className, children, contentPlacement, content, subType, disabled, ariaExpanded, ariaPressed, title }: ButtonProps) => import("react").JSX.Element;
+declare const Button: ({ ref, className, children, contentPlacement, content, subType, disabled, ariaExpanded, ariaPressed, title, label }: ButtonProps) => import('react').JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<ButtonProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<ButtonProps>): import('react').JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/basic/Button/Button.mjs

@@ -4,16 +4,16 @@ import n from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
 import { jsxs as r } from "react/jsx-runtime";
 import i from "clsx";
 //#region src/elements/basic/Button/Button.tsx
-var a = ({ ref: e, className: a = "", children: o, contentPlacement: s = "after", content: c = "Button", subType: l = "button", disabled: u = !1, ariaExpanded: d, ariaPressed: f, title: p }) => {
-	let { settings: { previewMode: m } } = n();
+var a = ({ ref: e, className: a = "", children: o, contentPlacement: s = "after", content: c = "Button", subType: l = "button", disabled: u = !1, ariaExpanded: d, ariaPressed: f, title: p, label: m }) => {
+	let { settings: { previewMode: h } } = n();
 	return /* @__PURE__ */ r(t, {
 		ref: e,
 		tag: "button",
-		type: m ? l : "button",
-		className: i("plitzi-component__button", a, { "container--empty--skip": !m && !o && c }),
+		type: h ? l : "button",
+		className: i("plitzi-component__button", a, { "container--empty--skip": !h && !o && c }),
 		disabled: u,
-		"aria-label": c || void 0,
 		title: p || void 0,
+		"aria-label": m || void 0,
 		"aria-expanded": d,
 		"aria-pressed": f,
 		children: [

package/dist/elements/basic/Button/Settings.d.ts

@@ -4,7 +4,8 @@ type SettingsProps = {
     subType?: 'button' | 'reset' | 'submit';
     disabled?: boolean;
     title?: string;
+    label?: string;
     onUpdate?: (key: string, value: string | number | boolean) => void;
 };
-declare const Settings: ({ content, contentPlacement, subType, disabled, title, onUpdate }: SettingsProps) => import("react").JSX.Element;
+declare const Settings: ({ content, contentPlacement, subType, disabled, title, label, onUpdate }: SettingsProps) => import('react').JSX.Element;
 export default Settings;

package/dist/elements/basic/Button/Settings.mjs

@@ -4,28 +4,35 @@ import r from "@plitzi/plitzi-ui/Checkbox";
 import i from "@plitzi/plitzi-ui/Input";
 import a from "@plitzi/plitzi-ui/Select";
 //#region src/elements/basic/Button/Settings.tsx
-var o = ({ content: o = "Button", contentPlacement: s = "after", subType: c = "button", disabled: l = !1, title: u = "", onUpdate: d }) => {
-	let f = e((e) => d?.("content", e), [d]), p = e((e) => d?.("contentPlacement", e), [d]), m = e((e) => d?.("subType", e), [d]), h = e((e) => d?.("title", e), [d]), g = e((e) => d?.("disabled", e.target.checked), [d]);
+var o = ({ content: o = "Button", contentPlacement: s = "after", subType: c = "button", disabled: l = !1, title: u = "", label: d = "", onUpdate: f }) => {
+	let p = e((e) => f?.("content", e), [f]), m = e((e) => f?.("contentPlacement", e), [f]), h = e((e) => f?.("subType", e), [f]), g = e((e) => f?.("title", e), [f]), _ = e((e) => f?.("label", e), [f]), v = e((e) => f?.("disabled", e.target.checked), [f]);
 	return /* @__PURE__ */ n("div", {
 		className: "flex h-full flex-col gap-4 py-2",
 		children: [
 			/* @__PURE__ */ t(i, {
 				value: o,
 				label: "Content",
-				onChange: f,
+				onChange: p,
 				size: "xs"
 			}),
 			/* @__PURE__ */ t(i, {
 				value: u,
 				label: "Tooltip",
 				placeholder: "What the button does, for an icon-only one",
-				onChange: h,
+				onChange: g,
+				size: "xs"
+			}),
+			/* @__PURE__ */ t(i, {
+				value: d,
+				label: "Accessible Name",
+				placeholder: "When its words do not say what it does",
+				onChange: _,
 				size: "xs"
 			}),
 			/* @__PURE__ */ n(a, {
 				value: s,
 				label: "Mode",
-				onChange: p,
+				onChange: m,
 				size: "xs",
 				children: [
 					/* @__PURE__ */ t("option", {
@@ -45,7 +52,7 @@ var o = ({ content: o = "Button", contentPlacement: s = "after", subType: c = "b
 			/* @__PURE__ */ n(a, {
 				value: c,
 				label: "Button Type",
-				onChange: m,
+				onChange: h,
 				size: "xs",
 				children: [
 					/* @__PURE__ */ t("option", {
@@ -65,7 +72,7 @@ var o = ({ content: o = "Button", contentPlacement: s = "after", subType: c = "b
 			/* @__PURE__ */ t(r, {
 				checked: l,
 				label: "Is Disabled",
-				onChange: g,
+				onChange: v,
 				size: "xs"
 			})
 		]

package/dist/elements/basic/Button/declaration.d.ts

@@ -4,6 +4,10 @@ import { AuthorableAttributes } from '@plitzi/sdk-shared/authoring/declare';
 export type ButtonAttributes = AuthorableAttributes<ButtonProps>;
 declare const declaration: {
     readonly type: "button";
+    readonly attributeValues: {
+        readonly subType: readonly string[];
+        readonly contentPlacement: readonly string[];
+    };
     readonly content: {
         readonly attributes: {
             readonly contentPlacement: "after";
@@ -63,7 +67,7 @@ declare const declaration: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -84,7 +88,7 @@ declare const declaration: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -105,7 +109,7 @@ declare const declaration: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -119,6 +123,7 @@ declare const declaration: {
         readonly settings: {};
     };
 } & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
+    label?: string | undefined;
     title?: string | undefined;
     content?: string | undefined;
     disabled?: boolean | undefined;

package/dist/elements/basic/Button/declaration.mjs

@@ -1,7 +1,15 @@
-import { elementDeclaration as e } from "@plitzi/sdk-shared/authoring/declare";
+import { elementDeclaration as e, valuesOf as t } from "@plitzi/sdk-shared/authoring/declare";
 //#region src/elements/basic/Button/declaration.ts
-var t = e()({
+var n = e()({
 	type: "button",
+	attributeValues: {
+		subType: t()([
+			"button",
+			"submit",
+			"reset"
+		]),
+		contentPlacement: t()(["before", "after"])
+	},
 	content: {
 		attributes: {
 			contentPlacement: "after",
@@ -51,7 +59,7 @@ var t = e()({
 						"padding-bottom": "6px",
 						cursor: "pointer",
 						"font-size": "16px",
-						"line-height": "24px",
+						"line-height": "1.5",
 						"border-top-left-radius": "4px",
 						"border-top-right-radius": "4px",
 						"border-bottom-left-radius": "4px",
@@ -68,7 +76,7 @@ var t = e()({
 						"padding-bottom": "6px",
 						cursor: "pointer",
 						"font-size": "16px",
-						"line-height": "24px",
+						"line-height": "1.5",
 						"border-top-left-radius": "4px",
 						"border-top-right-radius": "4px",
 						"border-bottom-left-radius": "4px",
@@ -85,7 +93,7 @@ var t = e()({
 						"padding-bottom": "6px",
 						cursor: "pointer",
 						"font-size": "16px",
-						"line-height": "24px",
+						"line-height": "1.5",
 						"border-top-left-radius": "4px",
 						"border-top-right-radius": "4px",
 						"border-bottom-left-radius": "4px",
@@ -98,4 +106,4 @@ var t = e()({
 	}
 });
 //#endregion
-export { t as default };
+export { n as default };

package/dist/elements/basic/Button/index.d.ts

@@ -1,8 +1,12 @@
 declare const Button: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Button').ButtonProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Button').ButtonProps>): import('react').JSX.Element;
     displayName: string;
 } & {
     readonly type: "button";
+    readonly attributeValues: {
+        readonly subType: readonly string[];
+        readonly contentPlacement: readonly string[];
+    };
     readonly content: {
         readonly attributes: {
             readonly contentPlacement: "after";
@@ -62,7 +66,7 @@ declare const Button: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -83,7 +87,7 @@ declare const Button: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -104,7 +108,7 @@ declare const Button: {
                                 readonly 'padding-bottom': "6px";
                                 readonly cursor: "pointer";
                                 readonly 'font-size': "16px";
-                                readonly 'line-height': "24px";
+                                readonly 'line-height': "1.5";
                                 readonly 'border-top-left-radius': "4px";
                                 readonly 'border-top-right-radius': "4px";
                                 readonly 'border-bottom-left-radius': "4px";
@@ -118,6 +122,7 @@ declare const Button: {
         readonly settings: {};
     };
 } & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<Partial<{
+    label?: string | undefined;
     title?: string | undefined;
     content?: string | undefined;
     disabled?: boolean | undefined;

package/dist/elements/basic/Dropdown/Dropdown.d.ts

@@ -12,9 +12,9 @@ export type DropdownProps = {
     containerLeftOffset?: number;
     disabled?: boolean;
 };
-declare const Dropdown: ({ ref, children, className, popupPlacement, openPopup, backgroundDisabled, closeOnClickBackground, closeOnClickPopup, containerTopOffset, containerLeftOffset, disabled }: DropdownProps) => import("react").JSX.Element;
+declare const Dropdown: ({ ref, children, className, popupPlacement, openPopup, backgroundDisabled, closeOnClickBackground, closeOnClickPopup, containerTopOffset, containerLeftOffset, disabled }: DropdownProps) => import('react').JSX.Element;
 declare const _default: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<DropdownProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<DropdownProps>): import('react').JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/basic/Dropdown/Dropdown.mjs

@@ -3,56 +3,65 @@ import t from "../../../Element/hooks/useElement.mjs";
 import { RootElement as n } from "../../../Element/RootElement.mjs";
 import r from "./DropdownContext.mjs";
 import i from "./useDropdown.mjs";
-import { useCallback as a, useMemo as o, useRef as s } from "react";
-import c from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
-import { jsx as l, jsxs as u } from "react/jsx-runtime";
-import d from "clsx";
+import a from "./useDropdownTrigger.mjs";
+import { useCallback as o, useMemo as s, useRef as c } from "react";
+import l from "@plitzi/sdk-shared/hooks/usePlitziServiceContext";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+import f from "clsx";
 //#region src/elements/basic/Dropdown/Dropdown.tsx
-var f = ({ ref: e, children: f, className: p = "", popupPlacement: m = "bottom", openPopup: h = !1, backgroundDisabled: g = !1, closeOnClickBackground: _ = !0, closeOnClickPopup: v = !0, containerTopOffset: y = 5, containerLeftOffset: b = 5, disabled: x = !1 }) => {
-	let { setElementState: S, definition: { styleSelectors: C } } = t(), { settings: { previewMode: w }, utils: { getWindow: T } } = c(), E = s(null), D = s(null), O = o(() => T(), [T]), k = a((e) => {
-		_ && (e.stopPropagation(), e.preventDefault(), S((e) => ({
+var p = ({ ref: e, children: p, className: m = "", popupPlacement: h = "bottom", openPopup: g = !1, backgroundDisabled: _ = !1, closeOnClickBackground: v = !0, closeOnClickPopup: y = !0, containerTopOffset: b = 5, containerLeftOffset: x = 5, disabled: S = !1 }) => {
+	let { setElementState: C, definition: { styleSelectors: w } } = t(), { settings: { previewMode: T }, utils: { getWindow: E } } = l(), D = c(null), O = c(null), k = s(() => E(), [E]), A = o((e) => {
+		v && (e.stopPropagation(), e.preventDefault(), C((e) => ({
 			...e,
 			openPopup: !1
 		})));
-	}, [_, S]), A = a((e) => {
-		S((t) => ({
+	}, [v, C]), j = o((e) => {
+		C((t) => ({
 			...t,
 			openPopup: e
 		}));
-	}, [S]), [, , j, M, , N] = i({
+	}, [C]), [, , M, N, , P] = i({
 		ref: e,
-		popupRef: E,
-		open: h,
-		disabled: !w || x,
-		closeOnClickPopup: v,
-		placement: m,
-		offsetX: b,
-		offsetY: y,
-		myWindow: O,
-		onChange: A
-	}), P = o(() => ({
-		popupRef: E,
-		openPopup: h,
-		parameters: N,
-		onClick: M
+		popupRef: D,
+		open: g,
+		disabled: !T || S,
+		closeOnClickPopup: y,
+		closeOnClickOutside: v && !_,
+		placement: h,
+		offsetX: x,
+		offsetY: b,
+		myWindow: k,
+		onChange: j
+	}), F = a({
+		popupRef: D,
+		open: g,
+		positioned: !!P,
+		enabled: !!T && !S
+	}), I = o((e) => {
+		F(e), M(e);
+	}, [F, M]), L = s(() => ({
+		popupRef: D,
+		openPopup: g,
+		parameters: P,
+		onClick: N
 	}), [
-		M,
-		h,
-		N
+		N,
+		g,
+		P
 	]);
-	return /* @__PURE__ */ u(n, {
+	return /* @__PURE__ */ d(n, {
 		ref: e,
-		className: d("plitzi-component__dropdown", p, { "container--empty--skip": !w && !f }),
-		onClick: j,
-		children: [/* @__PURE__ */ l(r, {
-			value: P,
-			children: f
-		}), h && g && w && /* @__PURE__ */ l("div", {
-			ref: D,
-			className: d("plitzi-component__dropdown__background-container", C.backgroundContainer),
-			onClick: k
+		className: f("plitzi-component__dropdown", m, { "container--empty--skip": !T && !p }),
+		onClick: I,
+		children: [/* @__PURE__ */ u(r, {
+			value: L,
+			children: p
+		}), g && _ && T && /* @__PURE__ */ u("div", {
+			ref: O,
+			className: f("plitzi-component__dropdown__background-container", w.backgroundContainer),
+			onClick: A
 		})]
 	});
-}, p = e(f);
+}, m = e(p);
 //#endregion
-export { f as Dropdown, p as default };
+export { p as Dropdown, m as default };

package/dist/elements/basic/Dropdown/DropdownPopup/DropdownPopup.d.ts

@@ -4,9 +4,9 @@ export type DropdownPopupProps = {
     className?: string;
     children?: ReactNode;
 };
-declare const DropdownPopup: ({ ref, className, children }: DropdownPopupProps) => import("react").JSX.Element;
+declare const DropdownPopup: ({ ref, className, children }: DropdownPopupProps) => import('react').JSX.Element;
 declare const _default: {
-    (props: import('../../../../Element/hocs/withElement').WithElementProps<DropdownPopupProps>): import("react").JSX.Element;
+    (props: import('../../../../Element/hocs/withElement').WithElementProps<DropdownPopupProps>): import('react').JSX.Element;
     displayName: string;
 };
 export default _default;

package/dist/elements/basic/Dropdown/DropdownPopup/Settings.d.ts

@@ -1,2 +1,2 @@
-declare const Settings: () => import("react").JSX.Element;
+declare const Settings: () => import('react').JSX.Element;
 export default Settings;

package/dist/elements/basic/Dropdown/DropdownPopup/declaration.d.ts

@@ -4,6 +4,7 @@ import { AuthorableAttributes } from '@plitzi/sdk-shared/authoring/declare';
 export type DropdownPopupAttributes = AuthorableAttributes<DropdownPopupProps>;
 declare const declaration: {
     readonly type: "dropdownPopup";
+    readonly ancestorType: "dropdown";
     readonly content: {
         readonly attributes: {};
         readonly definition: {
@@ -41,7 +42,7 @@ declare const declaration: {
             readonly style: {
                 readonly base: {
                     readonly default: {
-                        readonly 'background-color': "white";
+                        readonly 'background-color': "light-dark(white, oklch(0.21 0.006 285.885))";
                         readonly 'padding-right': "4px";
                         readonly 'padding-bottom': "4px";
                         readonly 'padding-left': "4px";

package/dist/elements/basic/Dropdown/DropdownPopup/declaration.mjs

@@ -2,6 +2,7 @@ import { elementDeclaration as e } from "@plitzi/sdk-shared/authoring/declare";
 //#region src/elements/basic/Dropdown/DropdownPopup/declaration.ts
 var t = e()({
 	type: "dropdownPopup",
+	ancestorType: "dropdown",
 	content: {
 		attributes: {},
 		definition: {
@@ -35,7 +36,7 @@ var t = e()({
 			name: "Dropdown Popup",
 			displayMode: "desktop",
 			style: { base: { default: {
-				"background-color": "white",
+				"background-color": "light-dark(white, oklch(0.21 0.006 285.885))",
 				"padding-right": "4px",
 				"padding-bottom": "4px",
 				"padding-left": "4px",

package/dist/elements/basic/Dropdown/DropdownPopup/index.d.ts

@@ -1,8 +1,9 @@
 declare const DropdownPopup: {
-    (props: import('../../../../Element/hocs/withElement').WithElementProps<import('./DropdownPopup').DropdownPopupProps>): import("react").JSX.Element;
+    (props: import('../../../../Element/hocs/withElement').WithElementProps<import('./DropdownPopup').DropdownPopupProps>): import('react').JSX.Element;
     displayName: string;
 } & {
     readonly type: "dropdownPopup";
+    readonly ancestorType: "dropdown";
     readonly content: {
         readonly attributes: {};
         readonly definition: {
@@ -40,7 +41,7 @@ declare const DropdownPopup: {
             readonly style: {
                 readonly base: {
                     readonly default: {
-                        readonly 'background-color': "white";
+                        readonly 'background-color': "light-dark(white, oklch(0.21 0.006 285.885))";
                         readonly 'padding-right': "4px";
                         readonly 'padding-bottom': "4px";
                         readonly 'padding-left': "4px";

package/dist/elements/basic/Dropdown/Settings.d.ts

@@ -9,5 +9,5 @@ type SettingsProps = {
     disabled?: boolean;
     onUpdate?: (key: string, value: string | boolean | number) => void;
 };
-declare const Settings: ({ popupPlacement, openPopup, backgroundDisabled, closeOnClickBackground, closeOnClickPopup, containerTopOffset, containerLeftOffset, disabled, onUpdate }: SettingsProps) => import("react").JSX.Element;
+declare const Settings: ({ popupPlacement, openPopup, backgroundDisabled, closeOnClickBackground, closeOnClickPopup, containerTopOffset, containerLeftOffset, disabled, onUpdate }: SettingsProps) => import('react').JSX.Element;
 export default Settings;

package/dist/elements/basic/Dropdown/declaration.d.ts

@@ -4,6 +4,9 @@ import { AuthorableAttributes } from '@plitzi/sdk-shared/authoring/declare';
 export type DropdownAttributes = AuthorableAttributes<DropdownProps>;
 declare const declaration: {
     readonly type: "dropdown";
+    readonly attributeValues: {
+        readonly popupPlacement: readonly string[];
+    };
     readonly content: {
         readonly attributes: {
             readonly popupPlacement: "bottom";

package/dist/elements/basic/Dropdown/declaration.mjs

@@ -1,7 +1,13 @@
-import { elementDeclaration as e } from "@plitzi/sdk-shared/authoring/declare";
+import { elementDeclaration as e, valuesOf as t } from "@plitzi/sdk-shared/authoring/declare";
 //#region src/elements/basic/Dropdown/declaration.ts
-var t = e()({
+var n = e()({
 	type: "dropdown",
+	attributeValues: { popupPlacement: t()([
+		"left",
+		"right",
+		"top",
+		"bottom"
+	]) },
 	content: {
 		attributes: {
 			popupPlacement: "bottom",
@@ -67,4 +73,4 @@ var t = e()({
 	initialItems: ["dropdownPopup"]
 });
 //#endregion
-export { t as default };
+export { n as default };

package/dist/elements/basic/Dropdown/index.d.ts

@@ -1,13 +1,14 @@
 declare const Dropdown: {
-    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Dropdown').DropdownProps>): import("react").JSX.Element;
+    (props: import('../../../Element/hocs/withElement').WithElementProps<import('./Dropdown').DropdownProps>): import('react').JSX.Element;
     displayName: string;
 } & {
     plugins: {
         dropdownPopup: {
-            (props: import('../../../Element/hocs/withElement').WithElementProps<import('./DropdownPopup/DropdownPopup').DropdownPopupProps>): import("react").JSX.Element;
+            (props: import('../../../Element/hocs/withElement').WithElementProps<import('./DropdownPopup/DropdownPopup').DropdownPopupProps>): import('react').JSX.Element;
             displayName: string;
         } & {
             readonly type: "dropdownPopup";
+            readonly ancestorType: "dropdown";
             readonly content: {
                 readonly attributes: {};
                 readonly definition: {
@@ -45,7 +46,7 @@ declare const Dropdown: {
                     readonly style: {
                         readonly base: {
                             readonly default: {
-                                readonly 'background-color': "white";
+                                readonly 'background-color': "light-dark(white, oklch(0.21 0.006 285.885))";
                                 readonly 'padding-right': "4px";
                                 readonly 'padding-bottom': "4px";
                                 readonly 'padding-left': "4px";
@@ -70,6 +71,9 @@ declare const Dropdown: {
         } & import('@plitzi/sdk-shared/authoring/declare').ElementAttributesBrand<unknown>;
     };
     type: "dropdown";
+    attributeValues: {
+        readonly popupPlacement: readonly string[];
+    };
     content: {
         readonly attributes: {
             readonly popupPlacement: "bottom";

package/dist/elements/basic/Dropdown/useDropdown.d.ts

@@ -10,6 +10,11 @@ export type UseDropdownProps = {
     disabled?: boolean;
     loading?: boolean;
     closeOnClickPopup?: boolean;
+    /**
+     * Close when the pointer goes down anywhere outside the trigger and the popup. What a menu is expected to do; off by
+     * default here because a caller that renders its own backdrop closes from that instead.
+     */
+    closeOnClickOutside?: boolean;
     placement?: 'left' | 'right' | 'top' | 'bottom';
     myWindow?: Window | null;
     offsetX?: number;
@@ -24,5 +29,5 @@ export type UseDropdownReturn = [
     DOMRect | undefined,
     FloatingPosition | undefined
 ];
-declare const useDropdown: ({ ref, popupRef, open: openProp, placement, disabled, loading, closeOnClickPopup, offsetX, offsetY, myWindow, onChange }: UseDropdownProps) => UseDropdownReturn;
+declare const useDropdown: ({ ref, popupRef, open: openProp, placement, disabled, loading, closeOnClickPopup, closeOnClickOutside, offsetX, offsetY, myWindow, onChange }: UseDropdownProps) => UseDropdownReturn;
 export default useDropdown;