sm-click-library-ui 0.0.14 → 0.0.16

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 (4) hide show
  1. package/dist/sm-click-library-ui.es.js +80 -85
  2. package/dist/sm-click-library-ui.umd.js +1 -1
  3. package/dist/styleSmClick.css +404 -12
  4. package/package.json +1 -1
package/dist/sm-click-library-ui.es.js CHANGED
@@ -1,114 +1,109 @@
1
- import { getCurrentScope as P, onScopeDispose as V, unref as j, watch as L, ref as S, computed as b, openBlock as v, createElementBlock as g, createElementVNode as f, toDisplayString as A, normalizeClass as C, renderSlot as F, createCommentVNode as w, pushScopeId as W, popScopeId as B } from "vue";
2
- function H(e) {
3
- return P() ? (V(e), !0) : !1;
1
+ import { getCurrentScope as P, onScopeDispose as V, unref as j, watch as I, ref as S, computed as b, openBlock as v, createElementBlock as g, createElementVNode as f, toDisplayString as x, normalizeClass as C, renderSlot as L, createCommentVNode as _ } from "vue";
2
+ function F(t) {
3
+ return P() ? (V(t), !0) : !1;
4
4
  }
5
- function O(e) {
6
- return typeof e == "function" ? e() : j(e);
5
+ function E(t) {
6
+ return typeof t == "function" ? t() : j(t);
7
7
  }
8
- const I = typeof window < "u" && typeof document < "u";
8
+ const O = typeof window < "u" && typeof document < "u";
9
9
  typeof WorkerGlobalScope < "u" && globalThis instanceof WorkerGlobalScope;
10
- const M = Object.prototype.toString, D = (e) => M.call(e) === "[object Object]", y = () => {
11
- }, N = /* @__PURE__ */ T();
12
- function T() {
13
- var e, l;
14
- return I && ((e = window == null ? void 0 : window.navigator) == null ? void 0 : e.userAgent) && (/iP(?:ad|hone|od)/.test(window.navigator.userAgent) || ((l = window == null ? void 0 : window.navigator) == null ? void 0 : l.maxTouchPoints) > 2 && /iPad|Macintosh/.test(window == null ? void 0 : window.navigator.userAgent));
10
+ const W = Object.prototype.toString, B = (t) => W.call(t) === "[object Object]", y = () => {
11
+ }, H = /* @__PURE__ */ M();
12
+ function M() {
13
+ var t, i;
14
+ return O && ((t = window == null ? void 0 : window.navigator) == null ? void 0 : t.userAgent) && (/iP(?:ad|hone|od)/.test(window.navigator.userAgent) || ((i = window == null ? void 0 : window.navigator) == null ? void 0 : i.maxTouchPoints) > 2 && /iPad|Macintosh/.test(window == null ? void 0 : window.navigator.userAgent));
15
15
  }
16
- function _(e) {
17
- var l;
18
- const s = O(e);
19
- return (l = s == null ? void 0 : s.$el) != null ? l : s;
16
+ function w(t) {
17
+ var i;
18
+ const s = E(t);
19
+ return (i = s == null ? void 0 : s.$el) != null ? i : s;
20
20
  }
21
- const z = I ? window : void 0;
22
- function k(...e) {
23
- let l, s, n, r;
24
- if (typeof e[0] == "string" || Array.isArray(e[0]) ? ([s, n, r] = e, l = z) : [l, s, n, r] = e, !l)
21
+ const z = O ? window : void 0;
22
+ function k(...t) {
23
+ let i, s, n, r;
24
+ if (typeof t[0] == "string" || Array.isArray(t[0]) ? ([s, n, r] = t, i = z) : [i, s, n, r] = t, !i)
25
25
  return y;
26
26
  Array.isArray(s) || (s = [s]), Array.isArray(n) || (n = [n]);
27
27
  const a = [], p = () => {
28
28
  a.forEach((c) => c()), a.length = 0;
29
- }, d = (c, u, o, t) => (c.addEventListener(u, o, t), () => c.removeEventListener(u, o, t)), m = L(
30
- () => [_(l), O(r)],
29
+ }, d = (c, u, o, e) => (c.addEventListener(u, o, e), () => c.removeEventListener(u, o, e)), m = I(
30
+ () => [w(i), E(r)],
31
31
  ([c, u]) => {
32
32
  if (p(), !c)
33
33
  return;
34
- const o = D(u) ? { ...u } : u;
34
+ const o = B(u) ? { ...u } : u;
35
35
  a.push(
36
- ...s.flatMap((t) => n.map((i) => d(c, t, i, o)))
36
+ ...s.flatMap((e) => n.map((l) => d(c, e, l, o)))
37
37
  );
38
38
  },
39
39
  { immediate: !0, flush: "post" }
40
40
  ), h = () => {
41
41
  m(), p();
42
42
  };
43
- return H(h), h;
43
+ return F(h), h;
44
44
  }
45
- let E = !1;
46
- function G(e, l, s = {}) {
45
+ let A = !1;
46
+ function D(t, i, s = {}) {
47
47
  const { window: n = z, ignore: r = [], capture: a = !0, detectIframe: p = !1 } = s;
48
48
  if (!n)
49
49
  return y;
50
- N && !E && (E = !0, Array.from(n.document.body.children).forEach((o) => o.addEventListener("click", y)), n.document.documentElement.addEventListener("click", y));
50
+ H && !A && (A = !0, Array.from(n.document.body.children).forEach((o) => o.addEventListener("click", y)), n.document.documentElement.addEventListener("click", y));
51
51
  let d = !0;
52
- const m = (o) => r.some((t) => {
53
- if (typeof t == "string")
54
- return Array.from(n.document.querySelectorAll(t)).some((i) => i === o.target || o.composedPath().includes(i));
52
+ const m = (o) => r.some((e) => {
53
+ if (typeof e == "string")
54
+ return Array.from(n.document.querySelectorAll(e)).some((l) => l === o.target || o.composedPath().includes(l));
55
55
  {
56
- const i = _(t);
57
- return i && (o.target === i || o.composedPath().includes(i));
56
+ const l = w(e);
57
+ return l && (o.target === l || o.composedPath().includes(l));
58
58
  }
59
59
  }), c = [
60
60
  k(n, "click", (o) => {
61
- const t = _(e);
62
- if (!(!t || t === o.target || o.composedPath().includes(t))) {
61
+ const e = w(t);
62
+ if (!(!e || e === o.target || o.composedPath().includes(e))) {
63
63
  if (o.detail === 0 && (d = !m(o)), !d) {
64
64
  d = !0;
65
65
  return;
66
66
  }
67
- l(o);
67
+ i(o);
68
68
  }
69
69
  }, { passive: !0, capture: a }),
70
70
  k(n, "pointerdown", (o) => {
71
- const t = _(e);
72
- d = !m(o) && !!(t && !o.composedPath().includes(t));
71
+ const e = w(t);
72
+ d = !m(o) && !!(e && !o.composedPath().includes(e));
73
73
  }, { passive: !0 }),
74
74
  p && k(n, "blur", (o) => {
75
75
  setTimeout(() => {
76
- var t;
77
- const i = _(e);
78
- ((t = n.document.activeElement) == null ? void 0 : t.tagName) === "IFRAME" && !(i != null && i.contains(n.document.activeElement)) && l(o);
76
+ var e;
77
+ const l = w(t);
78
+ ((e = n.document.activeElement) == null ? void 0 : e.tagName) === "IFRAME" && !(l != null && l.contains(n.document.activeElement)) && i(o);
79
79
  }, 0);
80
80
  })
81
81
  ].filter(Boolean);
82
82
  return () => c.forEach((o) => o());
83
83
  }
84
- const $ = (e, l) => {
85
- const s = e.__vccOpts || e;
86
- for (const [n, r] of l)
87
- s[n] = r;
88
- return s;
89
- }, x = (e) => (W("data-v-66a625cd"), e = e(), B(), e), q = {
84
+ const N = {
90
85
  key: 0,
91
86
  class: "line-clamp-2 uppercase text-xs truncate text-white"
92
- }, R = {
87
+ }, T = {
93
88
  key: 1,
94
89
  class: "line-clamp-2 uppercase text-xs truncate text-white"
95
- }, Z = /* @__PURE__ */ x(() => /* @__PURE__ */ f("path", {
90
+ }, G = /* @__PURE__ */ f("path", {
96
91
  "fill-rule": "evenodd",
97
92
  d: "M18.4 10.3A2 2 0 0 0 17 7H7a2 2 0 0 0-1.5 3.3l4.9 5.9a2 2 0 0 0 3 0l5-6Z",
98
93
  "clip-rule": "evenodd"
99
- }, null, -1)), J = [
100
- Z
101
- ], K = {
94
+ }, null, -1), $ = [
95
+ G
96
+ ], q = {
102
97
  key: 0,
103
98
  class: "select_widget_lib"
104
- }, Q = { key: 0 }, U = {
99
+ }, R = { key: 0 }, Z = {
105
100
  key: 1,
106
101
  class: "space-y-2"
107
- }, X = /* @__PURE__ */ x(() => /* @__PURE__ */ f("p", { class: "line-clamp-2 uppercase text-xs truncate" }, "Vertical", -1)), Y = [
108
- X
109
- ], ee = /* @__PURE__ */ x(() => /* @__PURE__ */ f("p", { class: "line-clamp-2 uppercase text-xs truncate" }, "Horizontal", -1)), te = [
110
- ee
111
- ], oe = {
102
+ }, J = /* @__PURE__ */ f("p", { class: "line-clamp-2 uppercase text-xs truncate" }, "Vertical", -1), K = [
103
+ J
104
+ ], Q = /* @__PURE__ */ f("p", { class: "line-clamp-2 uppercase text-xs truncate" }, "Horizontal", -1), U = [
105
+ Q
106
+ ], X = {
112
107
  __name: "primary_select",
113
108
  props: {
114
109
  titleFreeSlot: {
@@ -124,19 +119,19 @@ const $ = (e, l) => {
124
119
  }
125
120
  },
126
121
  emits: ["closeSelect"],
127
- setup(e, { emit: l }) {
128
- const s = e, n = l, r = S(!1), a = S("Horizontal"), p = S(null), d = b(() => s.selectConfig.length > 0), m = b(
129
- () => s.selectConfig.some((t) => t.chartsConfig)
122
+ setup(t, { emit: i }) {
123
+ const s = t, n = i, r = S(!1), a = S("Horizontal"), p = S(null), d = b(() => s.selectConfig.length > 0), m = b(
124
+ () => s.selectConfig.some((e) => e.chartsConfig)
130
125
  ), h = b(
131
- () => s.selectConfig.some((t) => t.freeSlot)
126
+ () => s.selectConfig.some((e) => e.freeSlot)
132
127
  ), c = () => {
133
128
  r.value = !r.value;
134
- }, u = (t) => {
135
- r.value = !1, a.value = t === "horizontal" ? "Vertical" : "Horizontal", n("closeSelect", t);
129
+ }, u = (e) => {
130
+ r.value = !1, a.value = e === "horizontal" ? "Vertical" : "Horizontal", n("closeSelect", e);
136
131
  };
137
- return G(p, () => {
132
+ return D(p, () => {
138
133
  r.value && (r.value = !1);
139
- }), (t, i) => d.value ? (v(), g("div", {
134
+ }), (e, l) => d.value ? (v(), g("div", {
140
135
  key: 0,
141
136
  ref_key: "target",
142
137
  ref: p,
@@ -147,7 +142,7 @@ const $ = (e, l) => {
147
142
  class: "bg-base-200 z-10 truncate flex items-center justify-between gap-6 p-2 rounded-md lg:mt-0 w-full shadow-md shadow-base-300"
148
143
  }, [
149
144
  f("div", null, [
150
- m.value ? (v(), g("p", q, A(a.value), 1)) : (v(), g("p", R, A(e.titleFreeSlot), 1))
145
+ m.value ? (v(), g("p", N, x(a.value), 1)) : (v(), g("p", T, x(t.titleFreeSlot), 1))
151
146
  ]),
152
147
  f("div", null, [
153
148
  (v(), g("svg", {
@@ -155,32 +150,32 @@ const $ = (e, l) => {
155
150
  xmlns: "http://www.w3.org/2000/svg",
156
151
  fill: "currentColor",
157
152
  viewBox: "0 0 24 24"
158
- }, J, 2))
153
+ }, $, 2))
159
154
  ])
160
155
  ]),
161
- r.value ? (v(), g("section", K, [
162
- h.value ? (v(), g("div", Q, [
163
- F(t.$slots, "free-slot", {}, void 0, !0)
164
- ])) : w("", !0),
165
- m.value ? (v(), g("div", U, [
156
+ r.value ? (v(), g("section", q, [
157
+ h.value ? (v(), g("div", R, [
158
+ L(e.$slots, "free-slot")
159
+ ])) : _("", !0),
160
+ m.value ? (v(), g("div", Z, [
166
161
  f("button", {
167
162
  class: C([a.value === "Vertical" ? "bg-green-500" : "", "btn_select_widget_lib"]),
168
- onClick: i[0] || (i[0] = () => u("horizontal"))
169
- }, Y, 2),
163
+ onClick: l[0] || (l[0] = () => u("horizontal"))
164
+ }, K, 2),
170
165
  f("button", {
171
166
  class: C([a.value !== "Vertical" ? "bg-green-500" : "", "btn_select_widget_lib"]),
172
- onClick: i[1] || (i[1] = () => u("vertical"))
173
- }, te, 2)
174
- ])) : w("", !0)
175
- ])) : w("", !0)
176
- ], 512)) : w("", !0);
167
+ onClick: l[1] || (l[1] = () => u("vertical"))
168
+ }, U, 2)
169
+ ])) : _("", !0)
170
+ ])) : _("", !0)
171
+ ], 512)) : _("", !0);
177
172
  }
178
- }, ne = /* @__PURE__ */ $(oe, [["__scopeId", "data-v-66a625cd"]]);
179
- function se(e) {
180
- e.component("primarySelect", ne);
173
+ };
174
+ function Y(t) {
175
+ t.component("primarySelect", X);
181
176
  }
182
- const ie = { install: se };
177
+ const te = { install: Y };
183
178
  export {
184
- ie as default,
185
- ne as primarySelect
179
+ te as default,
180
+ X as primarySelect
186
181
  };
package/dist/sm-click-library-ui.umd.js CHANGED
@@ -1 +1 @@
1
- (function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f["sm-click-library-ui"]={},f.Vue))})(this,function(f,e){"use strict";function V(t){return e.getCurrentScope()?(e.onScopeDispose(t),!0):!1}function k(t){return typeof t=="function"?t():e.unref(t)}const b=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const B=Object.prototype.toString,A=t=>B.call(t)==="[object Object]",w=()=>{},O=N();function N(){var t,c;return b&&((t=window==null?void 0:window.navigator)==null?void 0:t.userAgent)&&(/iP(?:ad|hone|od)/.test(window.navigator.userAgent)||((c=window==null?void 0:window.navigator)==null?void 0:c.maxTouchPoints)>2&&/iPad|Macintosh/.test(window==null?void 0:window.navigator.userAgent))}function h(t){var c;const s=k(t);return(c=s==null?void 0:s.$el)!=null?c:s}const E=b?window:void 0;function y(...t){let c,s,l,r;if(typeof t[0]=="string"||Array.isArray(t[0])?([s,l,r]=t,c=E):[c,s,l,r]=t,!c)return w;Array.isArray(s)||(s=[s]),Array.isArray(l)||(l=[l]);const d=[],m=()=>{d.forEach(a=>a()),d.length=0},p=(a,u,n,o)=>(a.addEventListener(u,n,o),()=>a.removeEventListener(u,n,o)),_=e.watch(()=>[h(c),k(r)],([a,u])=>{if(m(),!a)return;const n=A(u)?{...u}:u;d.push(...s.flatMap(o=>l.map(i=>p(a,o,i,n))))},{immediate:!0,flush:"post"}),g=()=>{_(),m()};return V(g),g}let C=!1;function v(t,c,s={}){const{window:l=E,ignore:r=[],capture:d=!0,detectIframe:m=!1}=s;if(!l)return w;O&&!C&&(C=!0,Array.from(l.document.body.children).forEach(n=>n.addEventListener("click",w)),l.document.documentElement.addEventListener("click",w));let p=!0;const _=n=>r.some(o=>{if(typeof o=="string")return Array.from(l.document.querySelectorAll(o)).some(i=>i===n.target||n.composedPath().includes(i));{const i=h(o);return i&&(n.target===i||n.composedPath().includes(i))}}),a=[y(l,"click",n=>{const o=h(t);if(!(!o||o===n.target||n.composedPath().includes(o))){if(n.detail===0&&(p=!_(n)),!p){p=!0;return}c(n)}},{passive:!0,capture:d}),y(l,"pointerdown",n=>{const o=h(t);p=!_(n)&&!!(o&&!n.composedPath().includes(o))},{passive:!0}),m&&y(l,"blur",n=>{setTimeout(()=>{var o;const i=h(t);((o=l.document.activeElement)==null?void 0:o.tagName)==="IFRAME"&&!(i!=null&&i.contains(l.document.activeElement))&&c(n)},0)})].filter(Boolean);return()=>a.forEach(n=>n())}const I=(t,c)=>{const s=t.__vccOpts||t;for(const[l,r]of c)s[l]=r;return s},S=t=>(e.pushScopeId("data-v-66a625cd"),t=t(),e.popScopeId(),t),z={key:0,class:"line-clamp-2 uppercase text-xs truncate text-white"},j={key:1,class:"line-clamp-2 uppercase text-xs truncate text-white"},P=[S(()=>e.createElementVNode("path",{"fill-rule":"evenodd",d:"M18.4 10.3A2 2 0 0 0 17 7H7a2 2 0 0 0-1.5 3.3l4.9 5.9a2 2 0 0 0 3 0l5-6Z","clip-rule":"evenodd"},null,-1))],L={key:0,class:"select_widget_lib"},M={key:0},T={key:1,class:"space-y-2"},F=[S(()=>e.createElementVNode("p",{class:"line-clamp-2 uppercase text-xs truncate"},"Vertical",-1))],W=[S(()=>e.createElementVNode("p",{class:"line-clamp-2 uppercase text-xs truncate"},"Horizontal",-1))],x=I({__name:"primary_select",props:{titleFreeSlot:{type:String,default:"Free Slot"},selectConfig:{type:Object,default:()=>({chartsConfig:!1,freeSlot:!1})}},emits:["closeSelect"],setup(t,{emit:c}){const s=t,l=c,r=e.ref(!1),d=e.ref("Horizontal"),m=e.ref(null),p=e.computed(()=>s.selectConfig.length>0),_=e.computed(()=>s.selectConfig.some(o=>o.chartsConfig)),g=e.computed(()=>s.selectConfig.some(o=>o.freeSlot)),a=()=>{r.value=!r.value},u=o=>{r.value=!1,d.value=o==="horizontal"?"Vertical":"Horizontal",l("closeSelect",o)};return v(m,()=>{r.value&&(r.value=!1)}),(o,i)=>p.value?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"target",ref:m,class:"relative w-full"},[e.createElementVNode("button",{onClick:a,class:"bg-base-200 z-10 truncate flex items-center justify-between gap-6 p-2 rounded-md lg:mt-0 w-full shadow-md shadow-base-300"},[e.createElementVNode("div",null,[_.value?(e.openBlock(),e.createElementBlock("p",z,e.toDisplayString(d.value),1)):(e.openBlock(),e.createElementBlock("p",j,e.toDisplayString(t.titleFreeSlot),1))]),e.createElementVNode("div",null,[(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass([r.value?"rotate-180 transition-transform ease-in-out":"","w-3 h-3 text-white"]),xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",viewBox:"0 0 24 24"},P,2))])]),r.value?(e.openBlock(),e.createElementBlock("section",L,[g.value?(e.openBlock(),e.createElementBlock("div",M,[e.renderSlot(o.$slots,"free-slot",{},void 0,!0)])):e.createCommentVNode("",!0),_.value?(e.openBlock(),e.createElementBlock("div",T,[e.createElementVNode("button",{class:e.normalizeClass([d.value==="Vertical"?"bg-green-500":"","btn_select_widget_lib"]),onClick:i[0]||(i[0]=()=>u("horizontal"))},F,2),e.createElementVNode("button",{class:e.normalizeClass([d.value!=="Vertical"?"bg-green-500":"","btn_select_widget_lib"]),onClick:i[1]||(i[1]=()=>u("vertical"))},W,2)])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],512)):e.createCommentVNode("",!0)}},[["__scopeId","data-v-66a625cd"]]);function D(t){t.component("primarySelect",x)}const H={install:D};f.default=H,f.primarySelect=x,Object.defineProperties(f,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
1
+ (function(f,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(f=typeof globalThis<"u"?globalThis:f||self,e(f["sm-click-library-ui"]={},f.Vue))})(this,function(f,e){"use strict";function V(o){return e.getCurrentScope()?(e.onScopeDispose(o),!0):!1}function k(o){return typeof o=="function"?o():e.unref(o)}const S=typeof window<"u"&&typeof document<"u";typeof WorkerGlobalScope<"u"&&globalThis instanceof WorkerGlobalScope;const x=Object.prototype.toString,B=o=>x.call(o)==="[object Object]",w=()=>{},A=N();function N(){var o,r;return S&&((o=window==null?void 0:window.navigator)==null?void 0:o.userAgent)&&(/iP(?:ad|hone|od)/.test(window.navigator.userAgent)||((r=window==null?void 0:window.navigator)==null?void 0:r.maxTouchPoints)>2&&/iPad|Macintosh/.test(window==null?void 0:window.navigator.userAgent))}function g(o){var r;const s=k(o);return(r=s==null?void 0:s.$el)!=null?r:s}const b=S?window:void 0;function y(...o){let r,s,l,c;if(typeof o[0]=="string"||Array.isArray(o[0])?([s,l,c]=o,r=b):[r,s,l,c]=o,!r)return w;Array.isArray(s)||(s=[s]),Array.isArray(l)||(l=[l]);const d=[],m=()=>{d.forEach(a=>a()),d.length=0},p=(a,u,n,t)=>(a.addEventListener(u,n,t),()=>a.removeEventListener(u,n,t)),h=e.watch(()=>[g(r),k(c)],([a,u])=>{if(m(),!a)return;const n=B(u)?{...u}:u;d.push(...s.flatMap(t=>l.map(i=>p(a,t,i,n))))},{immediate:!0,flush:"post"}),_=()=>{h(),m()};return V(_),_}let E=!1;function O(o,r,s={}){const{window:l=b,ignore:c=[],capture:d=!0,detectIframe:m=!1}=s;if(!l)return w;A&&!E&&(E=!0,Array.from(l.document.body.children).forEach(n=>n.addEventListener("click",w)),l.document.documentElement.addEventListener("click",w));let p=!0;const h=n=>c.some(t=>{if(typeof t=="string")return Array.from(l.document.querySelectorAll(t)).some(i=>i===n.target||n.composedPath().includes(i));{const i=g(t);return i&&(n.target===i||n.composedPath().includes(i))}}),a=[y(l,"click",n=>{const t=g(o);if(!(!t||t===n.target||n.composedPath().includes(t))){if(n.detail===0&&(p=!h(n)),!p){p=!0;return}r(n)}},{passive:!0,capture:d}),y(l,"pointerdown",n=>{const t=g(o);p=!h(n)&&!!(t&&!n.composedPath().includes(t))},{passive:!0}),m&&y(l,"blur",n=>{setTimeout(()=>{var t;const i=g(o);((t=l.document.activeElement)==null?void 0:t.tagName)==="IFRAME"&&!(i!=null&&i.contains(l.document.activeElement))&&r(n)},0)})].filter(Boolean);return()=>a.forEach(n=>n())}const v={key:0,class:"line-clamp-2 uppercase text-xs truncate text-white"},z={key:1,class:"line-clamp-2 uppercase text-xs truncate text-white"},j=[e.createElementVNode("path",{"fill-rule":"evenodd",d:"M18.4 10.3A2 2 0 0 0 17 7H7a2 2 0 0 0-1.5 3.3l4.9 5.9a2 2 0 0 0 3 0l5-6Z","clip-rule":"evenodd"},null,-1)],P={key:0,class:"select_widget_lib"},I={key:0},L={key:1,class:"space-y-2"},M=[e.createElementVNode("p",{class:"line-clamp-2 uppercase text-xs truncate"},"Vertical",-1)],T=[e.createElementVNode("p",{class:"line-clamp-2 uppercase text-xs truncate"},"Horizontal",-1)],C={__name:"primary_select",props:{titleFreeSlot:{type:String,default:"Free Slot"},selectConfig:{type:Object,default:()=>({chartsConfig:!1,freeSlot:!1})}},emits:["closeSelect"],setup(o,{emit:r}){const s=o,l=r,c=e.ref(!1),d=e.ref("Horizontal"),m=e.ref(null),p=e.computed(()=>s.selectConfig.length>0),h=e.computed(()=>s.selectConfig.some(t=>t.chartsConfig)),_=e.computed(()=>s.selectConfig.some(t=>t.freeSlot)),a=()=>{c.value=!c.value},u=t=>{c.value=!1,d.value=t==="horizontal"?"Vertical":"Horizontal",l("closeSelect",t)};return O(m,()=>{c.value&&(c.value=!1)}),(t,i)=>p.value?(e.openBlock(),e.createElementBlock("div",{key:0,ref_key:"target",ref:m,class:"relative w-full"},[e.createElementVNode("button",{onClick:a,class:"bg-base-200 z-10 truncate flex items-center justify-between gap-6 p-2 rounded-md lg:mt-0 w-full shadow-md shadow-base-300"},[e.createElementVNode("div",null,[h.value?(e.openBlock(),e.createElementBlock("p",v,e.toDisplayString(d.value),1)):(e.openBlock(),e.createElementBlock("p",z,e.toDisplayString(o.titleFreeSlot),1))]),e.createElementVNode("div",null,[(e.openBlock(),e.createElementBlock("svg",{class:e.normalizeClass([c.value?"rotate-180 transition-transform ease-in-out":"","w-3 h-3 text-white"]),xmlns:"http://www.w3.org/2000/svg",fill:"currentColor",viewBox:"0 0 24 24"},j,2))])]),c.value?(e.openBlock(),e.createElementBlock("section",P,[_.value?(e.openBlock(),e.createElementBlock("div",I,[e.renderSlot(t.$slots,"free-slot")])):e.createCommentVNode("",!0),h.value?(e.openBlock(),e.createElementBlock("div",L,[e.createElementVNode("button",{class:e.normalizeClass([d.value==="Vertical"?"bg-green-500":"","btn_select_widget_lib"]),onClick:i[0]||(i[0]=()=>u("horizontal"))},M,2),e.createElementVNode("button",{class:e.normalizeClass([d.value!=="Vertical"?"bg-green-500":"","btn_select_widget_lib"]),onClick:i[1]||(i[1]=()=>u("vertical"))},T,2)])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],512)):e.createCommentVNode("",!0)}};function F(o){o.component("primarySelect",C)}const W={install:F};f.default=W,f.primarySelect=C,Object.defineProperties(f,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
package/dist/styleSmClick.css CHANGED
@@ -394,6 +394,113 @@ video {
394
394
  display: none;
395
395
  }
396
396
 
397
+ :root,
398
+ [data-theme] {
399
+ background-color: var(--fallback-b1,oklch(var(--b1)/1));
400
+ color: var(--fallback-bc,oklch(var(--bc)/1));
401
+ }
402
+
403
+ @supports not (color: oklch(0% 0 0)) {
404
+
405
+ :root {
406
+ color-scheme: light;
407
+ --fallback-p: #491eff;
408
+ --fallback-pc: #d4dbff;
409
+ --fallback-s: #ff41c7;
410
+ --fallback-sc: #fff9fc;
411
+ --fallback-a: #00cfbd;
412
+ --fallback-ac: #00100d;
413
+ --fallback-n: #2b3440;
414
+ --fallback-nc: #d7dde4;
415
+ --fallback-b1: #ffffff;
416
+ --fallback-b2: #e5e6e6;
417
+ --fallback-b3: #e5e6e6;
418
+ --fallback-bc: #1f2937;
419
+ --fallback-in: #00b3f0;
420
+ --fallback-inc: #000000;
421
+ --fallback-su: #00ca92;
422
+ --fallback-suc: #000000;
423
+ --fallback-wa: #ffc22d;
424
+ --fallback-wac: #000000;
425
+ --fallback-er: #ff6f70;
426
+ --fallback-erc: #000000;
427
+ }
428
+
429
+ @media (prefers-color-scheme: dark) {
430
+
431
+ :root {
432
+ color-scheme: dark;
433
+ --fallback-p: #7582ff;
434
+ --fallback-pc: #050617;
435
+ --fallback-s: #ff71cf;
436
+ --fallback-sc: #190211;
437
+ --fallback-a: #00c7b5;
438
+ --fallback-ac: #000e0c;
439
+ --fallback-n: #2a323c;
440
+ --fallback-nc: #a6adbb;
441
+ --fallback-b1: #1d232a;
442
+ --fallback-b2: #191e24;
443
+ --fallback-b3: #15191e;
444
+ --fallback-bc: #a6adbb;
445
+ --fallback-in: #00b3f0;
446
+ --fallback-inc: #000000;
447
+ --fallback-su: #00ca92;
448
+ --fallback-suc: #000000;
449
+ --fallback-wa: #ffc22d;
450
+ --fallback-wac: #000000;
451
+ --fallback-er: #ff6f70;
452
+ --fallback-erc: #000000;
453
+ }
454
+ }
455
+ }
456
+
457
+ html {
458
+ -webkit-tap-highlight-color: transparent;
459
+ }
460
+
461
+ * {
462
+ scrollbar-color: color-mix(in oklch, currentColor 35%, transparent) transparent;
463
+ }
464
+
465
+ *:hover {
466
+ scrollbar-color: color-mix(in oklch, currentColor 60%, transparent) transparent;
467
+ }
468
+
469
+ :root {
470
+ color: #fff;
471
+ --bc: 89.74% 0.007939 239.46702;
472
+ --pc: 14.4549% 0.038401 149.57933;
473
+ --sc: 91.2253% 0.042841 265.315522;
474
+ --ac: 14.4721% 0.035244 350.048739;
475
+ --nc: 88.9107% 0.007489 257.280836;
476
+ --inc: 13.6911% 0.029612 237.25135;
477
+ --suc: 15.6904% 0.026506 181.911977;
478
+ --wac: 16.6486% 0.027912 82.95003;
479
+ --erc: 14.3572% 0.034051 13.11834;
480
+ --rounded-box: 1rem;
481
+ --rounded-btn: 0.5rem;
482
+ --rounded-badge: 1.9rem;
483
+ --animation-btn: 0.25s;
484
+ --animation-input: .2s;
485
+ --btn-focus-scale: 0.95;
486
+ --border-btn: 1px;
487
+ --tab-border: 1px;
488
+ --tab-radius: 0.5rem;
489
+ --p: 72.2746% 0.192007 149.57933;
490
+ primary_alt: #00799e;
491
+ --s: 56.1263% 0.214204 265.315522;
492
+ text_current: #fff;
493
+ --a: 72.3603% 0.176218 350.048739;
494
+ --n: 44.5533% 0.037447 257.280836;
495
+ --b1: 48.7002% 0.039694 239.46702;
496
+ --b2: 31.6361% 0.024663 236.769088;
497
+ --b3: 21.5339% 0.018707 235.125143;
498
+ --in: 68.4553% 0.148062 237.25135;
499
+ --su: 78.452% 0.132529 181.911977;
500
+ --wa: 83.2428% 0.139558 82.95003;
501
+ --er: 71.7858% 0.170255 13.11834;
502
+ }
503
+
397
504
  * {
398
505
  scrollbar-color: initial;
399
506
  scrollbar-width: initial;
@@ -506,6 +613,260 @@ video {
506
613
  --tw-contain-paint: ;
507
614
  --tw-contain-style: ;
508
615
  }
616
+ @media (hover:hover) {
617
+
618
+ .label a:hover {
619
+ --tw-text-opacity: 1;
620
+ color: var(--fallback-bc,oklch(var(--bc)/var(--tw-text-opacity)));
621
+ }
622
+ }
623
+ .footer {
624
+ display: grid;
625
+ width: 100%;
626
+ grid-auto-flow: row;
627
+ place-items: start;
628
+ -moz-column-gap: 1rem;
629
+ column-gap: 1rem;
630
+ row-gap: 2.5rem;
631
+ font-size: 0.875rem;
632
+ line-height: 1.25rem;
633
+ }
634
+ .footer > * {
635
+ display: grid;
636
+ place-items: start;
637
+ gap: 0.5rem;
638
+ }
639
+ @media (min-width: 48rem) {
640
+
641
+ .footer {
642
+ grid-auto-flow: column;
643
+ }
644
+
645
+ .footer-center {
646
+ grid-auto-flow: row dense;
647
+ }
648
+ }
649
+ .label {
650
+ display: flex;
651
+ -webkit-user-select: none;
652
+ -moz-user-select: none;
653
+ user-select: none;
654
+ align-items: center;
655
+ justify-content: space-between;
656
+ padding-left: 0.25rem;
657
+ padding-right: 0.25rem;
658
+ padding-top: 0.5rem;
659
+ padding-bottom: 0.5rem;
660
+ }
661
+ .link {
662
+ cursor: pointer;
663
+ text-decoration-line: underline;
664
+ }
665
+ .select {
666
+ display: inline-flex;
667
+ cursor: pointer;
668
+ -webkit-user-select: none;
669
+ -moz-user-select: none;
670
+ user-select: none;
671
+ -webkit-appearance: none;
672
+ -moz-appearance: none;
673
+ appearance: none;
674
+ height: 3rem;
675
+ min-height: 3rem;
676
+ padding-inline-start: 1rem;
677
+ padding-inline-end: 2.5rem;
678
+ font-size: 0.875rem;
679
+ line-height: 1.25rem;
680
+ line-height: 2;
681
+ border-radius: var(--rounded-btn, 0.5rem);
682
+ border-width: 1px;
683
+ border-color: transparent;
684
+ --tw-bg-opacity: 1;
685
+ background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));
686
+ background-image: linear-gradient(45deg, transparent 50%, currentColor 50%),
687
+ linear-gradient(135deg, currentColor 50%, transparent 50%);
688
+ background-position: calc(100% - 20px) calc(1px + 50%),
689
+ calc(100% - 16.1px) calc(1px + 50%);
690
+ background-size: 4px 4px,
691
+ 4px 4px;
692
+ background-repeat: no-repeat;
693
+ }
694
+ .select[multiple] {
695
+ height: auto;
696
+ }
697
+ .btm-nav > * .label {
698
+ font-size: 1rem;
699
+ line-height: 1.5rem;
700
+ }
701
+ @keyframes button-pop {
702
+
703
+ 0% {
704
+ transform: scale(var(--btn-focus-scale, 0.98));
705
+ }
706
+
707
+ 40% {
708
+ transform: scale(1.02);
709
+ }
710
+
711
+ 100% {
712
+ transform: scale(1);
713
+ }
714
+ }
715
+ @keyframes checkmark {
716
+
717
+ 0% {
718
+ background-position-y: 5px;
719
+ }
720
+
721
+ 50% {
722
+ background-position-y: -2px;
723
+ }
724
+
725
+ 100% {
726
+ background-position-y: 0;
727
+ }
728
+ }
729
+ .link:focus {
730
+ outline: 2px solid transparent;
731
+ outline-offset: 2px;
732
+ }
733
+ .link:focus-visible {
734
+ outline: 2px solid currentColor;
735
+ outline-offset: 2px;
736
+ }
737
+ @keyframes modal-pop {
738
+
739
+ 0% {
740
+ opacity: 0;
741
+ }
742
+ }
743
+ @keyframes progress-loading {
744
+
745
+ 50% {
746
+ background-position-x: -115%;
747
+ }
748
+ }
749
+ @keyframes radiomark {
750
+
751
+ 0% {
752
+ box-shadow: 0 0 0 12px var(--fallback-b1,oklch(var(--b1)/1)) inset,
753
+ 0 0 0 12px var(--fallback-b1,oklch(var(--b1)/1)) inset;
754
+ }
755
+
756
+ 50% {
757
+ box-shadow: 0 0 0 3px var(--fallback-b1,oklch(var(--b1)/1)) inset,
758
+ 0 0 0 3px var(--fallback-b1,oklch(var(--b1)/1)) inset;
759
+ }
760
+
761
+ 100% {
762
+ box-shadow: 0 0 0 4px var(--fallback-b1,oklch(var(--b1)/1)) inset,
763
+ 0 0 0 4px var(--fallback-b1,oklch(var(--b1)/1)) inset;
764
+ }
765
+ }
766
+ @keyframes rating-pop {
767
+
768
+ 0% {
769
+ transform: translateY(-0.125em);
770
+ }
771
+
772
+ 40% {
773
+ transform: translateY(-0.125em);
774
+ }
775
+
776
+ 100% {
777
+ transform: translateY(0);
778
+ }
779
+ }
780
+ .select:focus {
781
+ box-shadow: none;
782
+ border-color: var(--fallback-bc,oklch(var(--bc)/0.2));
783
+ outline-style: solid;
784
+ outline-width: 2px;
785
+ outline-offset: 2px;
786
+ outline-color: var(--fallback-bc,oklch(var(--bc)/0.2));
787
+ }
788
+ .select-disabled,
789
+ .select:disabled,
790
+ .select[disabled] {
791
+ cursor: not-allowed;
792
+ --tw-border-opacity: 1;
793
+ border-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-border-opacity)));
794
+ --tw-bg-opacity: 1;
795
+ background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));
796
+ color: var(--fallback-bc,oklch(var(--bc)/0.4));
797
+ }
798
+ .select-disabled::-moz-placeholder, .select:disabled::-moz-placeholder, .select[disabled]::-moz-placeholder {
799
+ color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));
800
+ --tw-placeholder-opacity: 0.2;
801
+ }
802
+ .select-disabled::placeholder,
803
+ .select:disabled::placeholder,
804
+ .select[disabled]::placeholder {
805
+ color: var(--fallback-bc,oklch(var(--bc)/var(--tw-placeholder-opacity)));
806
+ --tw-placeholder-opacity: 0.2;
807
+ }
808
+ .select-multiple,
809
+ .select[multiple],
810
+ .select[size].select:not([size="1"]) {
811
+ background-image: none;
812
+ padding-right: 1rem;
813
+ }
814
+ [dir="rtl"] .select {
815
+ background-position: calc(0% + 12px) calc(1px + 50%),
816
+ calc(0% + 16px) calc(1px + 50%);
817
+ }
818
+ @keyframes skeleton {
819
+
820
+ from {
821
+ background-position: 150%;
822
+ }
823
+
824
+ to {
825
+ background-position: -50%;
826
+ }
827
+ }
828
+ @keyframes toast-pop {
829
+
830
+ 0% {
831
+ transform: scale(0.9);
832
+ opacity: 0;
833
+ }
834
+
835
+ 100% {
836
+ transform: scale(1);
837
+ opacity: 1;
838
+ }
839
+ }
840
+ .artboard.phone-1.horizontal,
841
+ .artboard.phone-1.artboard-horizontal {
842
+ width: 568px;
843
+ height: 320px;
844
+ }
845
+ .artboard.phone-2.horizontal,
846
+ .artboard.phone-2.artboard-horizontal {
847
+ width: 667px;
848
+ height: 375px;
849
+ }
850
+ .artboard.phone-3.horizontal,
851
+ .artboard.phone-3.artboard-horizontal {
852
+ width: 736px;
853
+ height: 414px;
854
+ }
855
+ .artboard.phone-4.horizontal,
856
+ .artboard.phone-4.artboard-horizontal {
857
+ width: 812px;
858
+ height: 375px;
859
+ }
860
+ .artboard.phone-5.horizontal,
861
+ .artboard.phone-5.artboard-horizontal {
862
+ width: 896px;
863
+ height: 414px;
864
+ }
865
+ .artboard.phone-6.horizontal,
866
+ .artboard.phone-6.artboard-horizontal {
867
+ width: 1024px;
868
+ height: 320px;
869
+ }
509
870
  .fixed {
510
871
  position: fixed;
511
872
  }
@@ -527,18 +888,12 @@ video {
527
888
  .z-10 {
528
889
  z-index: 10;
529
890
  }
530
- .z-30 {
531
- z-index: 30;
532
- }
533
891
  .z-50 {
534
892
  z-index: 50;
535
893
  }
536
894
  .ml-auto {
537
895
  margin-left: auto;
538
896
  }
539
- .mt-2 {
540
- margin-top: 0.5rem;
541
- }
542
897
  .line-clamp-2 {
543
898
  overflow: hidden;
544
899
  display: -webkit-box;
@@ -635,13 +990,9 @@ video {
635
990
  border-top-left-radius: 1rem;
636
991
  border-top-right-radius: 1rem;
637
992
  }
638
- .bg-base-100 {
639
- --tw-bg-opacity: 1;
640
- background-color: rgb(75 99 116 / var(--tw-bg-opacity));
641
- }
642
993
  .bg-base-200 {
643
994
  --tw-bg-opacity: 1;
644
- background-color: rgb(38 52 61 / var(--tw-bg-opacity));
995
+ background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));
645
996
  }
646
997
  .bg-black {
647
998
  --tw-bg-opacity: 1;
@@ -659,6 +1010,10 @@ video {
659
1010
  --tw-bg-opacity: 1;
660
1011
  background-color: rgb(34 197 94 / var(--tw-bg-opacity));
661
1012
  }
1013
+ .bg-red-200 {
1014
+ --tw-bg-opacity: 1;
1015
+ background-color: rgb(254 202 202 / var(--tw-bg-opacity));
1016
+ }
662
1017
  .p-1 {
663
1018
  padding: 0.25rem;
664
1019
  }
@@ -716,7 +1071,7 @@ video {
716
1071
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
717
1072
  }
718
1073
  .shadow-base-300 {
719
- --tw-shadow-color: #111B21;
1074
+ --tw-shadow-color: var(--fallback-b3,oklch(var(--b3)/1));
720
1075
  --tw-shadow: var(--tw-shadow-colored);
721
1076
  }
722
1077
  .backdrop-blur-\[2px\] {
@@ -787,11 +1142,48 @@ video {
787
1142
  .scrollbar-thumb-gray-900 {
788
1143
  --scrollbar-thumb: #111827 !important;
789
1144
  }
1145
+
1146
+ /* primary_select CSS */
1147
+ .btn_select_widget_lib {
1148
+ width: 100%;
1149
+ border-radius: 0.375rem;
1150
+ --tw-bg-opacity: 1;
1151
+ background-color: var(--fallback-b1,oklch(var(--b1)/var(--tw-bg-opacity)));
1152
+ padding: 0.5rem;
1153
+ --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
1154
+ --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
1155
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
1156
+ --tw-shadow-color: var(--fallback-b3,oklch(var(--b3)/1));
1157
+ --tw-shadow: var(--tw-shadow-colored);
1158
+ }
1159
+ .btn_select_widget_lib:hover {
1160
+ background-color: var(--fallback-b2,oklch(var(--b2)/0.6));
1161
+ }
1162
+
1163
+ .select_widget_lib {
1164
+ position: absolute;
1165
+ z-index: 30;
1166
+ margin-top: 0.5rem;
1167
+ width: 100%;
1168
+ border-radius: 0.375rem;
1169
+ --tw-bg-opacity: 1;
1170
+ background-color: var(--fallback-b2,oklch(var(--b2)/var(--tw-bg-opacity)));
1171
+ padding: 0.375rem;
1172
+ --tw-text-opacity: 1;
1173
+ color: rgb(255 255 255 / var(--tw-text-opacity));
1174
+ --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
1175
+ --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
1176
+ box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
1177
+ --tw-shadow-color: var(--fallback-b3,oklch(var(--b3)/1));
1178
+ --tw-shadow: var(--tw-shadow-colored);
1179
+ }
1180
+
790
1181
  .hover\:scale-105:hover {
791
1182
  --tw-scale-x: 1.05;
792
1183
  --tw-scale-y: 1.05;
793
1184
  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
794
1185
  }
1186
+
795
1187
  @media (min-width: 1280px) {
796
1188
 
797
1189
  .lg\:mt-0 {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sm-click-library-ui",
3
- "version": "0.0.14",
3
+ "version": "0.0.16",
4
4
  "main": "dist/sm-click-library-ui.es.js",
5
5
  "module": "dist/sm-click-library-ui.umd.js",
6
6
  "private": false,