@danilovd/is-ui 0.1.0 → 0.1.2
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/dist/UiButton/UiButton.css +1 -0
- package/dist/UiButton/UiButton.js +29 -0
- package/dist/UiField/UiField.css +1 -0
- package/dist/UiField/UiField.js +28 -0
- package/dist/UiInput/UiInput.css +1 -0
- package/dist/UiInput/UiInput.js +29 -0
- package/dist/UiSelect/UiSelect.css +1 -0
- package/dist/UiSelect/UiSelect.js +33 -0
- package/dist/_plugin-vue_export-helper-CHgC5LLL.js +9 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.js +7 -0
- package/package.json +2 -11
- package/dist/colors.scss +0 -15
- package/dist/index/index.css +0 -1
- package/dist/index/index.js +0 -2
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._button_34ai2_1{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;font-size:1rem;font-weight:600;border-radius:12px;cursor:pointer;border:2px solid transparent;transition:background-color .25s ease,border-color .25s ease,transform .12s ease,box-shadow .12s ease}._button_34ai2_1:active:not(:disabled){transform:scale(.96);box-shadow:0 0 0 2px var(--color-primary-light)}._button_34ai2_1[data-layout=primary]{background:var(--color-primary);color:var(--color-white)}._button_34ai2_1[data-layout=secondary]{background:var(--color-white);color:var(--color-primary);border-color:var(--color-primary)}._button_34ai2_1:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import "./UiButton.css";
|
|
2
|
+
import { defineComponent as s, createElementBlock as a, openBlock as n, normalizeClass as l, renderSlot as u } from "vue";
|
|
3
|
+
import { _ as r } from "../_plugin-vue_export-helper-CHgC5LLL.js";
|
|
4
|
+
const d = ["data-layout", "disabled", "type"], p = /* @__PURE__ */ s({
|
|
5
|
+
__name: "UiButton",
|
|
6
|
+
props: {
|
|
7
|
+
layout: { default: "primary" },
|
|
8
|
+
type: { default: "button" },
|
|
9
|
+
isDisabled: { type: Boolean }
|
|
10
|
+
},
|
|
11
|
+
setup(e) {
|
|
12
|
+
const t = e;
|
|
13
|
+
return (o, y) => (n(), a("button", {
|
|
14
|
+
class: l(o.$style.button),
|
|
15
|
+
"data-layout": t.layout,
|
|
16
|
+
disabled: t.isDisabled,
|
|
17
|
+
type: t.type
|
|
18
|
+
}, [
|
|
19
|
+
u(o.$slots, "default")
|
|
20
|
+
], 10, d));
|
|
21
|
+
}
|
|
22
|
+
}), c = "_button_34ai2_1", i = {
|
|
23
|
+
button: c
|
|
24
|
+
}, _ = {
|
|
25
|
+
$style: i
|
|
26
|
+
}, f = /* @__PURE__ */ r(p, [["__cssModules", _]]);
|
|
27
|
+
export {
|
|
28
|
+
f as default
|
|
29
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._field_1f64k_1{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}._label_1f64k_8{font-size:.875rem;font-weight:500;color:var(--color-primary-dark)}
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import "./UiField.css";
|
|
2
|
+
import { defineComponent as t, createElementBlock as a, openBlock as n, normalizeClass as l, createElementVNode as r, renderSlot as c, toDisplayString as i } from "vue";
|
|
3
|
+
import { _ } from "../_plugin-vue_export-helper-CHgC5LLL.js";
|
|
4
|
+
const d = /* @__PURE__ */ t({
|
|
5
|
+
__name: "UiField",
|
|
6
|
+
props: {
|
|
7
|
+
label: {}
|
|
8
|
+
},
|
|
9
|
+
setup(s) {
|
|
10
|
+
const o = s;
|
|
11
|
+
return (e, u) => (n(), a("label", {
|
|
12
|
+
class: l(e.$style.field)
|
|
13
|
+
}, [
|
|
14
|
+
r("span", {
|
|
15
|
+
class: l(e.$style.label)
|
|
16
|
+
}, i(o.label), 3),
|
|
17
|
+
c(e.$slots, "default")
|
|
18
|
+
], 2));
|
|
19
|
+
}
|
|
20
|
+
}), f = "_field_1f64k_1", p = "_label_1f64k_8", m = {
|
|
21
|
+
field: f,
|
|
22
|
+
label: p
|
|
23
|
+
}, b = {
|
|
24
|
+
$style: m
|
|
25
|
+
}, $ = /* @__PURE__ */ _(d, [["__cssModules", b]]);
|
|
26
|
+
export {
|
|
27
|
+
$ as default
|
|
28
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._input_iq7a6_1{width:100%;padding:10px 16px;font-size:1rem;border:2px solid var(--color-primary-light);border-radius:8px;background-color:var(--color-white);color:var(--color-black);transition:border-color .3s ease}._input_iq7a6_1:focus{outline:none;border-color:var(--color-primary)}._input_iq7a6_1:disabled{background-color:var(--color-gray-light);cursor:not-allowed}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
import "./UiInput.css";
|
|
2
|
+
import { defineComponent as a, createElementBlock as n, openBlock as p, normalizeClass as u } from "vue";
|
|
3
|
+
import { _ as i } from "../_plugin-vue_export-helper-CHgC5LLL.js";
|
|
4
|
+
const d = ["placeholder", "disabled", "value"], r = /* @__PURE__ */ a({
|
|
5
|
+
__name: "UiInput",
|
|
6
|
+
props: {
|
|
7
|
+
modelValue: {},
|
|
8
|
+
isDisabled: { type: Boolean },
|
|
9
|
+
placeholder: {}
|
|
10
|
+
},
|
|
11
|
+
emits: ["update:modelValue"],
|
|
12
|
+
setup(o) {
|
|
13
|
+
const e = o;
|
|
14
|
+
return (l, t) => (p(), n("input", {
|
|
15
|
+
class: u(l.$style.input),
|
|
16
|
+
placeholder: e.placeholder,
|
|
17
|
+
disabled: e.isDisabled,
|
|
18
|
+
value: e.modelValue,
|
|
19
|
+
onInput: t[0] || (t[0] = (s) => l.$emit("update:modelValue", s.target.value))
|
|
20
|
+
}, null, 42, d));
|
|
21
|
+
}
|
|
22
|
+
}), c = "_input_iq7a6_1", m = {
|
|
23
|
+
input: c
|
|
24
|
+
}, _ = {
|
|
25
|
+
$style: m
|
|
26
|
+
}, h = /* @__PURE__ */ i(r, [["__cssModules", _]]);
|
|
27
|
+
export {
|
|
28
|
+
h as default
|
|
29
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
._select_hsutp_1{width:100%;padding:10px 16px;font-size:1rem;border:2px solid var(--color-primary-light);border-radius:8px;background:var(--color-white);transition:.25s ease}._select_hsutp_1:focus{outline:none;border-color:var(--color-primary)}._select_hsutp_1:disabled{background:var(--color-gray-light);cursor:not-allowed}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import "./UiSelect.css";
|
|
2
|
+
import { defineComponent as r, createElementBlock as t, openBlock as l, normalizeClass as u, Fragment as i, renderList as c, toDisplayString as d } from "vue";
|
|
3
|
+
import { _ as p } from "../_plugin-vue_export-helper-CHgC5LLL.js";
|
|
4
|
+
const m = ["disabled", "value"], _ = ["value"], f = /* @__PURE__ */ r({
|
|
5
|
+
__name: "UiSelect",
|
|
6
|
+
props: {
|
|
7
|
+
modelValue: {},
|
|
8
|
+
isDisabled: { type: Boolean, default: !1 },
|
|
9
|
+
options: {}
|
|
10
|
+
},
|
|
11
|
+
emits: ["update:modelValue"],
|
|
12
|
+
setup(n) {
|
|
13
|
+
const s = n;
|
|
14
|
+
return (o, a) => (l(), t("select", {
|
|
15
|
+
class: u(o.$style.select),
|
|
16
|
+
disabled: s.isDisabled,
|
|
17
|
+
value: s.modelValue,
|
|
18
|
+
onChange: a[0] || (a[0] = (e) => o.$emit("update:modelValue", e.target.value))
|
|
19
|
+
}, [
|
|
20
|
+
(l(!0), t(i, null, c(s.options, (e) => (l(), t("option", {
|
|
21
|
+
key: e,
|
|
22
|
+
value: e
|
|
23
|
+
}, d(e), 9, _))), 128))
|
|
24
|
+
], 42, m));
|
|
25
|
+
}
|
|
26
|
+
}), y = "_select_hsutp_1", v = {
|
|
27
|
+
select: y
|
|
28
|
+
}, b = {
|
|
29
|
+
$style: v
|
|
30
|
+
}, h = /* @__PURE__ */ p(f, [["__cssModules", b]]);
|
|
31
|
+
export {
|
|
32
|
+
h as default
|
|
33
|
+
};
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
ADDED
package/package.json
CHANGED
|
@@ -1,23 +1,14 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@danilovd/is-ui",
|
|
3
3
|
"description": "Is components",
|
|
4
|
-
"version": "0.1.
|
|
4
|
+
"version": "0.1.2",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"type": "module",
|
|
7
7
|
"main": "dist/index.js",
|
|
8
8
|
"types": "dist/index.d.ts",
|
|
9
|
-
"exports": {
|
|
10
|
-
".": {
|
|
11
|
-
"types": "./dist/index.d.ts",
|
|
12
|
-
"import": "./dist/index.js"
|
|
13
|
-
},
|
|
14
|
-
"./colors": "./dist/colors.scss",
|
|
15
|
-
"./style.css": "./dist/style.css"
|
|
16
|
-
},
|
|
17
9
|
"sideEffects": false,
|
|
18
10
|
"files": [
|
|
19
|
-
"dist/*"
|
|
20
|
-
"./dist/style.css"
|
|
11
|
+
"dist/*"
|
|
21
12
|
],
|
|
22
13
|
"scripts": {
|
|
23
14
|
"dev": "storybook dev -p 6006 --no-open",
|
package/dist/colors.scss
DELETED
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
--color-primary: #7c3aed;
|
|
3
|
-
--color-primary-light: #a78bfa;
|
|
4
|
-
--color-primary-dark: #5b21b6;
|
|
5
|
-
|
|
6
|
-
--color-white: #ffffff;
|
|
7
|
-
--color-black: #000000;
|
|
8
|
-
|
|
9
|
-
--color-gray-light: #f3f4f6;
|
|
10
|
-
--color-gray: #d1d5db;
|
|
11
|
-
--color-gray-dark: #6b7280;
|
|
12
|
-
|
|
13
|
-
--color-success: #10b981;
|
|
14
|
-
--color-error: #ef4444;
|
|
15
|
-
}
|
package/dist/index/index.css
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
:root{--color-primary: #7c3aed;--color-primary-light: #a78bfa;--color-primary-dark: #5b21b6;--color-white: #ffffff;--color-black: #000000;--color-gray-light: #f3f4f6;--color-gray: #d1d5db;--color-gray-dark: #6b7280;--color-success: #10b981;--color-error: #ef4444}@font-face{font-family:base;font-weight:400;src:url(/fonts/400.woff2) format("woff2");font-display:swap}@font-face{font-family:base;font-weight:700;src:url(/fonts/700.woff2) format("woff2");font-display:swap}*{box-sizing:border-box;font-family:base,sans-serif}*::selection{color:var(--color-white);background-color:var(--color-primary-dark)}body{padding:0;margin:0;font-size:1rem;line-height:1.5}a{width:fit-content;color:var(--color-primary);text-decoration:none}h1,h2,h3{margin-top:0;margin-bottom:24px;font-weight:700;line-height:1.2}p{margin:0}p+p{margin:12px 0}._button_34ai2_1{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;font-size:1rem;font-weight:600;border-radius:12px;cursor:pointer;border:2px solid transparent;transition:background-color .25s ease,border-color .25s ease,transform .12s ease,box-shadow .12s ease}._button_34ai2_1:active:not(:disabled){transform:scale(.96);box-shadow:0 0 0 2px var(--color-primary-light)}._button_34ai2_1[data-layout=primary]{background:var(--color-primary);color:var(--color-white)}._button_34ai2_1[data-layout=secondary]{background:var(--color-white);color:var(--color-primary);border-color:var(--color-primary)}._button_34ai2_1:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}._input_iq7a6_1{width:100%;padding:10px 16px;font-size:1rem;border:2px solid var(--color-primary-light);border-radius:8px;background-color:var(--color-white);color:var(--color-black);transition:border-color .3s ease}._input_iq7a6_1:focus{outline:none;border-color:var(--color-primary)}._input_iq7a6_1:disabled{background-color:var(--color-gray-light);cursor:not-allowed}._select_hsutp_1{width:100%;padding:10px 16px;font-size:1rem;border:2px solid var(--color-primary-light);border-radius:8px;background:var(--color-white);transition:.25s ease}._select_hsutp_1:focus{outline:none;border-color:var(--color-primary)}._select_hsutp_1:disabled{background:var(--color-gray-light);cursor:not-allowed}._field_1f64k_1{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}._label_1f64k_8{font-size:.875rem;font-weight:500;color:var(--color-primary-dark)}
|
package/dist/index/index.js
DELETED
|
@@ -1,2 +0,0 @@
|
|
|
1
|
-
(function(l,o){typeof exports=="object"&&typeof module<"u"?o(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],o):(l=typeof globalThis<"u"?globalThis:l||self,o(l.IsUi={},l.Vue))})(this,(function(l,o){"use strict";var i=document.createElement("style");i.textContent=`:root{--color-primary: #7c3aed;--color-primary-light: #a78bfa;--color-primary-dark: #5b21b6;--color-white: #ffffff;--color-black: #000000;--color-gray-light: #f3f4f6;--color-gray: #d1d5db;--color-gray-dark: #6b7280;--color-success: #10b981;--color-error: #ef4444}@font-face{font-family:base;font-weight:400;src:url(/fonts/400.woff2) format("woff2");font-display:swap}@font-face{font-family:base;font-weight:700;src:url(/fonts/700.woff2) format("woff2");font-display:swap}*{box-sizing:border-box;font-family:base,sans-serif}*::selection{color:var(--color-white);background-color:var(--color-primary-dark)}body{padding:0;margin:0;font-size:1rem;line-height:1.5}a{width:fit-content;color:var(--color-primary);text-decoration:none}h1,h2,h3{margin-top:0;margin-bottom:24px;font-weight:700;line-height:1.2}p{margin:0}p+p{margin:12px 0}._button_34ai2_1{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;font-size:1rem;font-weight:600;border-radius:12px;cursor:pointer;border:2px solid transparent;transition:background-color .25s ease,border-color .25s ease,transform .12s ease,box-shadow .12s ease}._button_34ai2_1:active:not(:disabled){transform:scale(.96);box-shadow:0 0 0 2px var(--color-primary-light)}._button_34ai2_1[data-layout=primary]{background:var(--color-primary);color:var(--color-white)}._button_34ai2_1[data-layout=secondary]{background:var(--color-white);color:var(--color-primary);border-color:var(--color-primary)}._button_34ai2_1:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}._input_iq7a6_1{width:100%;padding:10px 16px;font-size:1rem;border:2px solid var(--color-primary-light);border-radius:8px;background-color:var(--color-white);color:var(--color-black);transition:border-color .3s ease}._input_iq7a6_1:focus{outline:none;border-color:var(--color-primary)}._input_iq7a6_1:disabled{background-color:var(--color-gray-light);cursor:not-allowed}._select_hsutp_1{width:100%;padding:10px 16px;font-size:1rem;border:2px solid var(--color-primary-light);border-radius:8px;background:var(--color-white);transition:.25s ease}._select_hsutp_1:focus{outline:none;border-color:var(--color-primary)}._select_hsutp_1:disabled{background:var(--color-gray-light);cursor:not-allowed}._field_1f64k_1{display:flex;flex-direction:column;gap:6px;margin-bottom:16px}._label_1f64k_8{font-size:.875rem;font-weight:500;color:var(--color-primary-dark)}
|
|
2
|
-
/*$vite$:1*/`,document.head.appendChild(i);const c=["data-layout","disabled","type"],d=o.defineComponent({__name:"UiButton",props:{layout:{default:"primary"},type:{default:"button"},isDisabled:{type:Boolean}},setup(r){const e=r;return(t,s)=>(o.openBlock(),o.createElementBlock("button",{class:o.normalizeClass(t.$style.button),"data-layout":e.layout,disabled:e.isDisabled,type:e.type},[o.renderSlot(t.$slots,"default")],10,c))}}),p={button:"_button_34ai2_1"},n=(r,e)=>{const t=r.__vccOpts||r;for(const[s,a]of e)t[s]=a;return t},u=n(d,[["__cssModules",{$style:p}]]),f=["placeholder","disabled","value"],_=n(o.defineComponent({__name:"UiInput",props:{modelValue:{},isDisabled:{type:Boolean},placeholder:{}},emits:["update:modelValue"],setup(r){const e=r;return(t,s)=>(o.openBlock(),o.createElementBlock("input",{class:o.normalizeClass(t.$style.input),placeholder:e.placeholder,disabled:e.isDisabled,value:e.modelValue,onInput:s[0]||(s[0]=a=>t.$emit("update:modelValue",a.target.value))},null,42,f))}}),[["__cssModules",{$style:{input:"_input_iq7a6_1"}}]]),m=["disabled","value"],b=["value"],y=n(o.defineComponent({__name:"UiSelect",props:{modelValue:{},isDisabled:{type:Boolean,default:!1},options:{}},emits:["update:modelValue"],setup(r){const e=r;return(t,s)=>(o.openBlock(),o.createElementBlock("select",{class:o.normalizeClass(t.$style.select),disabled:e.isDisabled,value:e.modelValue,onChange:s[0]||(s[0]=a=>t.$emit("update:modelValue",a.target.value))},[(o.openBlock(!0),o.createElementBlock(o.Fragment,null,o.renderList(e.options,a=>(o.openBlock(),o.createElementBlock("option",{key:a,value:a},o.toDisplayString(a),9,b))),128))],42,m))}}),[["__cssModules",{$style:{select:"_select_hsutp_1"}}]]),h=n(o.defineComponent({__name:"UiField",props:{label:{}},setup(r){const e=r;return(t,s)=>(o.openBlock(),o.createElementBlock("label",{class:o.normalizeClass(t.$style.field)},[o.createElementVNode("span",{class:o.normalizeClass(t.$style.label)},o.toDisplayString(e.label),3),o.renderSlot(t.$slots,"default")],2))}}),[["__cssModules",{$style:{field:"_field_1f64k_1",label:"_label_1f64k_8"}}]]);l.UiButton=u,l.UiField=h,l.UiInput=_,l.UiSelect=y,Object.defineProperty(l,Symbol.toStringTag,{value:"Module"})}));
|