@damarkuncoro/agnostic-ui-vue 0.1.0

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/index.js ADDED
@@ -0,0 +1,123 @@
1
+ import { defineComponent as d, provide as B, inject as k, computed as u, createBlock as _, openBlock as p, resolveDynamicComponent as I, normalizeClass as h, withCtx as x, renderSlot as c, createElementBlock as m, mergeProps as b, unref as C } from "vue";
2
+ import { useUiButton as U, useUiIcon as P, useUiTestComponent as z } from "@damarkuncoro/agnostic-ui-base";
3
+ import { shadcn as i } from "@damarkuncoro/agnostic-ui-skin";
4
+ const f = Symbol("UIContext"), v = {
5
+ getButtonClass: i.getButtonClass,
6
+ getLinkClass: i.getLinkClass,
7
+ getIconClass: i.getIconClass,
8
+ getTestComponentClass: i.getTestComponentClass
9
+ }, g = d({
10
+ name: "UIProvider",
11
+ props: {
12
+ skin: {
13
+ type: Object,
14
+ default: () => v
15
+ }
16
+ },
17
+ setup(t, { slots: a }) {
18
+ return B(f, {
19
+ skin: t.skin
20
+ }), () => {
21
+ var l;
22
+ return (l = a.default) == null ? void 0 : l.call(a);
23
+ };
24
+ }
25
+ }), D = g;
26
+ D.install = (t, a) => {
27
+ t.provide(f, {
28
+ skin: (a == null ? void 0 : a.skin) || v
29
+ }), t.component("UIProvider", g);
30
+ };
31
+ function y() {
32
+ return k(f, { skin: v });
33
+ }
34
+ const N = /* @__PURE__ */ d({
35
+ __name: "Button",
36
+ props: {
37
+ variant: { default: "primary" },
38
+ size: { default: "md" },
39
+ type: { default: "button" },
40
+ disabled: { type: Boolean, default: !1 },
41
+ loading: { type: Boolean, default: !1 },
42
+ toggle: { type: Boolean, default: !1 },
43
+ pressed: { type: Boolean, default: !1 },
44
+ autofocus: { type: Boolean, default: !1 },
45
+ href: { default: void 0 },
46
+ target: { default: void 0 },
47
+ rel: { default: void 0 }
48
+ },
49
+ setup(t) {
50
+ const a = t, { skin: l } = y(), e = u(() => U(a)), r = u(
51
+ () => l.getButtonClass(e.value.props.variant, e.value.props.size)
52
+ ), o = (s) => {
53
+ if (e.value.state.isDisabled) {
54
+ s.preventDefault();
55
+ return;
56
+ }
57
+ };
58
+ return (s, n) => (p(), _(I(e.value.a11y.role === "link" ? "a" : "button"), {
59
+ class: h([r.value, s.$attrs.class]),
60
+ href: e.value.props.href,
61
+ target: e.value.props.target,
62
+ rel: e.value.props.rel,
63
+ type: e.value.a11y.role === "button" ? e.value.props.type : void 0,
64
+ disabled: e.value.state.isDisabled,
65
+ role: e.value.a11y.role,
66
+ tabindex: e.value.a11y.tabIndex,
67
+ "aria-disabled": e.value.a11y.ariaDisabled,
68
+ "aria-busy": e.value.a11y.ariaBusy,
69
+ "aria-pressed": e.value.a11y.ariaPressed,
70
+ "aria-label": e.value.a11y.ariaLabel,
71
+ "aria-labelledby": e.value.a11y.ariaLabelledBy,
72
+ "aria-describedby": e.value.a11y.ariaDescribedBy,
73
+ "aria-expanded": e.value.a11y.ariaExpanded,
74
+ "aria-controls": e.value.a11y.ariaControls,
75
+ "aria-haspopup": e.value.a11y.ariaHasPopup,
76
+ onClick: o
77
+ }, {
78
+ default: x(() => [
79
+ c(s.$slots, "default")
80
+ ]),
81
+ _: 3
82
+ }, 8, ["class", "href", "target", "rel", "type", "disabled", "role", "tabindex", "aria-disabled", "aria-busy", "aria-pressed", "aria-label", "aria-labelledby", "aria-describedby", "aria-expanded", "aria-controls", "aria-haspopup"]));
83
+ }
84
+ }), S = /* @__PURE__ */ d({
85
+ __name: "Icon",
86
+ props: {
87
+ variant: { default: "primary" },
88
+ size: { default: "md" },
89
+ disabled: { type: Boolean, default: !1 }
90
+ },
91
+ setup(t) {
92
+ const a = t, { props: l, a11y: e } = P(a), r = y(), o = u(() => {
93
+ var s, n;
94
+ return (n = (s = r.skin).getIconClass) == null ? void 0 : n.call(s, l.variant, l.size);
95
+ });
96
+ return (s, n) => (p(), m("div", b(C(e), { class: o.value }), [
97
+ c(s.$slots, "default")
98
+ ], 16));
99
+ }
100
+ }), j = /* @__PURE__ */ d({
101
+ __name: "TestComponent",
102
+ props: {
103
+ variant: { default: "primary" },
104
+ size: { default: "md" },
105
+ disabled: { type: Boolean, default: !1 },
106
+ className: { default: "" }
107
+ },
108
+ setup(t) {
109
+ const a = t, { props: l, a11y: e } = z(a), r = y(), o = u(() => r.skin.getTestComponentClass(l.variant, l.size, a.className));
110
+ return (s, n) => (p(), m("div", b(C(e), { class: o.value }), [
111
+ c(s.$slots, "default")
112
+ ], 16));
113
+ }
114
+ });
115
+ export {
116
+ N as Button,
117
+ S as Icon,
118
+ j as TestComponent,
119
+ f as UIContextKey,
120
+ D as UIProvider,
121
+ v as defaultSkin,
122
+ y as useUI
123
+ };
@@ -0,0 +1 @@
1
+ (function(t,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue"),require("@damarkuncoro/agnostic-ui-base"),require("@damarkuncoro/agnostic-ui-skin")):typeof define=="function"&&define.amd?define(["exports","vue","@damarkuncoro/agnostic-ui-base","@damarkuncoro/agnostic-ui-skin"],e):(t=typeof globalThis<"u"?globalThis:t||self,e(t.AgnosticUiVue={},t.Vue,t.AgnosticUiBase,t.AgnosticUiSkin))})(this,function(t,e,m,u){"use strict";const c=Symbol("UIContext"),p={getButtonClass:u.shadcn.getButtonClass,getLinkClass:u.shadcn.getLinkClass,getIconClass:u.shadcn.getIconClass,getTestComponentClass:u.shadcn.getTestComponentClass},y=e.defineComponent({name:"UIProvider",props:{skin:{type:Object,default:()=>p}},setup(n,{slots:s}){return e.provide(c,{skin:n.skin}),()=>{var r;return(r=s.default)==null?void 0:r.call(s)}}}),b=y;b.install=(n,s)=>{n.provide(c,{skin:(s==null?void 0:s.skin)||p}),n.component("UIProvider",y)};function f(){return e.inject(c,{skin:p})}const C=e.defineComponent({__name:"Button",props:{variant:{default:"primary"},size:{default:"md"},type:{default:"button"},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},toggle:{type:Boolean,default:!1},pressed:{type:Boolean,default:!1},autofocus:{type:Boolean,default:!1},href:{default:void 0},target:{default:void 0},rel:{default:void 0}},setup(n){const s=n,{skin:r}=f(),a=e.computed(()=>m.useUiButton(s)),l=e.computed(()=>r.getButtonClass(a.value.props.variant,a.value.props.size)),i=o=>{if(a.value.state.isDisabled){o.preventDefault();return}};return(o,d)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(a.value.a11y.role==="link"?"a":"button"),{class:e.normalizeClass([l.value,o.$attrs.class]),href:a.value.props.href,target:a.value.props.target,rel:a.value.props.rel,type:a.value.a11y.role==="button"?a.value.props.type:void 0,disabled:a.value.state.isDisabled,role:a.value.a11y.role,tabindex:a.value.a11y.tabIndex,"aria-disabled":a.value.a11y.ariaDisabled,"aria-busy":a.value.a11y.ariaBusy,"aria-pressed":a.value.a11y.ariaPressed,"aria-label":a.value.a11y.ariaLabel,"aria-labelledby":a.value.a11y.ariaLabelledBy,"aria-describedby":a.value.a11y.ariaDescribedBy,"aria-expanded":a.value.a11y.ariaExpanded,"aria-controls":a.value.a11y.ariaControls,"aria-haspopup":a.value.a11y.ariaHasPopup,onClick:i},{default:e.withCtx(()=>[e.renderSlot(o.$slots,"default")]),_:3},8,["class","href","target","rel","type","disabled","role","tabindex","aria-disabled","aria-busy","aria-pressed","aria-label","aria-labelledby","aria-describedby","aria-expanded","aria-controls","aria-haspopup"]))}}),k=e.defineComponent({__name:"Icon",props:{variant:{default:"primary"},size:{default:"md"},disabled:{type:Boolean,default:!1}},setup(n){const s=n,{props:r,a11y:a}=m.useUiIcon(s),l=f(),i=e.computed(()=>{var o,d;return(d=(o=l.skin).getIconClass)==null?void 0:d.call(o,r.variant,r.size)});return(o,d)=>(e.openBlock(),e.createElementBlock("div",e.mergeProps(e.unref(a),{class:i.value}),[e.renderSlot(o.$slots,"default")],16))}}),v=e.defineComponent({__name:"TestComponent",props:{variant:{default:"primary"},size:{default:"md"},disabled:{type:Boolean,default:!1},className:{default:""}},setup(n){const s=n,{props:r,a11y:a}=m.useUiTestComponent(s),l=f(),i=e.computed(()=>l.skin.getTestComponentClass(r.variant,r.size,s.className));return(o,d)=>(e.openBlock(),e.createElementBlock("div",e.mergeProps(e.unref(a),{class:i.value}),[e.renderSlot(o.$slots,"default")],16))}});t.Button=C,t.Icon=k,t.TestComponent=v,t.UIContextKey=c,t.UIProvider=b,t.defaultSkin=p,t.useUI=f,Object.defineProperty(t,Symbol.toStringTag,{value:"Module"})});
package/package.json ADDED
@@ -0,0 +1,57 @@
1
+ {
2
+ "name": "@damarkuncoro/agnostic-ui-vue",
3
+ "description": "Agnostic UI Vue",
4
+ "version": "0.1.0",
5
+ "type": "module",
6
+ "main": "dist/index.js",
7
+ "types": "dist/index.d.ts",
8
+ "files": ["dist"],
9
+ "sideEffects": false,
10
+ "publishConfig": { "access": "public" },
11
+ "scripts": {
12
+ "build": "vue-tsc && vite build",
13
+ "test": "vitest run"
14
+ },
15
+ "dependencies": {
16
+ "@damarkuncoro/agnostic-ui-contracts": "workspace:*",
17
+ "@damarkuncoro/agnostic-ui-base": "workspace:*",
18
+ "@damarkuncoro/agnostic-ui-skin": "workspace:*",
19
+ "clsx": "^2.1.0",
20
+ "tailwind-merge": "^2.2.0",
21
+ "vue": "^3.4.0"
22
+ },
23
+ "devDependencies": {
24
+ "@vitejs/plugin-vue": "^5.0.0",
25
+ "@vue/test-utils": "^2.4.0",
26
+ "happy-dom": "^13.0.0",
27
+ "typescript": "^5.0.0",
28
+ "vite": "^5.0.0",
29
+ "vitest": "^3.0.0",
30
+ "vue-tsc": "^2.0.0"
31
+ },
32
+ "peerDependencies": {
33
+ "vue": "^3.0.0"
34
+ },
35
+ "license": "MIT",
36
+ "author": "Damar Kuncoro",
37
+ "keywords": [
38
+ "agnostic-ui",
39
+ "vue",
40
+ "components",
41
+ "typescript",
42
+ "design-system",
43
+ "a11y"
44
+ ],
45
+ "repository": {
46
+ "type": "git",
47
+ "url": "git+https://github.com/damarkuncoro/agnostic-ui.git"
48
+ },
49
+ "bugs": {
50
+ "url": "https://github.com/damarkuncoro/agnostic-ui/issues"
51
+ },
52
+ "homepage": "https://github.com/damarkuncoro/agnostic-ui#readme",
53
+ "engines": {
54
+ "node": ">=18",
55
+ "pnpm": ">=8"
56
+ }
57
+ }