@gsc-basic/components 1.0.1 → 1.0.3

package/dist/es/src/Grid/src/components/ColumnFilter.vue.js

@@ -0,0 +1,72 @@
+import { ref as C, watch as F, openBlock as o, createElementBlock as a, withModifiers as m, withDirectives as v, createElementVNode as f, toDisplayString as i, unref as n, Fragment as V, renderList as h, vModelSelect as N, withKeys as S, vModelText as b, createVNode as y, withCtx as g, createTextVNode as _ } from "vue";
+import { useLocale as B } from "../../../hooks/useLocale.js";
+import { GscButton as x } from "../../../Button/index.js";
+import './ColumnFilter.css';/* empty css                  */
+import K from "../../../../_virtual/_plugin-vue_export-helper.js";
+const M = { value: "" }, D = ["value"], E = ["onKeydown"], L = { class: "mt-3 flex gap-2 justify-end" }, T = {
+  __name: "ColumnFilter",
+  props: { value: [String, Number], type: { type: String, default: "text" }, options: Array },
+  emits: ["update:value", "apply", "clear"],
+  setup(u, { emit: k }) {
+    const c = u, r = k, { t: s } = B(), e = C(c.value ?? "");
+    F(() => c.value, (d) => {
+      e.value = d ?? "";
+    });
+    function p() {
+      r("update:value", e.value), r("apply");
+    }
+    function w() {
+      e.value = "", r("update:value", ""), r("clear");
+    }
+    return (d, l) => (o(), a("div", {
+      class: "gsc-popover absolute top-full left-0 mt-2 min-w-44 p-3 z-20",
+      onClick: l[2] || (l[2] = m(() => {
+      }, ["stop"]))
+    }, [
+      u.type === "select" ? v((o(), a("select", {
+        key: 0,
+        "onUpdate:modelValue": l[0] || (l[0] = (t) => e.value = t),
+        class: "gsc-control"
+      }, [
+        f("option", M, i(n(s)("gsc.grid.columnFilter.all")), 1),
+        (o(!0), a(V, null, h(u.options || [], (t) => (o(), a("option", {
+          key: t.value,
+          value: t.value
+        }, i(t.label), 9, D))), 128))
+      ], 512)), [
+        [N, e.value]
+      ]) : v((o(), a("input", {
+        key: 1,
+        "onUpdate:modelValue": l[1] || (l[1] = (t) => e.value = t),
+        type: "text",
+        class: "gsc-control",
+        onKeydown: S(m(p, ["prevent"]), ["enter"])
+      }, null, 40, E)), [
+        [b, e.value]
+      ]),
+      f("div", L, [
+        y(n(x), {
+          variant: "default",
+          onClick: w
+        }, {
+          default: g(() => [
+            _(i(n(s)("gsc.grid.columnFilter.clear")), 1)
+          ]),
+          _: 1
+        }),
+        y(n(x), {
+          variant: "primary",
+          onClick: p
+        }, {
+          default: g(() => [
+            _(i(n(s)("gsc.grid.columnFilter.apply")), 1)
+          ]),
+          _: 1
+        })
+      ])
+    ]));
+  }
+}, I = /* @__PURE__ */ K(T, [["__scopeId", "data-v-aa324207"]]);
+export {
+  I as default
+};

package/dist/es/src/Grid/src/components/ColumnSettings.css

@@ -0,0 +1 @@
+[data-v-ac85ebd4],[data-v-ac85ebd4]:before,[data-v-ac85ebd4]:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }[data-v-ac85ebd4]::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.absolute[data-v-ac85ebd4]{position:absolute}.relative[data-v-ac85ebd4]{position:relative}.right-0[data-v-ac85ebd4]{right:0}.z-20[data-v-ac85ebd4]{z-index:20}.mt-1[data-v-ac85ebd4]{margin-top:.25rem}.mt-2[data-v-ac85ebd4]{margin-top:.5rem}.max-h-64[data-v-ac85ebd4]{max-height:16rem}.w-72[data-v-ac85ebd4]{width:18rem}.flex[data-v-ac85ebd4]{display:flex}.table[data-v-ac85ebd4]{display:table}.cursor-pointer[data-v-ac85ebd4]{cursor:pointer}.items-center[data-v-ac85ebd4]{align-items:center}.justify-between[data-v-ac85ebd4]{justify-content:space-between}.gap-2[data-v-ac85ebd4]{gap:.5rem}.overflow-auto[data-v-ac85ebd4]{overflow:auto}.truncate[data-v-ac85ebd4]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rounded-md[data-v-ac85ebd4]{border-radius:.375rem}.hover\:bg-\[rgba\(0\,0\,0\,0\.02\)\][data-v-ac85ebd4]:hover{--un-bg-opacity:.02;background-color:#00000005;background-color:rgba(0,0,0,var(--un-bg-opacity))}.p-2[data-v-ac85ebd4]{padding:.5rem}.px-2[data-v-ac85ebd4]{padding-left:.5rem;padding-right:.5rem}.py-1[data-v-ac85ebd4]{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5[data-v-ac85ebd4]{padding-top:.375rem;padding-bottom:.375rem}.pr-1[data-v-ac85ebd4]{padding-right:.25rem}.pt-2[data-v-ac85ebd4]{padding-top:.5rem}.text-sm[data-v-ac85ebd4]{font-size:.875rem;line-height:1.25rem}.text-\[rgba\(0\,0\,0\,0\.88\)\][data-v-ac85ebd4]{--un-text-opacity:.88;color:#000000e0;color:rgba(0,0,0,var(--un-text-opacity))}.font-medium[data-v-ac85ebd4]{font-weight:500}

package/dist/es/src/Grid/src/components/ColumnSettings.vue.js

@@ -0,0 +1,109 @@
+import { ref as y, computed as C, onMounted as S, onBeforeUnmount as V, openBlock as c, createElementBlock as a, createVNode as u, unref as t, withModifiers as v, withCtx as d, createTextVNode as m, toDisplayString as o, createElementVNode as s, Fragment as w, renderList as E, createCommentVNode as A } from "vue";
+import { useLocale as L } from "../../../hooks/useLocale.js";
+import { GscButton as g } from "../../../Button/index.js";
+import './ColumnSettings.css';/* empty css                    */
+import B from "../../../../_virtual/_plugin-vue_export-helper.js";
+const D = { class: "relative" }, N = { class: "flex items-center justify-between px-2 py-1" }, j = { class: "text-sm font-medium text-[rgba(0,0,0,0.88)]" }, I = { class: "max-h-64 overflow-auto pr-1 mt-1" }, M = ["checked", "onChange"], $ = ["title"], q = { class: "mt-2 flex items-center justify-between gap-2 gsc-divider-top pt-2" }, z = {
+  __name: "ColumnSettings",
+  props: {
+    table: { type: Object, required: !0 }
+  },
+  setup(h) {
+    const _ = h, i = y(!1), { t: l } = L(), p = C(() => {
+      try {
+        return _.table.getAllLeafColumns?.() || [];
+      } catch {
+        return [];
+      }
+    });
+    function b() {
+      p.value.forEach((r) => r.toggleVisibility(!0));
+    }
+    function k() {
+      p.value.forEach((r) => r.toggleVisibility(!1));
+    }
+    function f() {
+      i.value = !1;
+    }
+    return S(() => {
+      document.addEventListener("click", f);
+    }), V(() => {
+      document.removeEventListener("click", f);
+    }), (r, n) => (c(), a("div", D, [
+      u(t(g), {
+        type: "button",
+        variant: "default",
+        onClick: n[0] || (n[0] = v((e) => i.value = !i.value, ["stop"]))
+      }, {
+        default: d(() => [
+          m(o(t(l)("gsc.grid.columnSettings.trigger")), 1)
+        ]),
+        _: 1
+      }),
+      i.value ? (c(), a("div", {
+        key: 0,
+        class: "gsc-popover absolute right-0 mt-2 w-72 p-2 z-20",
+        onClick: n[2] || (n[2] = v(() => {
+        }, ["stop"]))
+      }, [
+        s("div", N, [
+          s("div", j, o(t(l)("gsc.grid.columnSettings.title")), 1),
+          u(t(g), {
+            type: "button",
+            variant: "text",
+            onClick: n[1] || (n[1] = (e) => i.value = !1)
+          }, {
+            default: d(() => [
+              m(o(t(l)("gsc.grid.columnSettings.close")), 1)
+            ]),
+            _: 1
+          })
+        ]),
+        s("div", I, [
+          (c(!0), a(w, null, E(p.value, (e) => (c(), a("label", {
+            key: e.id,
+            class: "flex items-center gap-2 px-2 py-1.5 rounded-md hover:bg-[rgba(0,0,0,0.02)] cursor-pointer"
+          }, [
+            s("input", {
+              type: "checkbox",
+              class: "gsc-checkbox",
+              checked: e.getIsVisible(),
+              onChange: (x) => e.toggleVisibility(!!x.target.checked)
+            }, null, 40, M),
+            s("span", {
+              class: "text-sm truncate",
+              title: String(e.columnDef?.header ?? e.id)
+            }, o(String(e.columnDef?.header ?? e.id)), 9, $)
+          ]))), 128))
+        ]),
+        s("div", q, [
+          u(t(g), {
+            type: "button",
+            variant: "default",
+            class: "px-2",
+            onClick: b
+          }, {
+            default: d(() => [
+              m(o(t(l)("gsc.grid.columnSettings.checkAll")), 1)
+            ]),
+            _: 1
+          }),
+          u(t(g), {
+            type: "button",
+            variant: "default",
+            class: "px-2",
+            onClick: k
+          }, {
+            default: d(() => [
+              m(o(t(l)("gsc.grid.columnSettings.uncheckAll")), 1)
+            ]),
+            _: 1
+          })
+        ])
+      ])) : A("", !0)
+    ]));
+  }
+}, H = /* @__PURE__ */ B(z, [["__scopeId", "data-v-ac85ebd4"]]);
+export {
+  H as default
+};

package/dist/es/src/Grid/src/components/DataTable.css

@@ -0,0 +1 @@
+[data-v-506c5c98],[data-v-506c5c98]:before,[data-v-506c5c98]:after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }[data-v-506c5c98]::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-pan-x: ;--un-pan-y: ;--un-pinch-zoom: ;--un-scroll-snap-strictness:proximity;--un-ordinal: ;--un-slashed-zero: ;--un-numeric-figure: ;--un-numeric-spacing: ;--un-numeric-fraction: ;--un-border-spacing-x:0;--un-border-spacing-y:0;--un-ring-offset-shadow:0 0 rgb(0 0 0 / 0);--un-ring-shadow:0 0 rgb(0 0 0 / 0);--un-shadow-inset: ;--un-shadow:0 0 rgb(0 0 0 / 0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgb(147 197 253 / .5);--un-blur: ;--un-brightness: ;--un-contrast: ;--un-drop-shadow: ;--un-grayscale: ;--un-hue-rotate: ;--un-invert: ;--un-saturate: ;--un-sepia: ;--un-backdrop-blur: ;--un-backdrop-brightness: ;--un-backdrop-contrast: ;--un-backdrop-grayscale: ;--un-backdrop-hue-rotate: ;--un-backdrop-invert: ;--un-backdrop-opacity: ;--un-backdrop-saturate: ;--un-backdrop-sepia: }.i-material-symbols\:filter-alt-outline[data-v-506c5c98]{--un-icon:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' vertical-align='-0.125em' display='inline-block' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M11 20q-.425 0-.712-.288T10 19v-6L4.2 5.6q-.375-.5-.112-1.05T5 4h14q.65 0 .913.55T19.8 5.6L14 13v6q0 .425-.288.713T13 20zm1-7.7L16.95 6h-9.9zm0 0'/%3E%3C/svg%3E");-webkit-mask:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' vertical-align='-0.125em' display='inline-block' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M11 20q-.425 0-.712-.288T10 19v-6L4.2 5.6q-.375-.5-.112-1.05T5 4h14q.65 0 .913.55T19.8 5.6L14 13v6q0 .425-.288.713T13 20zm1-7.7L16.95 6h-9.9zm0 0'/%3E%3C/svg%3E") no-repeat;mask:url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' vertical-align='-0.125em' display='inline-block' width='1em' height='1em' xmlns='http://www.w3.org/2000/svg' %3E%3Cpath fill='currentColor' d='M11 20q-.425 0-.712-.288T10 19v-6L4.2 5.6q-.375-.5-.112-1.05T5 4h14q.65 0 .913.55T19.8 5.6L14 13v6q0 .425-.288.713T13 20zm1-7.7L16.95 6h-9.9zm0 0'/%3E%3C/svg%3E") no-repeat;-webkit-mask:var(--un-icon) no-repeat;mask:var(--un-icon) no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;background-color:currentColor;color:inherit;vertical-align:-.125em;display:inline-block;width:1em;height:1em}.absolute[data-v-506c5c98]{position:absolute}.relative[data-v-506c5c98]{position:relative}.sticky[data-v-506c5c98]{position:sticky}.right-0[data-v-506c5c98]{right:0}.top-0[data-v-506c5c98]{top:0}.z-10[data-v-506c5c98]{z-index:10}.ml-auto[data-v-506c5c98]{margin-left:auto}.mt-0\.5[data-v-506c5c98]{margin-top:.125rem}.h-6[data-v-506c5c98]{height:1.5rem}.h-full[data-v-506c5c98]{height:100%}.min-w-0[data-v-506c5c98]{min-width:0}.w-2[data-v-506c5c98]{width:.5rem}.w-full[data-v-506c5c98]{width:100%}.flex[data-v-506c5c98]{display:flex}.flex-1[data-v-506c5c98]{flex:1 1 0%}.shrink-0[data-v-506c5c98]{flex-shrink:0}.table[data-v-506c5c98]{display:table}.cursor-pointer[data-v-506c5c98]{cursor:pointer}.cursor-grab[data-v-506c5c98]{cursor:grab}.cursor-col-resize[data-v-506c5c98]{cursor:col-resize}.select-none[data-v-506c5c98]{-webkit-user-select:none;-moz-user-select:none;user-select:none}.items-start[data-v-506c5c98]{align-items:flex-start}.items-center[data-v-506c5c98]{align-items:center}.gap-1[data-v-506c5c98]{gap:.25rem}.gap-2[data-v-506c5c98]{gap:.5rem}.overflow-auto[data-v-506c5c98]{overflow:auto}.truncate[data-v-506c5c98]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.break-words[data-v-506c5c98]{overflow-wrap:break-word}.px[data-v-506c5c98]{padding-left:1rem;padding-right:1rem}.px-2[data-v-506c5c98]{padding-left:.5rem;padding-right:.5rem}.px-3[data-v-506c5c98]{padding-left:.75rem;padding-right:.75rem}.py-10[data-v-506c5c98]{padding-top:2.5rem;padding-bottom:2.5rem}.text-center[data-v-506c5c98]{text-align:center}.align-top[data-v-506c5c98]{vertical-align:top}.text-sm[data-v-506c5c98]{font-size:.875rem;line-height:1.25rem}.text-xs[data-v-506c5c98]{font-size:.75rem;line-height:1rem}.text-\[rgba\(0\,0\,0\,0\.25\)\][data-v-506c5c98]{--un-text-opacity:.25;color:#00000040;color:rgba(0,0,0,var(--un-text-opacity))}.text-\[rgba\(0\,0\,0\,0\.45\)\][data-v-506c5c98],.hover\:text-\[rgba\(0\,0\,0\,0\.45\)\][data-v-506c5c98]:hover{--un-text-opacity:.45;color:#00000073;color:rgba(0,0,0,var(--un-text-opacity))}