@entry-ui/qwik 0.7.0 → 0.9.0

package/lib/hooks/use-clipboard/use-clipboard.d.ts

@@ -0,0 +1,19 @@
+import type { UseClipboardParams, UseClipboardReturnValue } from './use-clipboard.types';
+/**
+ * A hook that provides an interface for interacting with the system clipboard.
+ *
+ * This hook encapsulates the complexity of the asynchronous Clipboard API, exposing
+ * its state through readonly signals for predictable data flow. It manages both
+ * success and error states, ensuring that UI feedback remains consistent across
+ * different browser environments.
+ *
+ * It features a built-in auto-reset mechanism via the `timeoutMs` parameter,
+ * which automatically clears the `copied` and `error` states after a specified duration.
+ * An optional `onStatusChange$` callback allows reacting to changes in the
+ * operation status from outside the hook.
+ *
+ * To ensure stability and security, the hook includes development-time checks
+ * to prevent server-side execution, as clipboard operations strictly require
+ * a browser environment and typically a user gesture.
+ */
+export declare const useClipboard: (params?: UseClipboardParams) => UseClipboardReturnValue;

package/lib/hooks/use-clipboard/use-clipboard.qwik.mjs

@@ -0,0 +1,93 @@
+import { useSignal, $ } from "@qwik.dev/core";
+import { copyToClipboard } from "@entry-ui/utilities/copy-to-clipboard";
+import { fail } from "../../_internal/utilities/fail/fail.qwik.mjs";
+import { error } from "../../_internal/utilities/error/error.qwik.mjs";
+import { isDev, isServer } from "@qwik.dev/core/build";
+const useClipboard = (params = {}) => {
+  const { timeoutMs = 3e3, onStatusChange$ } = params;
+  const error$1 = useSignal(null);
+  const copied = useSignal(false);
+  const copyTimeout = useSignal(-1);
+  const copy$ = $(async (value) => {
+    if (isDev && isServer) {
+      fail([
+        `The 'copy$' QRL function from the 'useClipboard' hook cannot be called during server-side rendering (SSR).`,
+        `Clipboard API is only available in the browser.`,
+        `Ensure it's only invoked in the browser environment.`
+      ]);
+    }
+    const win = document.defaultView || window;
+    await copyToClipboard({
+      value,
+      onSuccess: () => {
+        if (copyTimeout.value !== -1) {
+          win.clearTimeout(copyTimeout.value);
+        }
+        copyTimeout.value = win.setTimeout(() => {
+          copied.value = false;
+          error$1.value = null;
+          copyTimeout.value = -1;
+          onStatusChange$?.({
+            copied: false,
+            error: null
+          });
+        }, timeoutMs);
+        copied.value = true;
+        error$1.value = null;
+        onStatusChange$?.({
+          copied: true,
+          error: null
+        });
+      },
+      onError: (err) => {
+        const { type, message } = err;
+        copied.value = false;
+        error$1.value = type;
+        onStatusChange$?.({
+          copied: false,
+          error: type
+        });
+        if (isDev) {
+          if (type === "NOT_SUPPORTED") {
+            error([
+              `An error occurred during the 'copy$' QRL function execution in 'useClipboard' hook.`,
+              `Clipboard API is not supported in this browser.`,
+              `Consider using a modern browser with Clipboard API support.`
+            ]);
+          }
+          if (type === "COPY_FAILED") {
+            error([
+              `An error occurred during the 'copy$' QRL function execution in 'useClipboard' hook.`,
+              `The copy operation failed.`,
+              ...message ? [
+                `Check clipboard permissions: ${message}`
+              ] : []
+            ]);
+          }
+        }
+      }
+    });
+  });
+  const reset$ = $(() => {
+    copied.value = false;
+    error$1.value = null;
+    const win = document.defaultView || window;
+    if (copyTimeout.value !== -1) {
+      win.clearTimeout(copyTimeout.value);
+      copyTimeout.value = -1;
+    }
+    onStatusChange$?.({
+      copied: false,
+      error: null
+    });
+  });
+  return {
+    copied,
+    error: error$1,
+    copy$,
+    reset$
+  };
+};
+export {
+  useClipboard
+};

package/lib/hooks/use-clipboard/use-clipboard.types.d.ts

@@ -0,0 +1,58 @@
+import type { ReadonlySignal, QRL } from '@qwik.dev/core';
+/**
+ * Configuration parameters for the `useClipboard` hook.
+ */
+export interface UseClipboardParams {
+    /**
+     * The duration in milliseconds before the `copied` signal automatically reverts
+     * to `false` and the `error` state is cleared after a successful copy operation.
+     *
+     * @default 3000
+     */
+    timeoutMs?: number;
+    /**
+     * An optional `QRL` callback invoked whenever the clipboard operation status changes.
+     * It provides a detailed object containing the current `copied` state and any
+     * associated `error`. This callback is triggered upon a successful copy,
+     * when an error occurs, or when the state is reset (either automatically
+     * after `timeoutMs` or manually via `reset$`).
+     *
+     * @default undefined
+     */
+    onStatusChange$?: QRL<(details: {
+        copied: boolean;
+        error: 'NOT_SUPPORTED' | 'COPY_FAILED' | null;
+    }) => void>;
+}
+/**
+ * Represents the object returned by the `useClipboard` hook.
+ */
+export interface UseClipboardReturnValue {
+    /**
+     * A readonly signal that indicates whether a text string was successfully copied.
+     * This value is set to `true` immediately after a successful copy operation
+     * and automatically reverts to `false` after the specified `timeoutMs` duration
+     * has elapsed or if the state is manually reset.
+     */
+    copied: ReadonlySignal<boolean>;
+    /**
+     * A readonly signal representing the current error state of the clipboard operation.
+     * Returns `"NOT_SUPPORTED"` if the Clipboard API is unavailable in the environment,
+     * `"COPY_FAILED"` if the operation was rejected (e.g., due to lack of permissions),
+     * or `null` if the last operation was successful or has been reset.
+     */
+    error: ReadonlySignal<'NOT_SUPPORTED' | 'COPY_FAILED' | null>;
+    /**
+     * A `QRL` function that asynchronously transfers a provided string to the system clipboard.
+     * This function must be invoked in a browser environment, typically as a result
+     * of a user gesture (like a click), and updates the `copied` and `error` signals
+     * based on the outcome of the operation.
+     */
+    copy$: QRL<(value: string) => Promise<void>>;
+    /**
+     * A `QRL` function that restores the hook's state to its initial values.
+     * It sets `copied` to `false`, clears any active `error`, and cancels any
+     * pending timeout scheduled to reset the success state.
+     */
+    reset$: QRL<() => void>;
+}

package/lib/index.qwik.mjs

@@ -6,10 +6,20 @@ import * as index$1 from "./components/alert/parts/index.qwik.mjs";
 import * as index$2 from "./components/collapsible/parts/index.qwik.mjs";
 import { useCollapsibleRootContext } from "./components/collapsible/hooks/use-collapsible-root-context/use-collapsible-root-context.qwik.mjs";
 import { useCollapsibleTriggerContext } from "./components/collapsible/hooks/use-collapsible-trigger-context/use-collapsible-trigger-context.qwik.mjs";
-import * as index$3 from "./components/separator/parts/index.qwik.mjs";
-import * as index$4 from "./components/toggle/parts/index.qwik.mjs";
+import * as index$3 from "./components/copy-button/parts/index.qwik.mjs";
+import { useCopyButtonRootContext } from "./components/copy-button/hooks/use-copy-button-root-context/use-copy-button-root-context.qwik.mjs";
+import * as index$4 from "./components/roving-focus-group/parts/index.qwik.mjs";
+import { useRovingFocusGroupRootContext } from "./components/roving-focus-group/hooks/use-roving-focus-group-root-context/use-roving-focus-group-root-context.qwik.mjs";
+import { useRovingFocusGroupItemContext } from "./components/roving-focus-group/hooks/use-roving-focus-group-item-context/use-roving-focus-group-item-context.qwik.mjs";
+import * as index$5 from "./components/separator/parts/index.qwik.mjs";
+import * as index$6 from "./components/tabs/parts/index.qwik.mjs";
+import { useTabsRootContext } from "./components/tabs/hooks/use-tabs-root-context/use-tabs-root-context.qwik.mjs";
+import { useTabsTabContext } from "./components/tabs/hooks/use-tabs-tab-context/use-tabs-tab-context.qwik.mjs";
+import { useTabsPanelContext } from "./components/tabs/hooks/use-tabs-panel-context/use-tabs-panel-context.qwik.mjs";
+import * as index$7 from "./components/toggle/parts/index.qwik.mjs";
 import { useToggleRootContext } from "./components/toggle/hooks/use-toggle-root-context/use-toggle-root-context.qwik.mjs";
 import { useBoolean } from "./hooks/use-boolean/use-boolean.qwik.mjs";
+import { useClipboard } from "./hooks/use-clipboard/use-clipboard.qwik.mjs";
 import { useControllable } from "./hooks/use-controllable/use-controllable.qwik.mjs";
 import { useCounter } from "./hooks/use-counter/use-counter.qwik.mjs";
 import { useCycle } from "./hooks/use-cycle/use-cycle.qwik.mjs";
@@ -21,8 +31,11 @@ export {
   index as Accordion,
   index$1 as Alert,
   index$2 as Collapsible,
-  index$3 as Separator,
-  index$4 as Toggle,
+  index$3 as CopyButton,
+  index$4 as RovingFocusGroup,
+  index$5 as Separator,
+  index$6 as Tabs,
+  index$7 as Toggle,
   makeEventPreventable,
   mergeRefs,
   mergeStyles,
@@ -30,11 +43,18 @@ export {
   useAccordionItemTriggerContext,
   useAccordionRootContext,
   useBoolean,
+  useClipboard,
   useCollapsibleRootContext,
   useCollapsibleTriggerContext,
   useControllable,
+  useCopyButtonRootContext,
   useCounter,
   useCycle,
   useLifecycle,
+  useRovingFocusGroupItemContext,
+  useRovingFocusGroupRootContext,
+  useTabsPanelContext,
+  useTabsRootContext,
+  useTabsTabContext,
   useToggleRootContext
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@entry-ui/qwik",
-  "version": "0.7.0",
+  "version": "0.9.0",
   "description": "",
   "keywords": [],
   "homepage": "https://github.com/ZAHON/entry-ui#readme",
@@ -27,10 +27,22 @@
       "types": "./lib/components/collapsible/index.d.ts",
       "import": "./lib/components/collapsible/index.qwik.mjs"
     },
+    "./copy-button": {
+      "types": "./lib/components/copy-button/index.d.ts",
+      "import": "./lib/components/copy-button/index.qwik.mjs"
+    },
+    "./roving-focus-group": {
+      "types": "./lib/components/roving-focus-group/index.d.ts",
+      "import": "./lib/components/roving-focus-group/index.qwik.mjs"
+    },
     "./separator": {
       "types": "./lib/components/separator/index.d.ts",
       "import": "./lib/components/separator/index.qwik.mjs"
     },
+    "./tabs": {
+      "types": "./lib/components/tabs/index.d.ts",
+      "import": "./lib/components/tabs/index.qwik.mjs"
+    },
     "./toggle": {
       "types": "./lib/components/toggle/index.d.ts",
       "import": "./lib/components/toggle/index.qwik.mjs"
@@ -39,6 +51,10 @@
       "types": "./lib/hooks/use-boolean/index.d.ts",
       "import": "./lib/hooks/use-boolean/index.qwik.mjs"
     },
+    "./use-clipboard": {
+      "types": "./lib/hooks/use-clipboard/index.d.ts",
+      "import": "./lib/hooks/use-clipboard/index.qwik.mjs"
+    },
     "./use-controllable": {
       "types": "./lib/hooks/use-controllable/index.d.ts",
       "import": "./lib/hooks/use-controllable/index.qwik.mjs"
@@ -108,7 +124,7 @@
     "qwik": "qwik"
   },
   "dependencies": {
-    "@entry-ui/utilities": "^0.6.0"
+    "@entry-ui/utilities": "^0.8.0"
   },
   "devDependencies": {
     "@entry-ui/eslint": "workspace:*",