@ac-design/design-system 2.5.0 → 2.5.1

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.
Files changed (3) hide show
  1. package/dist/lib/components/AcCopyButton.vue.d.ts +1 -1
  2. package/dist/lib/components/AcCopyButton.vue_vue_type_script_setup_true_lang.js +40 -40
  3. package/package.json +1 -1
package/dist/lib/components/AcCopyButton.vue.d.ts CHANGED
@@ -1,7 +1,7 @@
1
1
  export interface Props {
2
2
  /** The text copied to the clipboard, e.g. a cluster ID, IP address or endpoint. */
3
3
  value: string;
4
- /** What the value is, in lower case: "cluster ID", "public IP". Read as "Copy cluster ID" and announced as "Copied cluster ID". */
4
+ /** What the value is, in lower case: "cluster ID", "public IP". The tooltip and screen readers say "Copy cluster ID", then "Copied cluster ID". Without it they say "Copy" and "Copied". */
5
5
  label?: string;
6
6
  /** Text shown instead of `value`, e.g. the first 8 characters of a UUID. The tooltip shows the full value. */
7
7
  display?: string;
package/dist/lib/components/AcCopyButton.vue_vue_type_script_setup_true_lang.js CHANGED
@@ -3,15 +3,15 @@ import { copyText as t } from "../composables/copyText.js";
3
3
  import { Fragment as n, computed as r, createBlock as i, createCommentVNode as a, createElementBlock as o, createElementVNode as s, createTextVNode as c, createVNode as l, defineComponent as u, mergeProps as d, nextTick as f, normalizeClass as p, onBeforeUnmount as m, openBlock as h, ref as g, renderSlot as _, toDisplayString as v, unref as y, useAttrs as b, withCtx as x, withModifiers as S } from "vue";
4
4
  import { Check as C, Copy as w } from "@lucide/vue";
5
5
  //#region src/lib/components/AcCopyButton.vue?vue&type=script&setup=true&lang.ts
6
- var T = ["aria-label"], E = { class: "sr-only" }, D = { class: "block font-mono break-all" }, O = {
6
+ var T = ["aria-label"], E = { class: "sr-only" }, D = { class: "block font-mono break-all" }, O = { class: "block text-on-tooltip/70" }, k = {
7
7
  class: "sr-only",
8
8
  role: "status"
9
- }, k = 1500, A = /*@__PURE__*/ u({
9
+ }, A = 1500, j = /*@__PURE__*/ u({
10
10
  inheritAttrs: !1,
11
11
  __name: "AcCopyButton",
12
12
  props: {
13
13
  value: {},
14
- label: { default: "value" },
14
+ label: { default: "" },
15
15
  display: { default: "" },
16
16
  mono: {
17
17
  type: Boolean,
@@ -25,68 +25,68 @@ var T = ["aria-label"], E = { class: "sr-only" }, D = { class: "block font-mono
25
25
  variant: { default: "plain" }
26
26
  },
27
27
  emits: ["copy"],
28
- setup(u, { expose: A, emit: j }) {
29
- let M = u, N = j, P = b(), F = g(null), I = g(null), L = g("idle"), R = g(!1), z, B = r(() => ({
30
- class: P.class,
31
- style: P.style
32
- })), V = r(() => {
33
- let { class: e, style: t, ...n } = P;
28
+ setup(u, { expose: j, emit: M }) {
29
+ let N = u, P = M, F = b(), I = g(null), L = g(null), R = g("idle"), z = g(!1), B, V = r(() => ({
30
+ class: F.class,
31
+ style: F.style
32
+ })), H = r(() => {
33
+ let { class: e, style: t, ...n } = F;
34
34
  return n;
35
- }), H = r(() => M.display || M.value), U = r(() => !M.iconOnly && (R.value || !!M.display && M.display !== M.value)), W = r(() => M.iconOnly ? M.size === "small" ? "size-6 justify-center rounded-6" : "size-7 justify-center rounded-8" : M.variant === "chip" ? M.size === "small" ? "gap-1.5 rounded-8 px-2 py-0.5 text-xs" : "gap-1.5 rounded-8 px-2.5 py-1 text-base" : M.size === "small" ? "gap-1 rounded-4 text-xs" : M.size === "normal" ? "gap-1.5 rounded-6 text-base" : "gap-1 rounded-4"), G = r(() => M.iconOnly ? "text-muted hover:bg-surface-sunken hover:text-heading" : M.variant === "chip" ? "border border-border bg-surface-sunken/50 text-muted hover:border-border-dark hover:text-heading" : M.size ? "text-heading" : ""), K = r(() => M.iconOnly && M.size !== "small" ? "size-4" : "size-3.5"), q = r(() => M.iconOnly ? "" : M.variant === "chip" ? "text-muted opacity-60 group-hover:opacity-100 group-focus-visible:opacity-100" : "text-muted opacity-0 group-hover:opacity-100 group-focus-visible:opacity-100 pointer-coarse:opacity-100");
36
- function J() {
37
- let e = I.value;
38
- R.value = !!e && e.scrollWidth > e.clientWidth + 1;
35
+ }), U = r(() => N.display || N.value), W = r(() => N.label ? ` ${N.label}` : ""), G = r(() => N.label || "value"), K = r(() => !N.iconOnly && (z.value || !!N.display && N.display !== N.value)), q = r(() => N.iconOnly ? N.size === "small" ? "size-6 justify-center rounded-6" : "size-7 justify-center rounded-8" : N.variant === "chip" ? N.size === "small" ? "gap-1.5 rounded-8 px-2 py-0.5 text-xs" : "gap-1.5 rounded-8 px-2.5 py-1 text-base" : N.size === "small" ? "gap-1 rounded-4 text-xs" : N.size === "normal" ? "gap-1.5 rounded-6 text-base" : "gap-1 rounded-4"), J = r(() => N.iconOnly ? "text-muted hover:bg-surface-sunken hover:text-heading" : N.variant === "chip" ? "border border-border bg-surface-sunken/50 text-muted hover:border-border-dark hover:text-heading" : N.size ? "text-heading" : ""), Y = r(() => N.iconOnly && N.size !== "small" ? "size-4" : "size-3.5"), X = r(() => N.iconOnly ? "" : N.variant === "chip" ? "text-muted opacity-60 group-hover:opacity-100 group-focus-visible:opacity-100" : "text-muted opacity-0 group-hover:opacity-100 group-focus-visible:opacity-100 pointer-coarse:opacity-100");
36
+ function Z() {
37
+ let e = L.value;
38
+ z.value = !!e && e.scrollWidth > e.clientWidth + 1;
39
39
  }
40
- async function Y() {
41
- clearTimeout(z);
40
+ async function Q() {
41
+ clearTimeout(B);
42
42
  try {
43
- await t(M.value), L.value = "copied", N("copy", M.value);
43
+ await t(N.value), R.value = "copied", P("copy", N.value);
44
44
  } catch {
45
- L.value = "failed";
45
+ R.value = "failed";
46
46
  }
47
- z = setTimeout(() => L.value = "idle", k), await f(), X();
47
+ B = setTimeout(() => R.value = "idle", A), await f(), $();
48
48
  }
49
- function X() {
50
- let e = F.value?.closest("[data-testid=\"ac-tooltip\"]");
51
- e && F.value?.matches(":hover") && e.dispatchEvent(new PointerEvent("pointerenter", { pointerType: "mouse" }));
49
+ function $() {
50
+ let e = I.value?.closest("[data-testid=\"ac-tooltip\"]");
51
+ e && I.value?.matches(":hover") && e.dispatchEvent(new PointerEvent("pointerenter", { pointerType: "mouse" }));
52
52
  }
53
- function Z() {
54
- F.value?.focus();
53
+ function ee() {
54
+ I.value?.focus();
55
55
  }
56
- return m(() => clearTimeout(z)), A({ focus: Z }), (t, r) => (h(), o("span", d({ class: "inline-flex max-w-full min-w-0 align-middle" }, B.value, {
56
+ return m(() => clearTimeout(B)), j({ focus: ee }), (t, r) => (h(), o("span", d({ class: "inline-flex max-w-full min-w-0 align-middle" }, V.value, {
57
57
  "data-ac-ds": "",
58
58
  "data-testid": "ac-copy-button"
59
59
  }), [l(e, {
60
60
  class: "min-w-0 flex-auto",
61
- delay: L.value === "idle" ? 300 : 0
61
+ delay: R.value === "idle" ? 300 : 0
62
62
  }, {
63
- content: x(() => [L.value === "copied" ? (h(), o(n, { key: 0 }, [c("Copied")], 64)) : L.value === "failed" ? (h(), o(n, { key: 1 }, [c("Couldn't copy. The browser blocked the clipboard.")], 64)) : U.value ? (h(), o(n, { key: 2 }, [s("span", D, v(u.value), 1), r[0] ||= s("span", { class: "block text-on-tooltip/70" }, "Click to copy", -1)], 64)) : (h(), o(n, { key: 3 }, [c("Copy")], 64))]),
63
+ content: x(() => [R.value === "copied" ? (h(), o(n, { key: 0 }, [c("Copied" + v(W.value), 1)], 64)) : R.value === "failed" ? (h(), o(n, { key: 1 }, [c("Couldn't copy" + v(W.value) + ". The browser blocked the clipboard.", 1)], 64)) : K.value ? (h(), o(n, { key: 2 }, [s("span", D, v(u.value), 1), s("span", O, "Click to copy" + v(W.value), 1)], 64)) : (h(), o(n, { key: 3 }, [c("Copy" + v(W.value), 1)], 64))]),
64
64
  default: x(() => [s("button", d({
65
65
  ref_key: "button",
66
- ref: F,
66
+ ref: I,
67
67
  type: "button",
68
- class: ["group inline-flex max-w-full min-w-0 flex-auto cursor-pointer items-center text-left transition-[color,background-color,border-color] duration-200 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-surface focus-visible:outline-none", [W.value, G.value]],
69
- "aria-label": u.iconOnly ? `Copy ${u.label}` : void 0
70
- }, V.value, {
71
- onClick: S(Y, ["stop"]),
72
- onPointerenter: J,
73
- onFocus: J
74
- }), [u.iconOnly ? a("", !0) : (h(), o(n, { key: 0 }, [s("span", E, v(`Copy ${u.label}: `), 1), s("span", {
68
+ class: ["group inline-flex max-w-full min-w-0 flex-auto cursor-pointer items-center text-left transition-[color,background-color,border-color] duration-200 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-surface focus-visible:outline-none", [q.value, J.value]],
69
+ "aria-label": u.iconOnly ? `Copy ${G.value}` : void 0
70
+ }, H.value, {
71
+ onClick: S(Q, ["stop"]),
72
+ onPointerenter: Z,
73
+ onFocus: Z
74
+ }), [u.iconOnly ? a("", !0) : (h(), o(n, { key: 0 }, [s("span", E, v(`Copy ${G.value}: `), 1), s("span", {
75
75
  ref_key: "text",
76
- ref: I,
76
+ ref: L,
77
77
  class: p(["min-w-0 truncate", u.mono && "font-mono"])
78
- }, [_(t.$slots, "default", {}, () => [c(v(H.value), 1)])], 2)], 64)), L.value === "copied" ? (h(), i(y(C), {
78
+ }, [_(t.$slots, "default", {}, () => [c(v(U.value), 1)])], 2)], 64)), R.value === "copied" ? (h(), i(y(C), {
79
79
  key: 1,
80
- class: p(["shrink-0 text-primary", K.value]),
80
+ class: p(["shrink-0 text-primary", Y.value]),
81
81
  "aria-hidden": "true"
82
82
  }, null, 8, ["class"])) : (h(), i(y(w), {
83
83
  key: 2,
84
- class: p(["shrink-0 transition-opacity duration-200", [K.value, q.value]]),
84
+ class: p(["shrink-0 transition-opacity duration-200", [Y.value, X.value]]),
85
85
  "aria-hidden": "true"
86
86
  }, null, 8, ["class"]))], 16, T)]),
87
87
  _: 3
88
- }, 8, ["delay"]), s("span", O, v(L.value === "copied" ? `Copied ${u.label}` : L.value === "failed" ? `Couldn't copy ${u.label}` : ""), 1)], 16));
88
+ }, 8, ["delay"]), s("span", k, v(R.value === "copied" ? `Copied ${G.value}` : R.value === "failed" ? `Couldn't copy ${G.value}` : ""), 1)], 16));
89
89
  }
90
90
  });
91
91
  //#endregion
92
- export { A as default };
92
+ export { j as default };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ac-design/design-system",
3
- "version": "2.5.0",
3
+ "version": "2.5.1",
4
4
  "description": "AppsCode design system: Tailwind CSS v4 theme and Vue 3 components.",
5
5
  "repository": {
6
6
  "type": "git",