spicykatsu 0.0.2 → 0.0.31

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.
package/README.md CHANGED
@@ -1 +1,6 @@
1
- # SpicyKatsuLib
1
+ # SpicyKatsuLib
2
+
3
+ Fun, simple library for Vue3. Something for me to play around with in my projects.
4
+ The idea is to make things simple and lightweight. While keeping functionality.
5
+
6
+ Included will be componenets and utilites. Maybe more in the future.
@@ -1,8 +1,58 @@
1
- import { openBlock as n, createElementBlock as o, normalizeClass as f, normalizeStyle as b, toDisplayString as c, createCommentVNode as r, createElementVNode as m, renderSlot as v, ref as g, withDirectives as k, vModelText as C, mergeProps as B, withKeys as x, withModifiers as $, createBlock as V, Transition as I, withCtx as w } from "vue";
2
- const T = ["disabled"], A = {
1
+ import { ref as h, openBlock as a, createBlock as M, Transition as k, withCtx as C, createElementBlock as l, normalizeClass as y, toDisplayString as d, createCommentVNode as u, normalizeStyle as Y, createElementVNode as p, renderSlot as b, withDirectives as I, vModelText as T, mergeProps as $, withKeys as V, withModifiers as x } from "vue";
2
+ const B = {
3
+ key: 0,
4
+ class: "spicyAlertIcon"
5
+ }, A = { key: 1 }, ae = {
6
+ __name: "SpicyAlert",
7
+ props: {
8
+ variant: {
9
+ type: String,
10
+ default: "info",
11
+ validator: (e) => ["info", "success", "warning", "error", "custom"].includes(e)
12
+ },
13
+ text: {
14
+ type: String,
15
+ default: ""
16
+ },
17
+ icon: String,
18
+ iconOnly: Boolean,
19
+ closable: {
20
+ type: Boolean,
21
+ default: !1
22
+ },
23
+ autoClose: {
24
+ type: Number,
25
+ default: 0
26
+ }
27
+ },
28
+ setup(e) {
29
+ const t = e, r = h(!0), n = () => {
30
+ r.value = !1;
31
+ };
32
+ return t.autoClose > 0 && setTimeout(() => {
33
+ r.value = !1;
34
+ }, t.autoClose), (o, i) => (a(), M(k, { name: "fade" }, {
35
+ default: C(() => [
36
+ r.value ? (a(), l("div", {
37
+ key: 0,
38
+ class: y(["spicyAlert", e.variant])
39
+ }, [
40
+ e.iconOnly || e.text ? (a(), l("span", B, d(e.icon), 1)) : u("", !0),
41
+ !e.iconOnly && e.text ? (a(), l("span", A, d(e.text), 1)) : u("", !0),
42
+ e.closable ? (a(), l("button", {
43
+ key: 2,
44
+ class: "closeButton",
45
+ onClick: n
46
+ }, "×")) : u("", !0)
47
+ ], 2)) : u("", !0)
48
+ ]),
49
+ _: 1
50
+ }));
51
+ }
52
+ }, P = ["disabled"], E = {
3
53
  key: 0,
4
54
  class: "spicyBtnIcon"
5
- }, D = {
55
+ }, le = {
6
56
  __name: "SpicyBtn",
7
57
  props: {
8
58
  variant: {
@@ -34,22 +84,22 @@ const T = ["disabled"], A = {
34
84
  }
35
85
  },
36
86
  emits: ["click"],
37
- setup(e, { emit: i }) {
38
- return (t, l) => (n(), o("button", {
39
- class: f(["spicyBtn", { outlined: e.variant === "outlined", disabled: e.disabled }]),
40
- style: b({ "--color": e.color, "--textColor": e.textColor, "--hoverColor": e.hoverColor }),
87
+ setup(e, { emit: t }) {
88
+ return (r, n) => (a(), l("button", {
89
+ class: y(["spicyBtn", { outlined: e.variant === "outlined", disabled: e.disabled }]),
90
+ style: Y({ "--color": e.color, "--textColor": e.textColor, "--hoverColor": e.hoverColor }),
41
91
  disabled: e.disabled,
42
- onClick: l[0] || (l[0] = (...a) => t.onClick && t.onClick(...a))
92
+ onClick: n[0] || (n[0] = (...o) => r.onClick && r.onClick(...o))
43
93
  }, [
44
- e.icon ? (n(), o("span", A, c(e.icon), 1)) : r("", !0),
45
- m("span", null, c(e.text), 1),
46
- v(t.$slots, "default")
47
- ], 14, T));
94
+ e.icon ? (a(), l("span", E, d(e.icon), 1)) : u("", !0),
95
+ p("span", null, d(e.text), 1),
96
+ b(r.$slots, "default")
97
+ ], 14, P));
48
98
  }
49
- }, N = ["placeholder"], z = {
99
+ }, F = ["placeholder"], U = {
50
100
  key: 0,
51
101
  class: "spicyInputError"
52
- }, W = {
102
+ }, ie = {
53
103
  __name: "SpicyLabel",
54
104
  props: {
55
105
  value: {
@@ -75,118 +125,235 @@ const T = ["disabled"], A = {
75
125
  }
76
126
  },
77
127
  setup(e) {
78
- const i = e, t = `spicyInput-${d()}`, l = g(i.value), a = g(!1);
79
- function d() {
80
- const s = "0123456789abcdefghijklmnopqrstuvwxyz";
81
- let u = "";
82
- for (let y = 0; y < 6; y++)
83
- u += s.charAt(Math.floor(Math.random() * s.length));
84
- return u;
128
+ const t = e, r = `spicyInput-${i()}`, n = h(t.value), o = h(!1);
129
+ function i() {
130
+ const c = "0123456789abcdefghijklmnopqrstuvwxyz";
131
+ let f = "";
132
+ for (let g = 0; g < 6; g++)
133
+ f += c.charAt(Math.floor(Math.random() * c.length));
134
+ return f;
85
135
  }
86
- const h = (s) => {
87
- l.value = s.target.value;
88
- }, p = () => {
89
- a.value = !1;
90
- }, S = () => {
91
- a.value = !0;
136
+ const v = (c) => {
137
+ n.value = c.target.value;
138
+ }, D = () => {
139
+ o.value = !1;
140
+ }, O = () => {
141
+ o.value = !0;
92
142
  };
93
- return (s, u) => (n(), o("div", {
94
- class: f(["spicyInputWrapper", [e.variant, { hasValue: l.value || e.value, hasFocus: a.value, hasError: e.error }]])
143
+ return (c, f) => (a(), l("div", {
144
+ class: y(["spicyInputWrapper", [e.variant, { hasValue: n.value || e.value, hasFocus: o.value, hasError: e.error }]])
95
145
  }, [
96
- m("label", {
146
+ p("label", {
97
147
  class: "spicyInputLabel",
98
- for: t
99
- }, c(e.label), 1),
100
- k(m("input", {
101
- id: t,
102
- class: f(["spicyInput", e.variant]),
103
- "onUpdate:modelValue": u[0] || (u[0] = (y) => l.value = y),
148
+ for: r
149
+ }, d(e.label), 1),
150
+ I(p("input", {
151
+ id: r,
152
+ class: y(["spicyInput", e.variant]),
153
+ "onUpdate:modelValue": f[0] || (f[0] = (g) => n.value = g),
104
154
  placeholder: e.placeholder,
105
- onInput: h,
106
- onBlur: p,
107
- onFocus: S
108
- }, null, 42, N), [
109
- [C, l.value]
155
+ onInput: v,
156
+ onBlur: D,
157
+ onFocus: O
158
+ }, null, 42, F), [
159
+ [T, n.value]
110
160
  ]),
111
- v(s.$slots, "default"),
112
- e.error ? (n(), o("span", z, c(e.error), 1)) : r("", !0)
161
+ b(c.$slots, "default"),
162
+ e.error ? (a(), l("span", U, d(e.error), 1)) : u("", !0)
113
163
  ], 2));
114
164
  }
115
- }, E = ["aria-checked", "onKeydown"], F = /* @__PURE__ */ m("div", { class: "spicyToggleKnob" }, null, -1), K = [
116
- F
117
- ], j = {
165
+ }, z = ["aria-checked", "onKeydown"], L = /* @__PURE__ */ p("div", { class: "spicyToggleKnob" }, null, -1), j = [
166
+ L
167
+ ], se = {
118
168
  __name: "SpicyToggle",
119
169
  props: {
120
170
  modelValue: Boolean
121
171
  },
122
172
  emits: ["update:modelValue"],
123
- setup(e, { emit: i }) {
124
- const t = e, l = i, a = () => {
125
- l("update:modelValue", !t.modelValue);
173
+ setup(e, { emit: t }) {
174
+ const r = e, n = t, o = () => {
175
+ n("update:modelValue", !r.modelValue);
126
176
  };
127
- return (d, h) => (n(), o("div", B({
177
+ return (i, v) => (a(), l("div", $({
128
178
  class: ["spicyToggle", { "is-active": e.modelValue }],
129
- onClick: a,
179
+ onClick: o,
130
180
  role: "switch",
131
181
  "aria-checked": e.modelValue.toString(),
132
182
  tabindex: "0",
133
- onKeydown: x($(a, ["prevent"]), ["space"])
134
- }, d.$attrs), K, 16, E));
135
- }
136
- }, L = {
137
- key: 0,
138
- class: "spicyAlertIcon"
139
- }, M = { key: 1 }, q = {
140
- __name: "SpicyAlert",
141
- props: {
142
- variant: {
143
- type: String,
144
- default: "info",
145
- validator: (e) => ["info", "success", "warning", "error", "custom"].includes(e)
146
- },
147
- text: {
148
- type: String,
149
- default: ""
150
- },
151
- icon: String,
152
- iconOnly: Boolean,
153
- closable: {
154
- type: Boolean,
155
- default: !1
156
- },
157
- autoClose: {
158
- type: Number,
159
- default: 0
160
- }
161
- },
162
- setup(e) {
163
- const i = e, t = g(!0), l = () => {
164
- t.value = !1;
165
- };
166
- return i.autoClose > 0 && setTimeout(() => {
167
- t.value = !1;
168
- }, i.autoClose), (a, d) => (n(), V(I, { name: "fade" }, {
169
- default: w(() => [
170
- t.value ? (n(), o("div", {
171
- key: 0,
172
- class: f(["spicyAlert", e.variant])
173
- }, [
174
- e.iconOnly || e.text ? (n(), o("span", L, c(e.icon), 1)) : r("", !0),
175
- !e.iconOnly && e.text ? (n(), o("span", M, c(e.text), 1)) : r("", !0),
176
- e.closable ? (n(), o("button", {
177
- key: 2,
178
- class: "closeButton",
179
- onClick: l
180
- }, "×")) : r("", !0)
181
- ], 2)) : r("", !0)
182
- ]),
183
- _: 1
184
- }));
183
+ onKeydown: V(x(o, ["prevent"]), ["space"])
184
+ }, i.$attrs), j, 16, z));
185
185
  }
186
186
  };
187
+ function m(e) {
188
+ try {
189
+ return new URL(e), !0;
190
+ } catch (t) {
191
+ return console.error("Invalid URL:", t), !1;
192
+ }
193
+ }
194
+ function N(e) {
195
+ return m(e) ? new URL(e).hostname : null;
196
+ }
197
+ function K(e, t) {
198
+ if (!m(e))
199
+ return e;
200
+ const r = new URL(e);
201
+ return Object.keys(t).forEach((n) => r.searchParams.append(n, t[n])), r.toString();
202
+ }
203
+ function W(e, t, r = "https") {
204
+ if (!["http", "https", "ftp", "sftp", "ftps", "ssh"].includes(r.toLowerCase()))
205
+ throw new Error("Invalid protocol: " + r);
206
+ if (!/^(?!:\/\/)([a-z0-9-]+\.)*[a-z0-9-]+$/i.test(e))
207
+ throw new Error("Invalid hostname: " + e);
208
+ return t.startsWith("/") || (t = "/" + t), t.endsWith("/") && t.length > 1 && (t = t.slice(0, -1)), t === "/" && (t = ""), `${r.toLowerCase()}://${e}${t}`;
209
+ }
210
+ const ce = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
211
+ __proto__: null,
212
+ appendParamsToUrl: K,
213
+ generateUrl: W,
214
+ getHostname: N,
215
+ isUrlValid: m
216
+ }, Symbol.toStringTag, { value: "Module" }));
217
+ function S(e, t) {
218
+ const r = {
219
+ YYYY: () => e.getFullYear().toString(),
220
+ MM: () => (e.getMonth() + 1).toString().padStart(2, "0"),
221
+ DD: () => e.getDate().toString().padStart(2, "0")
222
+ };
223
+ return t.replace(/YYYY|MM|DD/g, (n) => r[n]());
224
+ }
225
+ function R(e) {
226
+ const [t, r, n] = e.split("-");
227
+ return new Date(Number(t), Number(r) - 1, Number(n));
228
+ }
229
+ function q(e, t) {
230
+ const r = Math.abs(t.getTime() - e.getTime());
231
+ return Math.ceil(r / (1e3 * 60 * 60 * 24));
232
+ }
233
+ function H(e, t) {
234
+ const r = new Date(e);
235
+ return r.setDate(e.getDate() + t), r;
236
+ }
237
+ function G(e, t) {
238
+ const r = new Date(e);
239
+ return r.setDate(e.getDate() - t), r;
240
+ }
241
+ function J(e) {
242
+ const t = /* @__PURE__ */ new Date();
243
+ return e.getDate() === t.getDate() && e.getMonth() === t.getMonth() && e.getFullYear() === t.getFullYear();
244
+ }
245
+ function Q(e) {
246
+ const t = /* @__PURE__ */ new Date();
247
+ return t.setDate(t.getDate() - 1), e.getDate() === t.getDate() && e.getMonth() === t.getMonth() && e.getFullYear() === t.getFullYear();
248
+ }
249
+ function X(e) {
250
+ const t = /* @__PURE__ */ new Date();
251
+ return t.setDate(t.getDate() + 1), e.getDate() === t.getDate() && e.getMonth() === t.getMonth() && e.getFullYear() === t.getFullYear();
252
+ }
253
+ function Z(e = "YYYY-MM-DD", t = { show: !0, separator: "-" }) {
254
+ if (typeof e != "string" || typeof t != "object" || !t.hasOwnProperty("show") || typeof t.show != "boolean")
255
+ throw new Error(
256
+ 'Invalid parameters: Please provide a valid format string and options object with a boolean "show" property.'
257
+ );
258
+ let n = S(/* @__PURE__ */ new Date(), e);
259
+ return t.separator && t.separator !== "-" && (n = n.replace(/-/g, t.separator)), t.show ? { value: n, isVisible: !0 } : { value: n, isVisible: !1 };
260
+ }
261
+ const ue = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
262
+ __proto__: null,
263
+ currentDate: Z,
264
+ dateAdd: H,
265
+ dateDiff: q,
266
+ dateIsToday: J,
267
+ dateIsTomorrow: X,
268
+ dateIsYesterday: Q,
269
+ dateSubtract: G,
270
+ formatDate: S,
271
+ parseDate: R
272
+ }, Symbol.toStringTag, { value: "Module" }));
273
+ function _(e) {
274
+ const t = /* @__PURE__ */ new WeakMap();
275
+ function r(n) {
276
+ if (s(n) || typeof n != "object")
277
+ return n;
278
+ if (t.has(n))
279
+ return t.get(n);
280
+ const o = Array.isArray(n) ? [] : {};
281
+ t.set(n, o);
282
+ for (const i in n)
283
+ Object.prototype.hasOwnProperty.call(n, i) && (o[i] = r(n[i]));
284
+ return o;
285
+ }
286
+ return r(e);
287
+ }
288
+ function w(...e) {
289
+ const t = {};
290
+ return e.forEach((r) => {
291
+ if (!s(r)) {
292
+ for (const n in r)
293
+ if (Object.prototype.hasOwnProperty.call(r, n)) {
294
+ const o = r[n];
295
+ o !== void 0 && (typeof o == "object" && o !== null && !Array.isArray(o) ? t[n] = w(
296
+ t[n] || {},
297
+ o
298
+ ) : t[n] = o);
299
+ }
300
+ }
301
+ }), t;
302
+ }
303
+ function ee(...e) {
304
+ return s(e[0]) ? e[0] : Object.assign({}, ...e);
305
+ }
306
+ function te(e) {
307
+ return s(e) ? [] : Object.keys(e);
308
+ }
309
+ function ne(e) {
310
+ return s(e) ? [] : Object.values(e);
311
+ }
312
+ function re(e) {
313
+ return s(e) ? [] : Object.entries(e);
314
+ }
315
+ function s(e) {
316
+ return e === null || typeof e != "object" ? !1 : Array.isArray(e) ? e.length === 0 : Object.keys(e).length === 0;
317
+ }
318
+ const de = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
319
+ __proto__: null,
320
+ deepClone: _,
321
+ deepMerge: w,
322
+ getObjectEntries: re,
323
+ getObjectKeys: te,
324
+ getObjectValues: ne,
325
+ isObjectEmpty: s,
326
+ mergeObjects: ee
327
+ }, Symbol.toStringTag, { value: "Module" })), fe = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
328
+ __proto__: null
329
+ }, Symbol.toStringTag, { value: "Module" }));
187
330
  export {
188
- q as SpicyAlert,
189
- D as SpicyBtn,
190
- W as SpicyLabel,
191
- j as SpicyToggle
331
+ ae as SpicyAlert,
332
+ le as SpicyBtn,
333
+ ie as SpicyLabel,
334
+ se as SpicyToggle,
335
+ K as appendParamsToUrl,
336
+ fe as css,
337
+ Z as currentDate,
338
+ H as dateAdd,
339
+ q as dateDiff,
340
+ J as dateIsToday,
341
+ X as dateIsTomorrow,
342
+ Q as dateIsYesterday,
343
+ G as dateSubtract,
344
+ ue as dateUtils,
345
+ _ as deepClone,
346
+ w as deepMerge,
347
+ S as formatDate,
348
+ W as generateUrl,
349
+ N as getHostname,
350
+ re as getObjectEntries,
351
+ te as getObjectKeys,
352
+ ne as getObjectValues,
353
+ s as isObjectEmpty,
354
+ m as isUrlValid,
355
+ ee as mergeObjects,
356
+ de as objUtils,
357
+ R as parseDate,
358
+ ce as urlUtils
192
359
  };
@@ -1 +1 @@
1
- (function(o,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(o=typeof globalThis<"u"?globalThis:o||self,e(o.SpicyKatsu={},o.Vue))})(this,function(o,e){"use strict";const m=["disabled"],y={key:0,class:"spicyBtnIcon"},f={__name:"SpicyBtn",props:{variant:{type:String,default:"filled",validator:t=>["outlined","filled"].includes(t)},disabled:{type:Boolean,default:!1},text:{type:String,default:"Button"},icon:String,color:String,textColor:String,hoverColor:String,borderColor:String,fontSize:{type:[Number,String],default:14},fontWeight:{type:[Number,String],default:500}},emits:["click"],setup(t,{emit:i}){return(l,n)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["spicyBtn",{outlined:t.variant==="outlined",disabled:t.disabled}]),style:e.normalizeStyle({"--color":t.color,"--textColor":t.textColor,"--hoverColor":t.hoverColor}),disabled:t.disabled,onClick:n[0]||(n[0]=(...a)=>l.onClick&&l.onClick(...a))},[t.icon?(e.openBlock(),e.createElementBlock("span",y,e.toDisplayString(t.icon),1)):e.createCommentVNode("",!0),e.createElementVNode("span",null,e.toDisplayString(t.text),1),e.renderSlot(l.$slots,"default")],14,m))}},p=["placeholder"],g={key:0,class:"spicyInputError"},h={__name:"SpicyLabel",props:{value:{type:String,default:""},placeholder:{type:String,default:""},label:{type:String,default:"Label"},error:{type:String,default:""},variant:{type:String,default:"filled",validator:t=>["outlined","filled"].includes(t)}},setup(t){const i=t,l=`spicyInput-${s()}`,n=e.ref(i.value),a=e.ref(!1);function s(){const c="0123456789abcdefghijklmnopqrstuvwxyz";let r="";for(let d=0;d<6;d++)r+=c.charAt(Math.floor(Math.random()*c.length));return r}const u=c=>{n.value=c.target.value},E=()=>{a.value=!1},$=()=>{a.value=!0};return(c,r)=>(e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(["spicyInputWrapper",[t.variant,{hasValue:n.value||t.value,hasFocus:a.value,hasError:t.error}]])},[e.createElementVNode("label",{class:"spicyInputLabel",for:l},e.toDisplayString(t.label),1),e.withDirectives(e.createElementVNode("input",{id:l,class:e.normalizeClass(["spicyInput",t.variant]),"onUpdate:modelValue":r[0]||(r[0]=d=>n.value=d),placeholder:t.placeholder,onInput:u,onBlur:E,onFocus:$},null,42,p),[[e.vModelText,n.value]]),e.renderSlot(c.$slots,"default"),t.error?(e.openBlock(),e.createElementBlock("span",g,e.toDisplayString(t.error),1)):e.createCommentVNode("",!0)],2))}},S=["aria-checked","onKeydown"],k=[e.createElementVNode("div",{class:"spicyToggleKnob"},null,-1)],B={__name:"SpicyToggle",props:{modelValue:Boolean},emits:["update:modelValue"],setup(t,{emit:i}){const l=t,n=i,a=()=>{n("update:modelValue",!l.modelValue)};return(s,u)=>(e.openBlock(),e.createElementBlock("div",e.mergeProps({class:["spicyToggle",{"is-active":t.modelValue}],onClick:a,role:"switch","aria-checked":t.modelValue.toString(),tabindex:"0",onKeydown:e.withKeys(e.withModifiers(a,["prevent"]),["space"])},s.$attrs),k,16,S))}},b={key:0,class:"spicyAlertIcon"},C={key:1},V={__name:"SpicyAlert",props:{variant:{type:String,default:"info",validator:t=>["info","success","warning","error","custom"].includes(t)},text:{type:String,default:""},icon:String,iconOnly:Boolean,closable:{type:Boolean,default:!1},autoClose:{type:Number,default:0}},setup(t){const i=t,l=e.ref(!0),n=()=>{l.value=!1};return i.autoClose>0&&setTimeout(()=>{l.value=!1},i.autoClose),(a,s)=>(e.openBlock(),e.createBlock(e.Transition,{name:"fade"},{default:e.withCtx(()=>[l.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["spicyAlert",t.variant])},[t.iconOnly||t.text?(e.openBlock(),e.createElementBlock("span",b,e.toDisplayString(t.icon),1)):e.createCommentVNode("",!0),!t.iconOnly&&t.text?(e.openBlock(),e.createElementBlock("span",C,e.toDisplayString(t.text),1)):e.createCommentVNode("",!0),t.closable?(e.openBlock(),e.createElementBlock("button",{key:2,class:"closeButton",onClick:n},"×")):e.createCommentVNode("",!0)],2)):e.createCommentVNode("",!0)]),_:1}))}};o.SpicyAlert=V,o.SpicyBtn=f,o.SpicyLabel=h,o.SpicyToggle=B,Object.defineProperty(o,Symbol.toStringTag,{value:"Module"})});
1
+ (function(l,n){typeof exports=="object"&&typeof module<"u"?n(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],n):(l=typeof globalThis<"u"?globalThis:l||self,n(l.SpicyKatsu={},l.Vue))})(this,function(l,n){"use strict";const j={key:0,class:"spicyAlertIcon"},U={key:1},$={__name:"SpicyAlert",props:{variant:{type:String,default:"info",validator:e=>["info","success","warning","error","custom"].includes(e)},text:{type:String,default:""},icon:String,iconOnly:Boolean,closable:{type:Boolean,default:!1},autoClose:{type:Number,default:0}},setup(e){const t=e,a=n.ref(!0),r=()=>{a.value=!1};return t.autoClose>0&&setTimeout(()=>{a.value=!1},t.autoClose),(o,c)=>(n.openBlock(),n.createBlock(n.Transition,{name:"fade"},{default:n.withCtx(()=>[a.value?(n.openBlock(),n.createElementBlock("div",{key:0,class:n.normalizeClass(["spicyAlert",e.variant])},[e.iconOnly||e.text?(n.openBlock(),n.createElementBlock("span",j,n.toDisplayString(e.icon),1)):n.createCommentVNode("",!0),!e.iconOnly&&e.text?(n.openBlock(),n.createElementBlock("span",U,n.toDisplayString(e.text),1)):n.createCommentVNode("",!0),e.closable?(n.openBlock(),n.createElementBlock("button",{key:2,class:"closeButton",onClick:r},"×")):n.createCommentVNode("",!0)],2)):n.createCommentVNode("",!0)]),_:1}))}},N=["disabled"],P={key:0,class:"spicyBtnIcon"},A={__name:"SpicyBtn",props:{variant:{type:String,default:"filled",validator:e=>["outlined","filled"].includes(e)},disabled:{type:Boolean,default:!1},text:{type:String,default:"Button"},icon:String,color:String,textColor:String,hoverColor:String,borderColor:String,fontSize:{type:[Number,String],default:14},fontWeight:{type:[Number,String],default:500}},emits:["click"],setup(e,{emit:t}){return(a,r)=>(n.openBlock(),n.createElementBlock("button",{class:n.normalizeClass(["spicyBtn",{outlined:e.variant==="outlined",disabled:e.disabled}]),style:n.normalizeStyle({"--color":e.color,"--textColor":e.textColor,"--hoverColor":e.hoverColor}),disabled:e.disabled,onClick:r[0]||(r[0]=(...o)=>a.onClick&&a.onClick(...o))},[e.icon?(n.openBlock(),n.createElementBlock("span",P,n.toDisplayString(e.icon),1)):n.createCommentVNode("",!0),n.createElementVNode("span",null,n.toDisplayString(e.text),1),n.renderSlot(a.$slots,"default")],14,N))}},z=["placeholder"],F={key:0,class:"spicyInputError"},L={__name:"SpicyLabel",props:{value:{type:String,default:""},placeholder:{type:String,default:""},label:{type:String,default:"Label"},error:{type:String,default:""},variant:{type:String,default:"filled",validator:e=>["outlined","filled"].includes(e)}},setup(e){const t=e,a=`spicyInput-${c()}`,r=n.ref(t.value),o=n.ref(!1);function c(){const s="0123456789abcdefghijklmnopqrstuvwxyz";let d="";for(let f=0;f<6;f++)d+=s.charAt(Math.floor(Math.random()*s.length));return d}const I=s=>{r.value=s.target.value},G=()=>{o.value=!1},J=()=>{o.value=!0};return(s,d)=>(n.openBlock(),n.createElementBlock("div",{class:n.normalizeClass(["spicyInputWrapper",[e.variant,{hasValue:r.value||e.value,hasFocus:o.value,hasError:e.error}]])},[n.createElementVNode("label",{class:"spicyInputLabel",for:a},n.toDisplayString(e.label),1),n.withDirectives(n.createElementVNode("input",{id:a,class:n.normalizeClass(["spicyInput",e.variant]),"onUpdate:modelValue":d[0]||(d[0]=f=>r.value=f),placeholder:e.placeholder,onInput:I,onBlur:G,onFocus:J},null,42,z),[[n.vModelText,r.value]]),n.renderSlot(s.$slots,"default"),e.error?(n.openBlock(),n.createElementBlock("span",F,n.toDisplayString(e.error),1)):n.createCommentVNode("",!0)],2))}},K=["aria-checked","onKeydown"],W=[n.createElementVNode("div",{class:"spicyToggleKnob"},null,-1)],v={__name:"SpicyToggle",props:{modelValue:Boolean},emits:["update:modelValue"],setup(e,{emit:t}){const a=e,r=t,o=()=>{r("update:modelValue",!a.modelValue)};return(c,I)=>(n.openBlock(),n.createElementBlock("div",n.mergeProps({class:["spicyToggle",{"is-active":e.modelValue}],onClick:o,role:"switch","aria-checked":e.modelValue.toString(),tabindex:"0",onKeydown:n.withKeys(n.withModifiers(o,["prevent"]),["space"])},c.$attrs),W,16,K))}};function u(e){try{return new URL(e),!0}catch(t){return console.error("Invalid URL:",t),!1}}function m(e){return u(e)?new URL(e).hostname:null}function h(e,t){if(!u(e))return e;const a=new URL(e);return Object.keys(t).forEach(r=>a.searchParams.append(r,t[r])),a.toString()}function p(e,t,a="https"){if(!["http","https","ftp","sftp","ftps","ssh"].includes(a.toLowerCase()))throw new Error("Invalid protocol: "+a);if(!/^(?!:\/\/)([a-z0-9-]+\.)*[a-z0-9-]+$/i.test(e))throw new Error("Invalid hostname: "+e);return t.startsWith("/")||(t="/"+t),t.endsWith("/")&&t.length>1&&(t=t.slice(0,-1)),t==="/"&&(t=""),`${a.toLowerCase()}://${e}${t}`}const R=Object.freeze(Object.defineProperty({__proto__:null,appendParamsToUrl:h,generateUrl:p,getHostname:m,isUrlValid:u},Symbol.toStringTag,{value:"Module"}));function g(e,t){const a={YYYY:()=>e.getFullYear().toString(),MM:()=>(e.getMonth()+1).toString().padStart(2,"0"),DD:()=>e.getDate().toString().padStart(2,"0")};return t.replace(/YYYY|MM|DD/g,r=>a[r]())}function S(e){const[t,a,r]=e.split("-");return new Date(Number(t),Number(a)-1,Number(r))}function b(e,t){const a=Math.abs(t.getTime()-e.getTime());return Math.ceil(a/(1e3*60*60*24))}function D(e,t){const a=new Date(e);return a.setDate(e.getDate()+t),a}function w(e,t){const a=new Date(e);return a.setDate(e.getDate()-t),a}function k(e){const t=new Date;return e.getDate()===t.getDate()&&e.getMonth()===t.getMonth()&&e.getFullYear()===t.getFullYear()}function O(e){const t=new Date;return t.setDate(t.getDate()-1),e.getDate()===t.getDate()&&e.getMonth()===t.getMonth()&&e.getFullYear()===t.getFullYear()}function B(e){const t=new Date;return t.setDate(t.getDate()+1),e.getDate()===t.getDate()&&e.getMonth()===t.getMonth()&&e.getFullYear()===t.getFullYear()}function C(e="YYYY-MM-DD",t={show:!0,separator:"-"}){if(typeof e!="string"||typeof t!="object"||!t.hasOwnProperty("show")||typeof t.show!="boolean")throw new Error('Invalid parameters: Please provide a valid format string and options object with a boolean "show" property.');let r=g(new Date,e);return t.separator&&t.separator!=="-"&&(r=r.replace(/-/g,t.separator)),t.show?{value:r,isVisible:!0}:{value:r,isVisible:!1}}const q=Object.freeze(Object.defineProperty({__proto__:null,currentDate:C,dateAdd:D,dateDiff:b,dateIsToday:k,dateIsTomorrow:B,dateIsYesterday:O,dateSubtract:w,formatDate:g,parseDate:S},Symbol.toStringTag,{value:"Module"}));function M(e){const t=new WeakMap;function a(r){if(i(r)||typeof r!="object")return r;if(t.has(r))return t.get(r);const o=Array.isArray(r)?[]:{};t.set(r,o);for(const c in r)Object.prototype.hasOwnProperty.call(r,c)&&(o[c]=a(r[c]));return o}return a(e)}function y(...e){const t={};return e.forEach(a=>{if(!i(a)){for(const r in a)if(Object.prototype.hasOwnProperty.call(a,r)){const o=a[r];o!==void 0&&(typeof o=="object"&&o!==null&&!Array.isArray(o)?t[r]=y(t[r]||{},o):t[r]=o)}}}),t}function V(...e){return i(e[0])?e[0]:Object.assign({},...e)}function E(e){return i(e)?[]:Object.keys(e)}function T(e){return i(e)?[]:Object.values(e)}function Y(e){return i(e)?[]:Object.entries(e)}function i(e){return e===null||typeof e!="object"?!1:Array.isArray(e)?e.length===0:Object.keys(e).length===0}const H=Object.freeze(Object.defineProperty({__proto__:null,deepClone:M,deepMerge:y,getObjectEntries:Y,getObjectKeys:E,getObjectValues:T,isObjectEmpty:i,mergeObjects:V},Symbol.toStringTag,{value:"Module"})),_=Object.freeze(Object.defineProperty({__proto__:null},Symbol.toStringTag,{value:"Module"}));l.SpicyAlert=$,l.SpicyBtn=A,l.SpicyLabel=L,l.SpicyToggle=v,l.appendParamsToUrl=h,l.css=_,l.currentDate=C,l.dateAdd=D,l.dateDiff=b,l.dateIsToday=k,l.dateIsTomorrow=B,l.dateIsYesterday=O,l.dateSubtract=w,l.dateUtils=q,l.deepClone=M,l.deepMerge=y,l.formatDate=g,l.generateUrl=p,l.getHostname=m,l.getObjectEntries=Y,l.getObjectKeys=E,l.getObjectValues=T,l.isObjectEmpty=i,l.isUrlValid=u,l.mergeObjects=V,l.objUtils=H,l.parseDate=S,l.urlUtils=R,Object.defineProperty(l,Symbol.toStringTag,{value:"Module"})});
package/dist/style.css CHANGED
@@ -1 +1 @@
1
- .spicyBtn{padding:8px 16px;background-color:var(--color, var(--primaryColor));border:none;border-radius:4px;color:var(--textColor);cursor:pointer;font-size:14px;font-weight:500;text-transform:uppercase;transition:background-color .25s}.spicyBtn.outlined{background-color:transparent;border:2px solid var(--borderColor);color:#424242}.spicyBtn.disabled{opacity:.5;cursor:not-allowed}.spicyBtn:hover:not(.disabled){background-color:#616161}.spicyBtn.outlined:hover:not(.disabled){background-color:#424242;color:var(--textColor)}.spicyBtnIcon{margin-right:6px}.spicyInputWrapper{display:flex;flex-direction:column;position:relative}.spicyInputLabel{position:absolute;top:12px;left:16px;color:var(--textColor);transition:top .25s,font-size .25s,color .25s;pointer-events:none;font-size:18px;background-color:transparent}.spicyInput{padding:20px 16px 8px;border:none;border-bottom:1px solid var(--borderColor);font-size:16px;width:100%;box-sizing:border-box;transition:border-color .25s;background-color:transparent;color:var(--textColor)}.spicyInputWrapper .spicyInput:focus{outline:none;border-color:var(--labelFocus)}.outlined .spicyInput{border:1px solid var(--borderColor);border-radius:4px}.filled .spicyInput{border:none;border-bottom:1px solid var(--borderColor)}.hasValue .spicyInputLabel,.hasFocus .spicyInputLabel{top:-16px;font-size:16px;color:var(--labelFocus);font-weight:700}.hasError .spicyInput{border-color:red}.spicyInputError{color:red;font-size:12px;margin-top:4px}.spicyToggle{width:50px;height:24px;background-color:var(--borderColor);border-radius:30px;cursor:pointer;padding:2px;transition:background-color .2s;display:inline-flex;align-items:center}.spicyToggle.is-active{background-color:var(--primaryColor)}.spicyToggleKnob{width:20px;height:20px;background-color:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 2px 4px #0003}.spicyToggle.is-active .spicyToggleKnob{transform:translate(26px)}.spicyToggle:focus{outline:none;box-shadow:0 0 0 2px #5e138180}.fade-enter-active,.fade-leave-active{transition:opacity .5s}.fade-enter,.fade-leave-to{opacity:0}.spicyAlert{display:flex;align-items:center;padding:12px;border-radius:4px;margin-bottom:12px}.info{background-color:#e0e0e0;color:#333}.success{background-color:#d4edda;color:#155724}.warning{background-color:#fff3cd;color:#856404}.error{background-color:#ffbdc2;color:#911f2a}.spicyAlertIcon{margin-right:8px}.closeButton{margin-left:auto;background:none;border:none;cursor:pointer}:root{--primaryColor: #5e1381;--primaryColorHover: #811faf;--errorColor: #ff0000;--borderColor: #ccc;--textColor: #ddd;--disabledOpacity: .5;--labelFocus: var(--primaryColor);--fontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif;--fontSize: 14px;--fontWeight: 500;--borderWidth: 2px;--borderRadius: 4px}.spicyText{color:var(--textColor);font-family:var(--fontFamily);font-size:var(--fontSize);font-weight:var(--fontWeight)}
1
+ .fade-enter-active,.fade-leave-active{transition:opacity .5s}.fade-enter,.fade-leave-to{opacity:0}.spicyAlert{display:flex;align-items:center;padding:12px;border-radius:4px;margin-bottom:12px}.info{background-color:#e0e0e0;color:#333}.success{background-color:#d4edda;color:#155724}.warning{background-color:#fff3cd;color:#856404}.error{background-color:#ffbdc2;color:#911f2a}.spicyAlertIcon{margin-right:8px}.closeButton{margin-left:auto;background:none;border:none;cursor:pointer}.spicyBtn{padding:8px 16px;background-color:var(--color, var(--primaryColor));border:none;border-radius:4px;color:var(--textColor);cursor:pointer;font-size:14px;font-weight:500;text-transform:uppercase;transition:background-color .25s}.spicyBtn.outlined{background-color:transparent;border:2px solid var(--borderColor);color:#424242}.spicyBtn.disabled{opacity:.5;cursor:not-allowed}.spicyBtn:hover:not(.disabled){background-color:var(--hoverColor, grey)}.spicyBtn.outlined:hover:not(.disabled){background-color:var(--hoverColor, grey);color:var(--textColor)}.spicyBtnIcon{margin-right:6px}.spicyInputWrapper{display:flex;flex-direction:column;position:relative}.spicyInputLabel{position:absolute;top:12px;left:16px;color:var(--textColor);transition:top .25s,font-size .25s,color .25s;pointer-events:none;font-size:18px;background-color:transparent}.spicyInput{padding:20px 16px 8px;border:none;border-bottom:1px solid var(--borderColor);font-size:16px;width:100%;box-sizing:border-box;transition:border-color .25s;background-color:transparent;color:var(--textColor)}.spicyInputWrapper .spicyInput:focus{outline:none;border-color:var(--labelFocus)}.outlined .spicyInput{border:1px solid var(--borderColor);border-radius:4px}.filled .spicyInput{border:none;border-bottom:1px solid var(--borderColor)}.hasValue .spicyInputLabel,.hasFocus .spicyInputLabel{top:-16px;font-size:16px;color:var(--labelFocus);font-weight:700}.hasError .spicyInput{border-color:red}.spicyInputError{color:red;font-size:12px;margin-top:4px}.spicyToggle{width:50px;height:24px;background-color:var(--borderColor);border-radius:30px;cursor:pointer;padding:2px;transition:background-color .2s;display:inline-flex;align-items:center}.spicyToggle.is-active{background-color:var(--primaryColor)}.spicyToggleKnob{width:20px;height:20px;background-color:#fff;border-radius:50%;transition:transform .2s;box-shadow:0 2px 4px #0003}.spicyToggle.is-active .spicyToggleKnob{transform:translate(26px)}.spicyToggle:focus{outline:none;box-shadow:0 0 0 2px #5e138180}:root{--primaryColor: #5e1381;--primaryColorHover: #811faf;--errorColor: #ff0000;--borderColor: #ccc;--textColor: #ddd;--disabledOpacity: .5;--labelFocus: var(--primaryColor);--fontFamily: "Helvetica Neue", Helvetica, Arial, sans-serif;--fontSize: 14px;--fontWeight: 500;--borderWidth: 2px;--borderRadius: 4px}.spicyText{color:var(--textColor);font-family:var(--fontFamily);font-size:var(--fontSize);font-weight:var(--fontWeight)}.spicyHeader{color:var(--textColor);font-family:var(--fontFamily);font-size:24px;font-weight:700}
package/package.json CHANGED
@@ -1,17 +1,21 @@
1
1
  {
2
2
  "name": "spicykatsu",
3
- "description": "Comp Library for Vue",
3
+ "description": "Simple Library for Vue3.",
4
4
  "license": "MIT",
5
5
  "author": "Sato",
6
6
  "private": false,
7
- "version": "0.0.2",
8
- "files": ["dist/", "package.json", "README.md"],
7
+ "version": "0.0.31",
8
+ "files": [
9
+ "dist/",
10
+ "package.json",
11
+ "README.md"
12
+ ],
9
13
  "type": "module",
10
14
  "main": "dist/spicykatsu.es.js",
11
15
  "scripts": {
12
16
  "dev": "vite",
13
17
  "build": "vue-tsc && vite build",
14
- "preview": "vite preview",
18
+ "publish": "npm publish",
15
19
  "docs:dev": "vitepress dev docs",
16
20
  "test": "jest"
17
21
  },
@@ -20,9 +24,8 @@
20
24
  },
21
25
  "devDependencies": {
22
26
  "@vitejs/plugin-vue": "^5.0.4",
23
- "typescript": "^5.2.2",
24
- "vite": "^5.2.0",
25
- "vitepress": "^1.0.1",
26
- "vue-tsc": "^2.0.6"
27
+ "typescript": "^5.4.4",
28
+ "vite": "^5.2.8",
29
+ "vue-tsc": "^2.0.10"
27
30
  }
28
31
  }