@vizejs/ui 0.387.0 → 0.388.0

package/dist/context.mjs

@@ -1,5 +1,5 @@
 import { inject, provide } from "vue";
-//#region src/context.ts
+//#region src/families/foundations/context/context.ts
 const missingContext = Symbol("missing component context");
 /**
 * Creates an immutable typed context for a compound component family.

package/dist/{controllable-state-BtoxKahh.d.mts → controllable-state-CZZF9Pw5.d.mts}

@@ -1,6 +1,6 @@
 import { ComputedRef, MaybeRefOrGetter } from "vue";
 
-//#region src/controllable-state.d.ts
+//#region src/families/foundations/controllable-state/controllable-state.d.ts
 /** Direct value or updater accepted by {@link ControllableState.set}. */
 type StateUpdate<Value> = Value | ((previous: Value) => Value);
 /** Options for {@link useControllableState}. */

package/dist/controllable-state.d.mts

@@ -1,2 +1,2 @@
-import { i as useControllableState, n as ControllableStateOptions, r as StateUpdate, t as ControllableState } from "./controllable-state-BtoxKahh.mjs";
+import { i as useControllableState, n as ControllableStateOptions, r as StateUpdate, t as ControllableState } from "./controllable-state-CZZF9Pw5.mjs";
 export { ControllableState, ControllableStateOptions, StateUpdate, useControllableState };

package/dist/controllable-state.mjs

@@ -1,5 +1,5 @@
 import { computed, shallowRef, toValue, watch } from "vue";
-//#region src/controllable-state.ts
+//#region src/families/foundations/controllable-state/controllable-state.ts
 /**
 * Create one state contract for controlled props and internal state.
 *

package/dist/copy-button-BH2em7nG.mjs

@@ -0,0 +1,212 @@
+import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
+import { computed, createBlock, createElementVNode, defineComponent, guardReactiveProps, normalizeProps, openBlock, renderSlot, resolveDynamicComponent, shallowRef, toDisplayString, useTemplateRef, watch, withCtx } from "vue";
+//#region src/families/actions/copy-button/copy-button.vue?vue&type=script&setup=true&lang.ts
+const _hoisted_1 = {
+	"data-vize-ui": "copy-button-label",
+	part: "label"
+};
+const COPY_BUTTON_CLIPBOARD_UNAVAILABLE = "VIZE_UI_COPY_BUTTON_CLIPBOARD_UNAVAILABLE";
+//#endregion
+//#region src/families/actions/copy-button/copy-button.vue
+var copy_button_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
+	__name: "copy-button",
+	props: {
+		as: {
+			type: null,
+			required: false,
+			default: "button"
+		},
+		native: {
+			type: Boolean,
+			required: false,
+			default: () => void 0
+		},
+		type: {
+			type: String,
+			required: false,
+			default: "button"
+		},
+		value: {
+			type: String,
+			required: true
+		},
+		disabled: {
+			type: Boolean,
+			required: false,
+			default: false
+		},
+		idleLabel: {
+			type: String,
+			required: false,
+			default: "Copy"
+		},
+		copiedLabel: {
+			type: String,
+			required: false,
+			default: "Copied"
+		},
+		errorLabel: {
+			type: String,
+			required: false,
+			default: "Copy failed"
+		},
+		ariaLabel: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		ariaLabelledby: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		ariaDescribedby: {
+			type: String,
+			required: false,
+			default: () => void 0
+		},
+		writer: {
+			type: Function,
+			required: false,
+			default: void 0
+		}
+	},
+	emits: ["copy", "error"],
+	setup(__props, { expose: __expose, emit: __emit }) {
+		const emit = __emit;
+		const element = useTemplateRef("element");
+		const stateValue = shallowRef("idle");
+		const writingValue = shallowRef(false);
+		const isNativeButton = computed(() => __props.native ?? __props.as === "button");
+		const buttonType = computed(() => __props.type);
+		const disabledValue = computed(() => __props.disabled);
+		const copyValue = computed(() => __props.value);
+		const unavailable = computed(() => disabledValue.value || writingValue.value);
+		const label = computed(() => stateValue.value === "copied" ? __props.copiedLabel : stateValue.value === "error" ? __props.errorLabel : __props.idleLabel);
+		const tabIndex = computed(() => {
+			if (isNativeButton.value) return void 0;
+			return disabledValue.value ? -1 : 0;
+		});
+		const ariaLabelValue = computed(() => hasText(__props.ariaLabel) ? __props.ariaLabel : void 0);
+		const ariaLabelledbyValue = computed(() => hasText(__props.ariaLabelledby) ? __props.ariaLabelledby : void 0);
+		const slotState = computed(() => ({
+			disabled: disabledValue.value,
+			label: label.value,
+			state: stateValue.value,
+			unavailable: unavailable.value,
+			value: __props.value,
+			writing: writingValue.value
+		}));
+		watch(() => __props.value, () => {
+			stateValue.value = "idle";
+		}, { flush: "sync" });
+		function onClick(event) {
+			if (unavailable.value) {
+				event.preventDefault();
+				event.stopImmediatePropagation();
+				return;
+			}
+			copyValueToClipboard(copyValue.value, event);
+		}
+		async function copyValueToClipboard(nextValue, event) {
+			writingValue.value = true;
+			try {
+				await (__props.writer ?? writeTextWithNavigatorClipboard)(nextValue);
+				stateValue.value = "copied";
+				emit("copy", nextValue, event);
+			} catch (error) {
+				stateValue.value = "error";
+				emit("error", error, nextValue, event);
+			} finally {
+				writingValue.value = false;
+			}
+		}
+		function onKeyboard(event, phase) {
+			if (isNativeButton.value) return;
+			const action = getCopyButtonKeyboardAction(event.key, phase);
+			if (action === "ignore") return;
+			event.preventDefault();
+			if (unavailable.value) {
+				event.stopImmediatePropagation();
+				return;
+			}
+			if (action === "activate" && event.currentTarget instanceof HTMLElement) event.currentTarget.click();
+		}
+		function onKeydown(event) {
+			onKeyboard(event, "keydown");
+		}
+		function onKeyup(event) {
+			onKeyboard(event, "keyup");
+		}
+		function getCopyButtonKeyboardAction(key, phase) {
+			if (key === "Enter") return phase === "keydown" ? "activate" : "ignore";
+			if (key === " ") return phase === "keydown" ? "prevent" : "activate";
+			return "ignore";
+		}
+		function focus(options) {
+			focusTarget(element.value, options);
+		}
+		function focusTarget(target, options) {
+			if (typeof target === "object" && target !== null && "focus" in target && typeof target.focus === "function") target.focus(options);
+		}
+		async function writeTextWithNavigatorClipboard(nextValue) {
+			const writeText = globalThis.navigator?.clipboard?.writeText;
+			if (typeof writeText !== "function") throw new Error(COPY_BUTTON_CLIPBOARD_UNAVAILABLE);
+			await writeText.call(globalThis.navigator.clipboard, nextValue);
+		}
+		function hasText(nextValue) {
+			return nextValue != null && nextValue.trim().length > 0;
+		}
+		__expose({
+			disabled: disabledValue,
+			element,
+			focus,
+			label,
+			state: stateValue,
+			unavailable,
+			value: copyValue,
+			writing: writingValue
+		});
+		return (_ctx, _cache) => {
+			return openBlock(), createBlock(resolveDynamicComponent(__props.as), {
+				ref_key: "element",
+				ref: element,
+				type: isNativeButton.value ? buttonType.value : void 0,
+				disabled: isNativeButton.value ? disabledValue.value : void 0,
+				role: isNativeButton.value ? void 0 : "button",
+				tabindex: tabIndex.value,
+				"aria-label": ariaLabelledbyValue.value === void 0 ? ariaLabelValue.value : void 0,
+				"aria-labelledby": ariaLabelledbyValue.value,
+				"aria-describedby": __props.ariaDescribedby,
+				"aria-disabled": unavailable.value && (!isNativeButton.value || writingValue.value) ? "true" : void 0,
+				"aria-busy": writingValue.value ? "true" : void 0,
+				"data-vize-ui": "copy-button",
+				part: "root",
+				"data-state": stateValue.value,
+				"data-disabled": disabledValue.value ? "true" : void 0,
+				"data-writing": writingValue.value ? "true" : void 0,
+				onClick,
+				onKeydown,
+				onKeyup
+			}, {
+				default: withCtx(() => [renderSlot(_ctx.$slots, "default", normalizeProps(guardReactiveProps(slotState.value)), () => [createElementVNode("span", _hoisted_1, toDisplayString(label.value), 1)], true)]),
+				_: 3
+			}, 40, [
+				"type",
+				"disabled",
+				"role",
+				"tabindex",
+				"aria-label",
+				"aria-labelledby",
+				"aria-describedby",
+				"aria-disabled",
+				"aria-busy",
+				"data-state",
+				"data-disabled",
+				"data-writing"
+			]);
+		};
+	}
+}), [["__scopeId", "data-v-ed65dbe3"]]);
+//#endregion
+export { copy_button_default as t };

package/dist/copy-button.d.mts

@@ -0,0 +1,2 @@
+import { Co as CopyButtonType, So as CopyButtonState, _o as CopyButtonExpose, bo as CopyButtonSlotState, do as _default, fo as CopyButtonCssCustomProperty, go as CopyButtonEmits, ho as CopyButtonElement, mo as CopyButtonDataName, po as CopyButtonDataAttribute, vo as CopyButtonPart, wo as CopyButtonWriter, xo as CopyButtonSlots, yo as CopyButtonProps } from "./announcer-DGr2Iz0i.mjs";
+export { _default as CopyButton, type CopyButtonCssCustomProperty, type CopyButtonDataAttribute, type CopyButtonDataName, type CopyButtonElement, type CopyButtonEmits, type CopyButtonExpose, type CopyButtonPart, type CopyButtonProps, type CopyButtonSlotState, type CopyButtonSlots, type CopyButtonState, type CopyButtonType, type CopyButtonWriter };

package/dist/copy-button.mjs

@@ -0,0 +1,2 @@
+import { t as copy_button_default } from "./copy-button-BH2em7nG.mjs";
+export { copy_button_default as CopyButton };

package/dist/{id-BV9AJ3cm.d.mts → deterministic-id-DYQJ7KzM.d.mts}

@@ -1,6 +1,6 @@
 import { ComputedRef, MaybeRefOrGetter } from "vue";
 
-//#region src/deterministic-id.d.ts
+//#region src/families/foundations/id/deterministic-id.d.ts
 declare const deterministicIdBrand: unique symbol;
 /** A validated DOM identifier created or accepted by the deterministic ID system. */
 type DeterministicId = string & {
@@ -90,37 +90,4 @@ declare function createDeterministicIdScope(options: DeterministicIdScopeOptions
  */
 declare function useDeterministicId(options?: DeterministicIdOptions): ComputedRef<DeterministicId>;
 //#endregion
-//#region src/DeterministicIdProvider.vue.d.ts
-type __VLS_Props = {
-  /**
-   * Namespace prefix for this subtree.
-   *
-   * @default The parent prefix when nested; otherwise "vize"
-   */
-  readonly prefix?: string;
-  /**
-   * Stable request, island, or subtree seed.
-   *
-   * @default Vue's SSR- and hydration-stable useId() value
-   */
-  readonly seed?: string | number;
-};
-type __VLS_Slots = {
-  /** Renders descendants with the resolved deterministic identifier namespace. */default(props: {
-    readonly namespace: string;
-    readonly prefix: string;
-  }): unknown;
-};
-declare const __VLS_base: import("vue").DefineComponent<__VLS_Props, {
-  namespace: string;
-  prefix: string;
-}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
-declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
-declare const _default: typeof __VLS_export;
-type __VLS_WithSlots<T, S> = T & {
-  new (): {
-    $slots: S;
-  };
-};
-//#endregion
-export { DeterministicIdScope as a, createDeterministicIdScope as c, useDeterministicId as d, DeterministicIdOptions as i, deriveDeterministicId as l, DeterministicId as n, DeterministicIdScopeOptions as o, DeterministicIdChildScopeOptions as r, DeterministicIdSeed as s, _default as t, toDeterministicId as u };
+export { DeterministicIdScopeOptions as a, deriveDeterministicId as c, DeterministicIdScope as i, toDeterministicId as l, DeterministicIdChildScopeOptions as n, DeterministicIdSeed as o, DeterministicIdOptions as r, createDeterministicIdScope as s, DeterministicId as t, useDeterministicId as u };

package/dist/{id-mziSyAse.mjs → deterministic-id-yMq4HfmS.mjs}

@@ -1,6 +1,5 @@
-import { t as _plugin_vue_export_helper_default } from "./_plugin-vue_export-helper-BOaGB7Aw.mjs";
-import { computed, defineComponent, getCurrentInstance, inject, provide, renderSlot, toValue, unref, useId } from "vue";
-//#region src/deterministic-id.ts
+import { computed, getCurrentInstance, inject, provide, toValue, useId } from "vue";
+//#region src/families/foundations/id/deterministic-id.ts
 const deterministicIdScopeKey = Symbol("VizeUiDeterministicIdScope");
 const safePrefix = /^[A-Za-z][A-Za-z0-9_-]*$/;
 const safeSegment = /^[A-Za-z0-9][A-Za-z0-9_-]*$/;
@@ -92,46 +91,4 @@ function normalizeSegment(value, role) {
 	return value;
 }
 //#endregion
-//#region src/DeterministicIdProvider.vue
-var DeterministicIdProvider_default = /*#__PURE__*/ _plugin_vue_export_helper_default(/* @__PURE__ */ defineComponent({
-	__name: "DeterministicIdProvider",
-	props: {
-		prefix: {
-			type: String,
-			required: false,
-			default: () => void 0
-		},
-		seed: {
-			type: [String, Number],
-			required: false,
-			default: () => void 0
-		}
-	},
-	setup(__props, { expose: __expose }) {
-		const vueSeed = useId();
-		const parent = useOptionalDeterministicIdScope();
-		const resolvedSeed = __props.seed ?? vueSeed;
-		const scope = parent === void 0 ? createDeterministicIdScope({
-			prefix: __props.prefix ?? "vize",
-			seed: resolvedSeed
-		}) : __props.prefix === void 0 ? parent.createChild({ seed: resolvedSeed }) : parent.createChild({
-			prefix: __props.prefix,
-			seed: resolvedSeed
-		});
-		provideDeterministicIdScope(scope);
-		const namespace = scope.namespace;
-		const resolvedPrefix = scope.prefix;
-		__expose({
-			namespace,
-			prefix: resolvedPrefix
-		});
-		return (_ctx, _cache) => {
-			return renderSlot(_ctx.$slots, "default", {
-				namespace: unref(namespace),
-				prefix: unref(resolvedPrefix)
-			}, void 0, true);
-		};
-	}
-}), [["__scopeId", "data-v-2521c635"]]);
-//#endregion
-export { useDeterministicId as a, toDeterministicId as i, createDeterministicIdScope as n, deriveDeterministicId as r, DeterministicIdProvider_default as t };
+export { useDeterministicId as a, toDeterministicId as i, deriveDeterministicId as n, useOptionalDeterministicIdScope as o, provideDeterministicIdScope as r, createDeterministicIdScope as t };