@scalar/components 0.18.0 → 0.19.0

package/dist/components/ScalarCopy/ScalarCopyButton.vue.js

@@ -0,0 +1,108 @@
+import { defineComponent as y, mergeModels as v, useModel as b, computed as k, createElementBlock as a, openBlock as t, mergeProps as x, unref as C, createVNode as i, createElementVNode as c, Transition as d, withCtx as p, createBlock as h, resolveDynamicComponent as g, normalizeClass as u, renderSlot as l, createTextVNode as r } from "vue";
+import { ScalarIconCheck as w, ScalarIconCopy as B } from "@scalar/icons";
+import { useBindCx as $ } from "@scalar/use-hooks/useBindCx";
+import z from "./ScalarCopyBackdrop.vue.js";
+const S = {
+  "aria-hidden": "true",
+  class: "flex items-center py-1.5 mask-y-from-[calc(100%-8px)] mask-y-to-100%"
+}, M = {
+  key: 0,
+  class: "whitespace-nowrap px-1.5"
+}, N = {
+  key: 0,
+  role: "alert",
+  class: "sr-only"
+}, V = {
+  key: 1,
+  class: "sr-only"
+}, E = {}, A = /* @__PURE__ */ y({
+  ...E,
+  inheritAttrs: !1,
+  __name: "ScalarCopyButton",
+  props: /* @__PURE__ */ v({
+    showLabel: { type: Boolean },
+    placement: { default: "right" }
+  }, {
+    copied: { type: Boolean, default: !1 },
+    copiedModifiers: {}
+  }),
+  emits: ["update:copied"],
+  setup(n) {
+    const o = b(n, "copied"), { cx: m } = $(), f = k(() => o.value ? w : B);
+    return (s, e) => (t(), a("button", x(
+      { type: "button" },
+      C(m)(
+        "group/copy-button relative z-0 flex items-center justify-center",
+        "size-6 p-1.25 -m-1 rounded text-xs bg-b-2",
+        o.value ? "text-c-1" : "text-c-2 hover:text-c-1"
+      )
+    ), [
+      i(d, {
+        mode: "out-in",
+        "enter-active-class": "transition-transform",
+        "enter-from-class": "scale-0",
+        "enter-to-class": "scale-100",
+        "leave-active-class": "transition-transform",
+        "leave-from-class": "scale-100",
+        "leave-to-class": "scale-0"
+      }, {
+        default: p(() => [
+          (t(), h(g(f.value), { class: "size-full" }))
+        ]),
+        _: 1
+      }),
+      e[4] || (e[4] = c("div", { class: "bg-inherit rounded-[inherit] absolute inset-0 -z-1" }, null, -1)),
+      c("div", {
+        class: u(["group/copy-label absolute flex items-center -inset-y-0.5 rounded", {
+          "left-0 pl-[100%]": n.placement === "right",
+          "right-0 pr-[100%]": n.placement === "left"
+        }])
+      }, [
+        c("div", S, [
+          i(d, {
+            mode: "out-in",
+            "enter-active-class": "transition-transform ease-out",
+            "enter-from-class": "translate-y-1.5",
+            "enter-to-class": "translate-y-0",
+            "leave-active-class": "transition-transform ease-in",
+            "leave-from-class": "translate-y-0",
+            "leave-to-class": "-translate-y-1.5"
+          }, {
+            default: p(() => [
+              o.value ? (t(), a("div", M, [
+                l(s.$slots, "copied", {}, () => [
+                  e[0] || (e[0] = r("Copied", -1))
+                ])
+              ])) : (t(), a("div", {
+                key: 1,
+                class: u(["whitespace-nowrap px-1.5", {
+                  "group-hocus/copy-button:block hidden": !n.showLabel && !o.value
+                }])
+              }, [
+                l(s.$slots, "copy", {}, () => [
+                  e[1] || (e[1] = r("Copy", -1))
+                ])
+              ], 2))
+            ]),
+            _: 3
+          })
+        ]),
+        o.value ? (t(), a("div", N, [
+          l(s.$slots, "copied", {}, () => [
+            e[2] || (e[2] = r("Copied", -1))
+          ])
+        ])) : (t(), a("div", V, [
+          l(s.$slots, "copy", {}, () => [
+            e[3] || (e[3] = r("Copy", -1))
+          ])
+        ])),
+        l(s.$slots, "backdrop", {}, () => [
+          i(z)
+        ])
+      ], 2)
+    ], 16));
+  }
+});
+export {
+  A as default
+};

package/dist/components/ScalarCopy/ScalarCopyButton.vue2.js

@@ -0,0 +1,4 @@
+import f from "./ScalarCopyButton.vue.js";
+export {
+  f as default
+};

package/dist/components/ScalarCopy/index.d.ts

@@ -0,0 +1,3 @@
+export { default as ScalarCopy } from './ScalarCopy.vue.js';
+export { default as ScalarCopyButton } from './ScalarCopyButton.vue.js';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/ScalarCopy/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCopy/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,kBAAkB,CAAA;AACxD,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,wBAAwB,CAAA"}

package/dist/components/ScalarCopy/types.d.ts

@@ -0,0 +1,31 @@
+export type ScalarCopyPlacement = 'left' | 'right';
+export type ScalarCopyProps = {
+    /** The content to copy to the clipboard */
+    content?: string;
+    /** The placement of the label relative to the copy button */
+    placement?: ScalarCopyPlacement;
+    /**
+     * Whether the label should always be shown or only when the copy button is hovered
+     */
+    showLabel?: boolean;
+    /**
+     * The duration to show the copied state after the copy button is clicked in milliseconds
+     *
+     * @default 1500
+     */
+    duration?: number;
+};
+export type ScalarCopySlots = {
+    /** The label shown next to the copy button before it is clicked */
+    copy?: () => unknown;
+    /** The label shown next to the copy button after it is clicked */
+    copied?: () => unknown;
+    /**
+     * Overrides the backdrop for the label
+     *
+     * This should match the background color of the parent
+     * container to ensure the label is legible
+     */
+    backdrop?(): unknown;
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/ScalarCopy/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarCopy/types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,OAAO,CAAA;AAElD,MAAM,MAAM,eAAe,GAAG;IAC5B,2CAA2C;IAC3C,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,6DAA6D;IAC7D,SAAS,CAAC,EAAE,mBAAmB,CAAA;IAC/B;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAA;CAClB,CAAA;AAED,MAAM,MAAM,eAAe,GAAG;IAC5B,mEAAmE;IACnE,IAAI,CAAC,EAAE,MAAM,OAAO,CAAA;IACpB,kEAAkE;IAClE,MAAM,CAAC,EAAE,MAAM,OAAO,CAAA;IACtB;;;;;OAKG;IACH,QAAQ,CAAC,IAAI,OAAO,CAAA;CACrB,CAAA"}

package/dist/components/ScalarMenu/ScalarMenuProducts.vue.d.ts

@@ -1,6 +1,7 @@
-type Product = 'dashboard' | 'docs' | 'client';
+type Product = 'dashboard' | 'docs' | 'editor' | 'client';
 type __VLS_Props = {
     selected?: Product;
+    showDocs?: boolean;
     hrefs?: Record<Product, string>;
 };
 declare const _default: import("vue").DefineComponent<__VLS_Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {

package/dist/components/ScalarMenu/ScalarMenuProducts.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ScalarMenuProducts.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarMenu/ScalarMenuProducts.vue"],"names":[],"mappings":"AA4DA,KAAK,OAAO,GAAG,WAAW,GAAG,MAAM,GAAG,QAAQ,CAAA;AAE9C,KAAK,WAAW,GAAG;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,CAAA;CAChC,CAAC;;;;;;AAoHF,wBAOG"}
+{"version":3,"file":"ScalarMenuProducts.vue.d.ts","sourceRoot":"","sources":["../../../src/components/ScalarMenu/ScalarMenuProducts.vue"],"names":[],"mappings":"AAuEA,KAAK,OAAO,GAAG,WAAW,GAAG,MAAM,GAAG,QAAQ,GAAG,QAAQ,CAAA;AAEzD,KAAK,WAAW,GAAG;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,CAAA;CAChC,CAAC;;;;;;AA+IF,wBAOG"}

package/dist/components/ScalarMenu/ScalarMenuProducts.vue.js

@@ -1,48 +1,61 @@
-import { defineComponent as a, createElementBlock as f, openBlock as m, normalizeProps as u, guardReactiveProps as h, unref as r, createVNode as n, withCtx as l, createTextVNode as d } from "vue";
-import { ScalarIconHouse as p, ScalarIconBook as C, ScalarIconArrowUpRight as k } from "@scalar/icons";
-import { useBindCx as b } from "@scalar/use-hooks/useBindCx";
-import i from "./ScalarMenuProduct.vue.js";
-const I = /* @__PURE__ */ a({
+import { defineComponent as f, createElementBlock as m, openBlock as c, normalizeProps as u, guardReactiveProps as h, unref as r, createVNode as i, createBlock as k, createCommentVNode as C, withCtx as d, createTextVNode as l } from "vue";
+import { ScalarIconHouse as p, ScalarIconBook as B, ScalarIconNotepad as b, ScalarIconArrowUpRight as S } from "@scalar/icons";
+import { useBindCx as $ } from "@scalar/use-hooks/useBindCx";
+import n from "./ScalarMenuProduct.vue.js";
+const N = /* @__PURE__ */ f({
   inheritAttrs: !1,
   __name: "ScalarMenuProducts",
   props: {
     selected: {},
+    showDocs: { type: Boolean },
     hrefs: {}
   },
   emits: ["open"],
   setup(o) {
-    const { cx: c } = b();
-    return (s, e) => (m(), f("div", u(h(r(c)("flex flex-col"))), [
-      n(i, {
+    const { cx: a } = $();
+    return (s, e) => (c(), m("div", u(h(r(a)("flex flex-col"))), [
+      i(n, {
         href: o.hrefs?.dashboard ?? "https://dashboard.scalar.com",
         icon: r(p),
         selected: o.selected === "dashboard",
         onClick: e[0] || (e[0] = (t) => s.$emit("open", t, "dashboard"))
       }, {
-        default: l(() => [...e[3] || (e[3] = [
-          d(" Dashboard ", -1)
+        default: d(() => [...e[4] || (e[4] = [
+          l(" Dashboard ", -1)
         ])]),
         _: 1
       }, 8, ["href", "icon", "selected"]),
-      n(i, {
+      o.showDocs || o.selected === "docs" ? (c(), k(n, {
+        key: 0,
         href: o.hrefs?.docs ?? "https://docs.scalar.com",
-        icon: r(C),
+        icon: r(B),
         selected: o.selected === "docs",
         onClick: e[1] || (e[1] = (t) => s.$emit("open", t, "docs"))
       }, {
-        default: l(() => [...e[4] || (e[4] = [
-          d(" Docs ", -1)
+        default: d(() => [...e[5] || (e[5] = [
+          l(" Docs ", -1)
+        ])]),
+        _: 1
+      }, 8, ["href", "icon", "selected"])) : C("", !0),
+      i(n, {
+        href: o.hrefs?.editor ?? "https://editor.scalar.com",
+        icon: r(b),
+        selected: o.selected === "editor",
+        onClick: e[2] || (e[2] = (t) => s.$emit("open", t, "editor"))
+      }, {
+        default: d(() => [...e[6] || (e[6] = [
+          l(" Editor ", -1)
         ])]),
         _: 1
       }, 8, ["href", "icon", "selected"]),
-      n(i, {
+      i(n, {
         href: o.hrefs?.client ?? "https://client.scalar.com",
-        icon: r(k),
+        icon: r(S),
         selected: o.selected === "client",
-        onClick: e[2] || (e[2] = (t) => s.$emit("open", t, "client"))
+        onClick: e[3] || (e[3] = (t) => s.$emit("open", t, "client"))
       }, {
-        default: l(() => [...e[5] || (e[5] = [
-          d(" Client ", -1)
+        default: d(() => [...e[7] || (e[7] = [
+          l(" Client ", -1)
         ])]),
         _: 1
       }, 8, ["href", "icon", "selected"])
@@ -50,5 +63,5 @@ const I = /* @__PURE__ */ a({
   }
 });
 export {
-  I as default
+  N as default
 };

package/dist/index.d.ts

@@ -8,6 +8,7 @@ export * from './components/ScalarCodeBlock';
 export * from './components/ScalarColorModeToggle';
 export * from './components/ScalarCombobox';
 export * from './components/ScalarContextMenu';
+export * from './components/ScalarCopy';
 export * from './components/ScalarDropdown';
 export * from './components/ScalarErrorBoundary';
 export * from './components/ScalarFileUpload';

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAA;AAEpB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAA;AAE7E,4EAA4E;AAC5E,cAAc,2BAA2B,CAAA;AACzC,cAAc,yBAAyB,CAAA;AACvC,cAAc,kCAAkC,CAAA;AAChD,cAAc,8BAA8B,CAAA;AAC5C,cAAc,oCAAoC,CAAA;AAClD,cAAc,6BAA6B,CAAA;AAC3C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kCAAkC,CAAA;AAChD,cAAc,+BAA+B,CAAA;AAC7C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,yBAAyB,CAAA;AACvC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,kCAAkC,CAAA;AAChD,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,8BAA8B,CAAA;AAC5C,cAAc,kCAAkC,CAAA;AAChD,cAAc,2BAA2B,CAAA;AACzC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,WAAW,CAAA;AACzB,0EAA0E"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,aAAa,CAAA;AAEpB,OAAO,EAAE,OAAO,EAAE,GAAG,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,MAAM,6BAA6B,CAAA;AAE7E,4EAA4E;AAC5E,cAAc,2BAA2B,CAAA;AACzC,cAAc,yBAAyB,CAAA;AACvC,cAAc,kCAAkC,CAAA;AAChD,cAAc,8BAA8B,CAAA;AAC5C,cAAc,oCAAoC,CAAA;AAClD,cAAc,6BAA6B,CAAA;AAC3C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,yBAAyB,CAAA;AACvC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,kCAAkC,CAAA;AAChD,cAAc,+BAA+B,CAAA;AAC7C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,yBAAyB,CAAA;AACvC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,kCAAkC,CAAA;AAChD,cAAc,4BAA4B,CAAA;AAC1C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,6BAA6B,CAAA;AAC3C,cAAc,8BAA8B,CAAA;AAC5C,cAAc,kCAAkC,CAAA;AAChD,cAAc,2BAA2B,CAAA;AACzC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,iCAAiC,CAAA;AAC/C,cAAc,WAAW,CAAA;AACzB,0EAA0E"}