g-ui-core 0.0.8 → 0.0.11
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/cjs/g-button.cjs.entry.js +1 -1
- package/dist/cjs/index.cjs.js +5 -5
- package/dist/collection/components/g-button/g-button.js +3 -3
- package/dist/collection/index.js +1 -1
- package/dist/components/g-button.js +1 -1
- package/dist/components/index.js +1 -1
- package/dist/esm/g-button.entry.js +1 -1
- package/dist/esm/index.js +5 -5
- package/dist/g-ui/g-ui.esm.js +1 -1
- package/dist/g-ui/index.esm.js +1 -1
- package/dist/g-ui/p-c94ef193.entry.js +1 -0
- package/dist/types/components/g-button/g-button.d.ts +1 -1
- package/dist/types/index.d.ts +1 -1
- package/package.json +21 -8
- package/types.d.ts +2 -0
- package/vue/index.d.ts +4 -8
- package/vue/index.ts +8 -4
- package/vue/src/components.ts +35 -0
- package/dist/g-ui/p-a0f43132.entry.js +0 -1
- package/vue/MyButton.ts +0 -45
- package/vue/main.d.ts +0 -9
package/dist/cjs/index.cjs.js
CHANGED
|
@@ -4,7 +4,7 @@ var index = require('./index-DOlVX1hU.js');
|
|
|
4
4
|
|
|
5
5
|
const gButtonCss = () => `:host{display:inline-block}:host(:not(:first-child)){margin-left:12px}:host{--g-btn-color:#4f46e5;--g-btn-color-hover:#4338ca;--g-btn-color-active:#3730a3;--g-btn-text-color:#fff;--g-btn-plain-bg:#eef2ff}.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.25em;border:1px solid var(--g-btn-color);border-radius:6px;font-family:inherit;font-weight:600;line-height:1;cursor:pointer;user-select:none;transition:all 0.2s ease;background-color:var(--g-btn-color);color:var(--g-btn-text-color);vertical-align:middle;text-decoration:none;white-space:nowrap}.btn:hover{background-color:var(--g-btn-color-hover);border-color:var(--g-btn-color-hover)}.btn:active{background-color:var(--g-btn-color-active);border-color:var(--g-btn-color-active)}.btn:disabled,.btn--disabled{opacity:0.5;cursor:not-allowed;pointer-events:none}.btn--sm{padding:0.375rem 0.75rem;font-size:0.875rem}.btn--md{padding:0.5rem 1rem;font-size:1rem}.btn--lg{padding:0.75rem 1.5rem;font-size:1.125rem}.btn--primary{--g-btn-color:#4f46e5;--g-btn-color-hover:#4338ca;--g-btn-color-active:#3730a3;--g-btn-plain-bg:#eef2ff}.btn--success{--g-btn-color:#10b981;--g-btn-color-hover:#059669;--g-btn-color-active:#047857;--g-btn-plain-bg:#d1fae5}.btn--warning{--g-btn-color:#f59e0b;--g-btn-color-hover:#d97706;--g-btn-color-active:#b45309;--g-btn-plain-bg:#fef3c7}.btn--danger{--g-btn-color:#ef4444;--g-btn-color-hover:#dc2626;--g-btn-color-active:#b91c1c;--g-btn-plain-bg:#fee2e2}.btn--info,.btn--secondary{--g-btn-color:#6b7280;--g-btn-color-hover:#4b5563;--g-btn-color-active:#374151;--g-btn-plain-bg:#f3f4f6}.btn--plain{background-color:transparent;color:var(--g-btn-color)}.btn--plain:hover{background-color:var(--g-btn-plain-bg);color:var(--g-btn-color-hover);border-color:var(--g-btn-color-hover)}.btn--plain:active{background-color:var(--g-btn-plain-bg);color:var(--g-btn-color-active);border-color:var(--g-btn-color-active)}.btn--text{border-color:transparent;background-color:transparent;color:var(--g-btn-color)}.btn--text:hover{background-color:transparent;color:var(--g-btn-color-hover);border-color:transparent}.btn--text:active{color:var(--g-btn-color-active)}.btn--text.btn--bg:hover{background-color:var(--g-btn-plain-bg)}.btn--link{border-color:transparent;background-color:transparent;color:var(--g-btn-color);padding:0;font-weight:400}.btn--link:hover{background-color:transparent;color:var(--g-btn-color-hover);border-color:transparent;text-decoration:underline}.btn--link:active{color:var(--g-btn-color-active)}.btn--round{border-radius:9999px}.btn--circle{border-radius:50%;padding:0.5rem;width:2.5rem;height:2.5rem}.btn--circle.btn--sm{width:2rem;height:2rem;padding:0.375rem}.btn--circle.btn--lg{width:3rem;height:3rem;padding:0.75rem}.btn--dashed{border-style:dashed;background-color:color-mix(in srgb, var(--g-btn-color) 10%, transparent)}.btn--dashed:hover{background-color:color-mix(in srgb, var(--g-btn-color) 20%, transparent)}.btn--loading{cursor:wait;opacity:0.8}.btn__loading-icon{display:inline-flex;animation:g-spin 1s linear infinite}@keyframes g-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.btn__icon{display:inline-flex;font-size:1.1em}.btn__label{display:inline-flex;align-items:center}.btn--dark{--g-btn-color:#818cf8;--g-btn-color-hover:#6366f1;--g-btn-color-active:#4f46e5;--g-btn-plain-bg:#1e1b4b;--g-btn-text-color:#0f0f0f}.btn--dark.btn--plain{background-color:transparent;color:var(--g-btn-color);border-color:var(--g-btn-color)}.btn--dark.btn--text,.btn--dark.btn--link{color:var(--g-btn-color)}:host([style*='--g-btn-color']) .btn{background-color:var(--g-btn-color);border-color:var(--g-btn-color);color:var(--g-btn-text-color, #fff)}:host([style*='--g-btn-color']) .btn.btn--plain{background-color:transparent;color:var(--g-btn-color)}:host([style*='--g-btn-color']) .btn.btn--text,:host([style*='--g-btn-color']) .btn.btn--link{background-color:transparent;border-color:transparent;color:var(--g-btn-color)}`;
|
|
6
6
|
|
|
7
|
-
const
|
|
7
|
+
const GButton = class {
|
|
8
8
|
constructor(hostRef) {
|
|
9
9
|
index.registerInstance(this, hostRef);
|
|
10
10
|
this.type = 'primary';
|
|
@@ -77,8 +77,8 @@ const MyButton = class {
|
|
|
77
77
|
render() {
|
|
78
78
|
const { loading, disabled, autofocus, nativeType, icon, label, tag: Tag, loadingIcon, shouldAddSpace, } = this;
|
|
79
79
|
const displayLabel = shouldAddSpace ? label.split('').join('\u2009') : label;
|
|
80
|
-
const content = (index.h(index.h.Fragment, null, loading && index.h("span", { key: '
|
|
81
|
-
return (index.h(Tag, { key: '
|
|
80
|
+
const content = (index.h(index.h.Fragment, null, loading && index.h("span", { key: 'd4c9186587c2e95fe3beb90884d37d82cc80a25f', class: "btn__loading-icon" }, loadingIcon), !loading && icon && index.h("span", { key: '7bbbb86a286ba64aef939605b55f82f104eb9184', class: "btn__icon" }, icon), displayLabel && index.h("span", { key: '81cd63a88a02e1f186fda9175fcb27fc9deadd0a', class: "btn__label" }, displayLabel), index.h("slot", { key: 'a657cd0ddb7784909bb5a2df3648cda59d3e71e2' })));
|
|
81
|
+
return (index.h(Tag, { key: 'a7afac4641f1d19d513e95200f24bd3bccc48b50', class: this.computedClass, disabled: Tag === 'button' ? (disabled || loading) : undefined, type: Tag === 'button' ? nativeType : undefined, autofocus: Tag === 'button' ? autofocus : undefined, style: this.customStyle, onClick: this.handleClick }, content));
|
|
82
82
|
}
|
|
83
83
|
static get watchers() { return {
|
|
84
84
|
"label": [{
|
|
@@ -89,6 +89,6 @@ const MyButton = class {
|
|
|
89
89
|
}]
|
|
90
90
|
}; }
|
|
91
91
|
};
|
|
92
|
-
|
|
92
|
+
GButton.style = gButtonCss();
|
|
93
93
|
|
|
94
|
-
exports.
|
|
94
|
+
exports.GButton = GButton;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { h } from "@stencil/core";
|
|
2
|
-
export class
|
|
2
|
+
export class GButton {
|
|
3
3
|
constructor() {
|
|
4
4
|
this.type = 'primary';
|
|
5
5
|
this.size = 'md';
|
|
@@ -71,8 +71,8 @@ export class MyButton {
|
|
|
71
71
|
render() {
|
|
72
72
|
const { loading, disabled, autofocus, nativeType, icon, label, tag: Tag, loadingIcon, shouldAddSpace, } = this;
|
|
73
73
|
const displayLabel = shouldAddSpace ? label.split('').join('\u2009') : label;
|
|
74
|
-
const content = (h(h.Fragment, null, loading && h("span", { key: '
|
|
75
|
-
return (h(Tag, { key: '
|
|
74
|
+
const content = (h(h.Fragment, null, loading && h("span", { key: 'd4c9186587c2e95fe3beb90884d37d82cc80a25f', class: "btn__loading-icon" }, loadingIcon), !loading && icon && h("span", { key: '7bbbb86a286ba64aef939605b55f82f104eb9184', class: "btn__icon" }, icon), displayLabel && h("span", { key: '81cd63a88a02e1f186fda9175fcb27fc9deadd0a', class: "btn__label" }, displayLabel), h("slot", { key: 'a657cd0ddb7784909bb5a2df3648cda59d3e71e2' })));
|
|
75
|
+
return (h(Tag, { key: 'a7afac4641f1d19d513e95200f24bd3bccc48b50', class: this.computedClass, disabled: Tag === 'button' ? (disabled || loading) : undefined, type: Tag === 'button' ? nativeType : undefined, autofocus: Tag === 'button' ? autofocus : undefined, style: this.customStyle, onClick: this.handleClick }, content));
|
|
76
76
|
}
|
|
77
77
|
static get is() { return "g-button"; }
|
|
78
78
|
static get encapsulation() { return "shadow"; }
|
package/dist/collection/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export { GButton } from './components/g-button/g-button';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{
|
|
1
|
+
import{GButton as o,d as t}from"./index.js";const s=o,n=t;export{s as GButton,n as defineCustomElement}
|
package/dist/components/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{transformTag as t,proxyCustomElement as o,HTMLElement as n,h as r}from"@stencil/core/internal/client";export{getAssetPath,render,setAssetPath,setNonce,setPlatformOptions}from"@stencil/core/internal/client";const e=o(class extends n{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.type="primary",this.size="md",this.plain=!1,this.text=!1,this.bg=!1,this.link=!1,this.round=!1,this.circle=!1,this.dashed=!1,this.loading=!1,this.loadingIcon="●",this.disabled=!1,this.autofocus=!1,this.nativeType="button",this.autoInsertSpace=!1,this.dark=!1,this.tag="button",this.shouldAddSpace=!1,this.handleClick=t=>{(this.loading||this.disabled)&&(t.preventDefault(),t.stopPropagation())}}checkAutoSpace(){this.shouldAddSpace=!(!this.autoInsertSpace||!this.label)&&2===this.label.length&&/^[\u4e00-\u9fa5]+$/.test(this.label)}componentWillLoad(){this.checkAutoSpace()}get computedClass(){const{type:t,size:o,plain:n,text:r,bg:e,link:a,round:c,circle:l,dashed:b,loading:i,disabled:s,dark:d}=this,g=["btn","btn--"+t,"btn--"+o];return n&&g.push("btn--plain"),r&&g.push("btn--text"),e&&g.push("btn--bg"),a&&g.push("btn--link"),c&&g.push("btn--round"),l&&g.push("btn--circle"),b&&g.push("btn--dashed"),i&&g.push("btn--loading"),s&&g.push("btn--disabled"),d&&g.push("btn--dark"),g.join(" ")}get customStyle(){return this.color?{"--g-btn-color":this.color}:{}}render(){const{loading:t,disabled:o,autofocus:n,nativeType:e,icon:a,label:c,tag:l,loadingIcon:b,shouldAddSpace:i}=this,s=i?c.split("").join(" "):c,d=r(r.Fragment,null,t&&r("span",{key:"aa408565cb2ddd5678501ca19614291c4140de2b",class:"btn__loading-icon"},b),!t&&a&&r("span",{key:"670c1c88c7112a94fab8cb49b68ffd82d67330fd",class:"btn__icon"},a),s&&r("span",{key:"08efe99ac9272251df7a8bff990a1b176482b6a9",class:"btn__label"},s),r("slot",{key:"8a8d95e495ab0fcbf09d6f61df0d8fcb67cc2b63"}));return r(l,{key:"b767af5753b44f795b2ae1f8c92d14c810c35678",class:this.computedClass,disabled:"button"===l?o||t:void 0,type:"button"===l?e:void 0,autofocus:"button"===l?n:void 0,style:this.customStyle,onClick:this.handleClick},d)}static get watchers(){return{label:[{checkAutoSpace:0}],autoInsertSpace:[{checkAutoSpace:0}]}}static get style(){return":host{display:inline-block}:host(:not(:first-child)){margin-left:12px}:host{--g-btn-color:#4f46e5;--g-btn-color-hover:#4338ca;--g-btn-color-active:#3730a3;--g-btn-text-color:#fff;--g-btn-plain-bg:#eef2ff}.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.25em;border:1px solid var(--g-btn-color);border-radius:6px;font-family:inherit;font-weight:600;line-height:1;cursor:pointer;user-select:none;transition:all 0.2s ease;background-color:var(--g-btn-color);color:var(--g-btn-text-color);vertical-align:middle;text-decoration:none;white-space:nowrap}.btn:hover{background-color:var(--g-btn-color-hover);border-color:var(--g-btn-color-hover)}.btn:active{background-color:var(--g-btn-color-active);border-color:var(--g-btn-color-active)}.btn:disabled,.btn--disabled{opacity:0.5;cursor:not-allowed;pointer-events:none}.btn--sm{padding:0.375rem 0.75rem;font-size:0.875rem}.btn--md{padding:0.5rem 1rem;font-size:1rem}.btn--lg{padding:0.75rem 1.5rem;font-size:1.125rem}.btn--primary{--g-btn-color:#4f46e5;--g-btn-color-hover:#4338ca;--g-btn-color-active:#3730a3;--g-btn-plain-bg:#eef2ff}.btn--success{--g-btn-color:#10b981;--g-btn-color-hover:#059669;--g-btn-color-active:#047857;--g-btn-plain-bg:#d1fae5}.btn--warning{--g-btn-color:#f59e0b;--g-btn-color-hover:#d97706;--g-btn-color-active:#b45309;--g-btn-plain-bg:#fef3c7}.btn--danger{--g-btn-color:#ef4444;--g-btn-color-hover:#dc2626;--g-btn-color-active:#b91c1c;--g-btn-plain-bg:#fee2e2}.btn--info,.btn--secondary{--g-btn-color:#6b7280;--g-btn-color-hover:#4b5563;--g-btn-color-active:#374151;--g-btn-plain-bg:#f3f4f6}.btn--plain{background-color:transparent;color:var(--g-btn-color)}.btn--plain:hover{background-color:var(--g-btn-plain-bg);color:var(--g-btn-color-hover);border-color:var(--g-btn-color-hover)}.btn--plain:active{background-color:var(--g-btn-plain-bg);color:var(--g-btn-color-active);border-color:var(--g-btn-color-active)}.btn--text{border-color:transparent;background-color:transparent;color:var(--g-btn-color)}.btn--text:hover{background-color:transparent;color:var(--g-btn-color-hover);border-color:transparent}.btn--text:active{color:var(--g-btn-color-active)}.btn--text.btn--bg:hover{background-color:var(--g-btn-plain-bg)}.btn--link{border-color:transparent;background-color:transparent;color:var(--g-btn-color);padding:0;font-weight:400}.btn--link:hover{background-color:transparent;color:var(--g-btn-color-hover);border-color:transparent;text-decoration:underline}.btn--link:active{color:var(--g-btn-color-active)}.btn--round{border-radius:9999px}.btn--circle{border-radius:50%;padding:0.5rem;width:2.5rem;height:2.5rem}.btn--circle.btn--sm{width:2rem;height:2rem;padding:0.375rem}.btn--circle.btn--lg{width:3rem;height:3rem;padding:0.75rem}.btn--dashed{border-style:dashed;background-color:color-mix(in srgb, var(--g-btn-color) 10%, transparent)}.btn--dashed:hover{background-color:color-mix(in srgb, var(--g-btn-color) 20%, transparent)}.btn--loading{cursor:wait;opacity:0.8}.btn__loading-icon{display:inline-flex;animation:g-spin 1s linear infinite}@keyframes g-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.btn__icon{display:inline-flex;font-size:1.1em}.btn__label{display:inline-flex;align-items:center}.btn--dark{--g-btn-color:#818cf8;--g-btn-color-hover:#6366f1;--g-btn-color-active:#4f46e5;--g-btn-plain-bg:#1e1b4b;--g-btn-text-color:#0f0f0f}.btn--dark.btn--plain{background-color:transparent;color:var(--g-btn-color);border-color:var(--g-btn-color)}.btn--dark.btn--text,.btn--dark.btn--link{color:var(--g-btn-color)}:host([style*='--g-btn-color']) .btn{background-color:var(--g-btn-color);border-color:var(--g-btn-color);color:var(--g-btn-text-color, #fff)}:host([style*='--g-btn-color']) .btn.btn--plain{background-color:transparent;color:var(--g-btn-color)}:host([style*='--g-btn-color']) .btn.btn--text,:host([style*='--g-btn-color']) .btn.btn--link{background-color:transparent;border-color:transparent;color:var(--g-btn-color)}"}},[257,"g-button",{type:[1],size:[1],plain:[4],text:[4],bg:[4],link:[4],round:[4],circle:[4],dashed:[4],loading:[4],loadingIcon:[1,"loading-icon"],disabled:[4],icon:[1],autofocus:[4],nativeType:[1,"native-type"],autoInsertSpace:[4,"auto-insert-space"],color:[1],dark:[4],tag:[1],label:[1],shouldAddSpace:[32]},void 0,{label:[{checkAutoSpace:0}],autoInsertSpace:[{checkAutoSpace:0}]}]);function a(){"undefined"!=typeof customElements&&["g-button"].forEach((o=>{"g-button"===o&&(customElements.get(t(o))||customElements.define(t(o),e))}))}a();export{e as MyButton,a as d}
|
|
1
|
+
function t(t,n,e){const o="undefined"!=typeof HTMLElement?HTMLElement.prototype:null;for(;t&&t!==o;){const o=Object.getOwnPropertyDescriptor(t,n);if(o&&(!e||o.get))return o;t=Object.getPrototypeOf(t)}}var n,e=(n,e)=>{var o;Object.entries(null!=(o=e.o.t)?o:{}).map((([o,[r]])=>{if(31&r||32&r){const r=n[o],l=t(Object.getPrototypeOf(n),o,!0)||Object.getOwnPropertyDescriptor(n,o);l&&Object.defineProperty(n,o,{get(){return l.get.call(this)},set(t){l.set.call(this,t)},configurable:!0,enumerable:!0}),e.l.has(o)?n[o]=e.l.get(o):void 0!==r&&(n[o]=r)}}))},o=t=>{if(t.__stencil__getHostRef)return t.__stencil__getHostRef()},r=(t,n)=>n in t,l=(t,n)=>(0,console.error)(t,n),c=new Map,i="undefined"!=typeof window?window:{},s=i.HTMLElement||class{},a={i:0,u:"",jmp:t=>t(),raf:t=>requestAnimationFrame(t),ael:(t,n,e,o)=>t.addEventListener(n,e,o),rel:(t,n,e,o)=>t.removeEventListener(n,e,o),ce:(t,n)=>new CustomEvent(t,n)},b=(()=>{try{return!!i.document.adoptedStyleSheets&&(new CSSStyleSheet,"function"==typeof(new CSSStyleSheet).replaceSync)}catch(t){}return!1})(),u=!!b&&(()=>!!i.document&&Object.getOwnPropertyDescriptor(i.document.adoptedStyleSheets,"length").writable)(),f=!1,d=[],g=[],h=(t,n)=>e=>{t.push(e),f||(f=!0,n&&4&a.i?m(v):a.raf(v))},p=t=>{for(let n=0;n<t.length;n++)try{t[n](performance.now())}catch(t){l(t)}t.length=0},v=()=>{p(d),p(g),(f=d.length>0)&&a.raf(v)},m=t=>Promise.resolve(void 0).then(t),y=h(g,!0),k=t=>{const n=new URL(t,a.u);return n.origin!==i.location.origin?n.href:n.pathname},$=t=>a.u=t;function w(){const t=this.attachShadow({mode:"open"});void 0===n&&(n=null),n&&(u?t.adoptedStyleSheets.push(n):t.adoptedStyleSheets=[...t.adoptedStyleSheets,n])}var x,j=new WeakMap,S=t=>"sc-"+t.h,O=t=>"object"==(t=typeof t)||"function"===t,_=(t,n,...e)=>{let o=null,r=null,l=!1,c=!1;const i=[],s=n=>{for(let e=0;e<n.length;e++)o=n[e],Array.isArray(o)?s(o):null!=o&&"boolean"!=typeof o&&((l="function"!=typeof t&&!O(o))&&(o+=""),l&&c?i[i.length-1].p+=o:i.push(l?A(null,o):o),c=l)};if(s(e),n){n.key&&(r=n.key);{const t=n.className||n.class;t&&(n.class="object"!=typeof t?t:Object.keys(t).filter((n=>t[n])).join(" "))}}if("function"==typeof t)return t(null===n?{}:n,i,M);const a=A(t,null);return a.v=n,i.length>0&&(a.m=i),a.k=r,a},A=(t,n)=>({i:0,$:t,p:null!=n?n:null,j:null,m:null,v:null,k:null}),E={},M={forEach:(t,n)=>t.map(C).forEach(n),map:(t,n)=>t.map(C).map(n).map(z)},C=t=>({vattrs:t.v,vchildren:t.m,vkey:t.k,vname:t.S,vtag:t.$,vtext:t.p}),z=t=>{if("function"==typeof t.vtag){const n={...t.vattrs};return t.vkey&&(n.key=t.vkey),t.vname&&(n.name=t.vname),_(t.vtag,n,...t.vchildren||[])}const n=A(t.vtag,t.vtext);return n.v=t.vattrs,n.m=t.vchildren,n.k=t.vkey,n.S=t.vname,n},L=t=>{if(!t)return;const n=Object.keys(t);if(0===n.length)return;let e=!1;for(const o of n){if(e)break;for(const n of t[o])if("string"==typeof n){e=!0;break}}if(!e)return t;const o={};for(const e of n)o[e]=t[e].map((t=>"string"==typeof t?{[t]:0}:t));return o},W=(t,n)=>null==t||O(t)?t:4&n?"false"!==t&&(""===t||!!t):1&n?t+"":t,D=(t,n,e,l,c,s)=>{if(e===l)return;let b=r(t,n),u=n.toLowerCase();if("class"===n){const n=t.classList,o=I(e);let r=I(l);n.remove(...o.filter((t=>t&&!r.includes(t)))),n.add(...r.filter((t=>t&&!o.includes(t))))}else if("style"===n){for(const n in e)l&&null!=l[n]||(n.includes("-")?t.style.removeProperty(n):t.style[n]="");for(const n in l)e&&l[n]===e[n]||(n.includes("-")?t.style.setProperty(n,l[n]):t.style[n]=l[n])}else if("key"===n);else if(t.__lookupSetter__(n)||"o"!==n[0]||"n"!==n[1]){if("a"===n[0]&&n.startsWith("attr:")){const e=n.slice(5);let r;{const n=o(t);if(n&&n.o&&n.o.t){const t=n.o.t[e];t&&t[1]&&(r=t[1])}}return r||(r=e.replace(/([a-z0-9])([A-Z])/g,"$1-$2").toLowerCase()),void(null==l||!1===l?!1===l&&""!==t.getAttribute(r)||t.removeAttribute(r):t.setAttribute(r,!0===l?"":l))}if("p"===n[0]&&n.startsWith("prop:")){const e=n.slice(5);try{t[e]=l}catch(t){}return}{const o=O(l);if((b||o&&null!==l)&&!c)try{if(t.tagName.includes("-"))t[n]!==l&&(t[n]=l);else{const o=null==l?"":l;"list"===n?b=!1:null!=e&&t[n]===o||("function"==typeof t.__lookupSetter__(n)?t[n]=o:t.setAttribute(n,o))}}catch(t){}null==l||!1===l?!1===l&&""!==t.getAttribute(n)||t.removeAttribute(n):(!b||4&s||c)&&!o&&1===t.nodeType&&t.setAttribute(n,l=!0===l?"":l)}}else if(n="-"===n[2]?n.slice(3):r(i,u)?u.slice(2):u[2]+n.slice(3),e||l){const o=n.endsWith(P);n=n.replace(R,""),e&&a.rel(t,n,e,o),l&&a.ael(t,n,l,o)}},H=/\s/,I=t=>("object"==typeof t&&t&&"baseVal"in t&&(t=t.baseVal),t&&"string"==typeof t?t.split(H):[]),P="Capture",R=RegExp(P+"$"),U=(t,n,e)=>{const o=11===n.j.nodeType&&n.j.host?n.j.host:n.j,r=t&&t.v||{},l=n.v||{};for(const t of N(Object.keys(r)))t in l||D(o,t,r[t],void 0,e,n.i);for(const t of N(Object.keys(l)))D(o,t,r[t],l[t],e,n.i)};function N(t){return t.includes("ref")?[...t.filter((t=>"ref"!==t)),"ref"]:t}var T=!1,V=!1,q=(t,n,e)=>{const o=n.m[e];let r,l,c=0;if(null!=o.p)r=o.j=i.document.createTextNode(o.p);else{if(!i.document)throw Error("You are trying to render a Stencil component in an environment that doesn't support the DOM.");if(r=o.j=i.document.createElement(o.$),U(null,o,V),o.m){const n="template"===o.$?r.content:r;for(c=0;c<o.m.length;++c)l=q(t,o,c),l&&n.appendChild(l)}}return r["s-hn"]=x,r},F=(t,n,e,o,r,l)=>{let c,i=t;for(i.shadowRoot&&i.tagName===x&&(i=i.shadowRoot),"template"===e.$&&(i=i.content);r<=l;++r)o[r]&&(c=q(null,e,r),c&&(o[r].j=c,G(i,c,n)))},Y=(t,n,e)=>{for(let o=n;o<=e;++o){const n=t[o];if(n){const t=n.j;t&&t.remove()}}},Z=(t,n,e=!1)=>t.$===n.$&&(e?(e&&!t.k&&n.k&&(t.k=n.k),!0):t.k===n.k),B=(t,n,e=!1)=>{const o=n.j=t.j,r=t.m,l=n.m,c=n.p;null==c?("slot"!==n.$||T||t.S!==n.S&&(n.j["s-sn"]=n.S||"",(t=>{a.i|=1;const n=t.closest(x.toLowerCase());if(null!=n){const e=Array.from(n.__childNodes||n.childNodes).find((t=>t["s-cr"])),o=Array.from(t.__childNodes||t.childNodes);for(const t of e?o.reverse():o)null!=t["s-sh"]&&(G(n,t,null!=e?e:null),t["s-sh"]=void 0)}a.i&=-2})(n.j.parentElement)),U(t,n,V),null!==r&&null!==l?((t,n,e,o,r=!1)=>{let l,c,i=0,s=0,a=0,b=0,u=n.length-1,f=n[0],d=n[u],g=o.length-1,h=o[0],p=o[g];const v="template"===e.$?t.content:t;for(;i<=u&&s<=g;)if(null==f)f=n[++i];else if(null==d)d=n[--u];else if(null==h)h=o[++s];else if(null==p)p=o[--g];else if(Z(f,h,r))B(f,h,r),f=n[++i],h=o[++s];else if(Z(d,p,r))B(d,p,r),d=n[--u],p=o[--g];else if(Z(f,p,r))B(f,p,r),G(v,f.j,d.j.nextSibling),f=n[++i],p=o[--g];else if(Z(d,h,r))B(d,h,r),G(v,d.j,f.j),d=n[--u],h=o[++s];else{for(a=-1,b=i;b<=u;++b)if(n[b]&&null!==n[b].k&&n[b].k===h.k){a=b;break}a>=0?(c=n[a],c.$!==h.$?l=q(n&&n[s],e,a):(B(c,h,r),n[a]=void 0,l=c.j),h=o[++s]):(l=q(n&&n[s],e,s),h=o[++s]),l&&G(f.j.parentNode,l,f.j)}i>u?F(t,null==o[g+1]?null:o[g+1].j,e,o,s,g):s>g&&Y(n,i,u)})(o,r,n,l,e):null!==l?(null!==t.p&&(o.textContent=""),F(o,null,n,l,0,l.length-1)):!e&&null!==r&&Y(r,0,r.length-1)):t.p!==c&&(o.data=c)},G=(t,n,e)=>t.__insertBefore?t.__insertBefore(n,e):null==t?void 0:t.insertBefore(n,e),J=(t,n,e=!1)=>{const o=t.$hostElement$,r=t.o,l=t.O||A(null,null),c=(t=>t&&t.$===E)(n)?n:_(null,null,n);if(x=o.tagName,e&&c.v)for(const t of Object.keys(c.v))o.hasAttribute(t)&&!["key","ref","style","class"].includes(t)&&(c.v[t]=o[t]);c.$=null,c.i|=4,t.O=c,c.j=l.j=o.shadowRoot||o,T=!(!(1&r.i)||128&r.i),B(l,c,e)},K=(t,n)=>{if(n&&!t._&&n["s-p"]){const e=n["s-p"].push(new Promise((o=>t._=()=>{n["s-p"].splice(e-1,1),o()})))}},Q=(t,n)=>{if(t.i|=16,4&t.i)return void(t.i|=512);K(t,t.A);const e=()=>X(t,n);if(!n)return y(e);queueMicrotask((()=>{e()}))},X=(t,n)=>{const e=t.$hostElement$,o=e;if(!o)throw Error(`Can't render component <${e.tagName.toLowerCase()} /> with invalid Stencil runtime! Make sure this imported component is compiled with a \`externalRuntime: true\` flag. For more information, please refer to https://stenciljs.com/docs/custom-elements#externalruntime`);let r;return r=ct(o,n?"componentWillLoad":"componentWillUpdate",void 0,e),r=tt(r,(()=>ct(o,"componentWillRender",void 0,e))),tt(r,(()=>et(t,o,n)))},tt=(t,n)=>nt(t)?t.then(n).catch((t=>{console.error(t),n()})):n(),nt=t=>t instanceof Promise||t&&t.then&&"function"==typeof t.then,et=async(t,n,e)=>{var o;const r=t.$hostElement$,l=r["s-rc"];e&&(t=>{const n=t.o,e=t.$hostElement$,o=n.i,r=((t,n)=>{var e,o,r;const l=S(n),s=c.get(l);if(!i.document)return l;if(t=11===t.nodeType?t:i.document,s)if("string"==typeof s){let r,c=j.get(t=t.head||t);if(c||j.set(t,c=new Set),!c.has(l)){r=i.document.createElement("style"),r.textContent=s;const f=null!=(e=a.M)?e:function(){var t,n,e;return null!=(e=null==(n=null==(t=i.document.head)?void 0:t.querySelector('meta[name="csp-nonce"]'))?void 0:n.getAttribute("content"))?e:void 0}();if(null!=f&&r.setAttribute("nonce",f),!(1&n.i))if("HEAD"===t.nodeName){const n=t.querySelectorAll("link[rel=preconnect]"),e=n.length>0?n[n.length-1].nextSibling:t.querySelector("style");t.insertBefore(r,(null==e?void 0:e.parentNode)===t?e:null)}else if("host"in t)if(b){const n=new(null!=(o=t.defaultView)?o:t.ownerDocument.defaultView).CSSStyleSheet;n.replaceSync(s),u?t.adoptedStyleSheets.unshift(n):t.adoptedStyleSheets=[n,...t.adoptedStyleSheets]}else{const n=t.querySelector("style");n?n.textContent=s+n.textContent:t.prepend(r)}else t.append(r);1&n.i&&t.insertBefore(r,null),4&n.i&&(r.textContent+="slot-fb{display:contents}slot-fb[hidden]{display:none}"),c&&c.add(l)}}else{let n=j.get(t);if(n||j.set(t,n=new Set),!n.has(l)){const e=null!=(r=t.defaultView)?r:t.ownerDocument.defaultView;let o;if(s.constructor===e.CSSStyleSheet)o=s;else{o=new e.CSSStyleSheet;for(let t=0;t<s.cssRules.length;t++)o.insertRule(s.cssRules[t].cssText,t)}u?t.adoptedStyleSheets.push(o):t.adoptedStyleSheets=[...t.adoptedStyleSheets,o],n.add(l)}}return l})(e.shadowRoot?e.shadowRoot:e.getRootNode(),n);10&o&&(e["s-sc"]=r,e.classList.add(r+"-h"))})(t);ot(t,n,r,e),l&&(l.map((t=>t())),r["s-rc"]=void 0);{const n=null!=(o=r["s-p"])?o:[],e=()=>rt(t);0===n.length?e():(Promise.all(n).then(e).catch(e),t.i|=4,n.length=0)}},ot=(t,n,e,o)=>{try{n=n.render(),t.i&=-17,t.i|=2,J(t,n,o)}catch(n){l(n,t.$hostElement$)}return null},rt=t=>{const n=t.$hostElement$,e=n,o=t.A;ct(e,"componentDidRender",void 0,n),64&t.i?ct(e,"componentDidUpdate",void 0,n):(t.i|=64,it(n),ct(e,"componentDidLoad",void 0,n),t.C(n),o||lt()),t._&&(t._(),t._=void 0),512&t.i&&m((()=>Q(t,!1))),t.i&=-517},lt=()=>{m((()=>(t=>{const n=a.ce("appload",{detail:{namespace:"g-ui"}});return t.dispatchEvent(n),n})(i)))},ct=(t,n,e,o)=>{if(t&&t[n])try{return t[n](e)}catch(t){l(t,o)}},it=t=>t.classList.add("hydrated"),st=(t,n,e,r)=>{const c=o(t);if(!c)return;const i=t,s=c.l.get(n),a=c.i,b=i;if(!((e=W(e,r.t[n][0]))===s||Number.isNaN(s)&&Number.isNaN(e))){if(c.l.set(n,e),r.L){const t=r.L[n];t&&t.map((t=>{try{const[[o,r]]=Object.entries(t);(128&a||1&r)&&(b?b[o](e,s,n):c.W.push((()=>{c.D[o](e,s,n)})))}catch(t){l(t,i)}}))}if(2&a){if(b.componentShouldUpdate&&!1===b.componentShouldUpdate(e,s,n)&&!(16&a))return;16&a||Q(c,!1)}}},at=(n,e)=>{var r,l;const c=n.prototype;{n.watchers&&!e.L&&(e.L=L(n.watchers)),n.deserializers&&!e.H&&(e.H=n.deserializers),n.serializers&&!e.I&&(e.I=n.serializers);const i=Object.entries(null!=(r=e.t)?r:{});i.map((([n,[r]])=>{if(31&r||32&r){const{get:l,set:i}=t(c,n)||{};l&&(e.t[n][0]|=2048),i&&(e.t[n][0]|=4096),Object.defineProperty(c,n,{get(){return l?l.apply(this):((t,n)=>o(this).l.get(n))(0,n)},configurable:!0,enumerable:!0}),Object.defineProperty(c,n,{set(t){const l=o(this);if(l){if(i)return void 0===(32&r?this[n]:l.$hostElement$[n])&&l.l.get(n)&&(t=l.l.get(n)),i.call(this,W(t,r)),void st(this,n,t=32&r?this[n]:l.$hostElement$[n],e);st(this,n,t,e)}}})}}));{const t=new Map;c.attributeChangedCallback=function(n,r,l){a.jmp((()=>{var s;const a=t.get(n),b=o(this);if(this.hasOwnProperty(a),c.hasOwnProperty(a)&&"number"==typeof this[a]&&this[a]==l)return;if(null==a){const t=null==b?void 0:b.i;if(b&&t&&!(8&t)&&l!==r){const o=this,c=null==(s=e.L)?void 0:s[n];null==c||c.forEach((e=>{const[[c,i]]=Object.entries(e);null!=o[c]&&(128&t||1&i)&&o[c].call(o,l,r,n)}))}return}const u=i.find((([t])=>t===a)),f=u&&4&u[1][0],d=f&&null===l&&void 0===this[a];f&&(l=null!==l&&"false"!==l);const g=Object.getOwnPropertyDescriptor(c,a);d||l==this[a]||g.get&&!g.set||(this[a]=l)}))},n.observedAttributes=Array.from(new Set([...Object.keys(null!=(l=e.L)?l:{}),...i.filter((([t,n])=>31&n[0])).map((([n,e])=>{const o=e[1]||n;return t.set(o,n),o}))]))}}return n},bt=(t,n)=>{const r={i:n[0],h:n[1]};try{r.t=n[2],r.L=L(t.L),r.H=t.H,r.I=t.I;const i=t.prototype.connectedCallback,s=t.prototype.disconnectedCallback;return Object.assign(t.prototype,{__hasHostListenerAttached:!1,__registerHost(){((t,n)=>{const o={i:0,$hostElement$:t,o:n,l:new Map,P:new Map};o.R=new Promise((t=>o.C=t)),t["s-p"]=[],t["s-rc"]=[];const r=o;t.__stencil__getHostRef=()=>r,512&n.i&&e(t,o)})(this,r)},connectedCallback(){if(!this.__hasHostListenerAttached){if(!o(this))return;this.__hasHostListenerAttached=!0}(t=>{if(!(1&a.i)){const n=o(t);if(!n)return;const e=n.o,r=()=>{};if(1&n.i)(null==n?void 0:n.D)||(null==n?void 0:n.R)&&n.R.then((()=>{}));else{n.i|=1;{let e=t;for(;e=e.parentNode||e.host;)if(e["s-p"]){K(n,n.A=e);break}}e.t&&Object.entries(e.t).map((([n,[e]])=>{if(31&e&&Object.prototype.hasOwnProperty.call(t,n)){const e=t[n];delete t[n],t[n]=e}})),(async(t,n,e)=>{let o;try{if(!(32&n.i)&&(n.i|=32,o=t.constructor,customElements.whenDefined(t.localName).then((()=>n.i|=128)),o&&o.style)){let t;"string"==typeof o.style&&(t=o.style);const n=S(e);if(!c.has(n)){const o=()=>{};((t,n,e)=>{let o=c.get(t);b&&e?(o=o||new CSSStyleSheet,"string"==typeof o?o=n:o.replaceSync(n)):o=n,c.set(t,o)})(n,t,!!(1&e.i)),o()}}const r=n.A,l=()=>Q(n,!0);r&&r["s-rc"]?r["s-rc"].push(l):l()}catch(e){l(e,t),n._&&(n._(),n._=void 0),n.C&&n.C(t)}})(t,n,e)}r()}})(this),i&&i.call(this)},disconnectedCallback(){(async t=>{j.has(t)&&j.delete(t),t.shadowRoot&&j.has(t.shadowRoot)&&j.delete(t.shadowRoot)})(this),s&&s.call(this)},__attachShadow(){if(this.shadowRoot){if("open"!==this.shadowRoot.mode)throw Error(`Unable to re-use existing shadow root for ${r.h}! Mode is set to ${this.shadowRoot.mode} but Stencil only supports open shadow roots.`)}else w.call(this,r)}}),Object.defineProperty(t,"is",{value:r.h,configurable:!0}),at(t,r)}catch(n){return l(n),t}},ut=t=>a.M=t,ft=t=>Object.assign(a,t),dt=new WeakMap;function gt(t,n){let e=dt.get(n);e||(e={i:0,o:{i:0,h:n.tagName},$hostElement$:n},dt.set(n,e)),J(e,t)}const ht=bt(class extends s{constructor(t){super(),!1!==t&&this.__registerHost(),this.__attachShadow(),this.type="primary",this.size="md",this.plain=!1,this.text=!1,this.bg=!1,this.link=!1,this.round=!1,this.circle=!1,this.dashed=!1,this.loading=!1,this.loadingIcon="●",this.disabled=!1,this.autofocus=!1,this.nativeType="button",this.autoInsertSpace=!1,this.dark=!1,this.tag="button",this.shouldAddSpace=!1,this.handleClick=t=>{(this.loading||this.disabled)&&(t.preventDefault(),t.stopPropagation())}}checkAutoSpace(){this.shouldAddSpace=!(!this.autoInsertSpace||!this.label)&&2===this.label.length&&/^[\u4e00-\u9fa5]+$/.test(this.label)}componentWillLoad(){this.checkAutoSpace()}get computedClass(){const{type:t,size:n,plain:e,text:o,bg:r,link:l,round:c,circle:i,dashed:s,loading:a,disabled:b,dark:u}=this,f=["btn","btn--"+t,"btn--"+n];return e&&f.push("btn--plain"),o&&f.push("btn--text"),r&&f.push("btn--bg"),l&&f.push("btn--link"),c&&f.push("btn--round"),i&&f.push("btn--circle"),s&&f.push("btn--dashed"),a&&f.push("btn--loading"),b&&f.push("btn--disabled"),u&&f.push("btn--dark"),f.join(" ")}get customStyle(){return this.color?{"--g-btn-color":this.color}:{}}render(){const{loading:t,disabled:n,autofocus:e,nativeType:o,icon:r,label:l,tag:c,loadingIcon:i,shouldAddSpace:s}=this,a=s?l.split("").join(" "):l,b=_(_.Fragment,null,t&&_("span",{key:"d4c9186587c2e95fe3beb90884d37d82cc80a25f",class:"btn__loading-icon"},i),!t&&r&&_("span",{key:"7bbbb86a286ba64aef939605b55f82f104eb9184",class:"btn__icon"},r),a&&_("span",{key:"81cd63a88a02e1f186fda9175fcb27fc9deadd0a",class:"btn__label"},a),_("slot",{key:"a657cd0ddb7784909bb5a2df3648cda59d3e71e2"}));return _(c,{key:"a7afac4641f1d19d513e95200f24bd3bccc48b50",class:this.computedClass,disabled:"button"===c?n||t:void 0,type:"button"===c?o:void 0,autofocus:"button"===c?e:void 0,style:this.customStyle,onClick:this.handleClick},b)}static get watchers(){return{label:[{checkAutoSpace:0}],autoInsertSpace:[{checkAutoSpace:0}]}}static get style(){return":host{display:inline-block}:host(:not(:first-child)){margin-left:12px}:host{--g-btn-color:#4f46e5;--g-btn-color-hover:#4338ca;--g-btn-color-active:#3730a3;--g-btn-text-color:#fff;--g-btn-plain-bg:#eef2ff}.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.25em;border:1px solid var(--g-btn-color);border-radius:6px;font-family:inherit;font-weight:600;line-height:1;cursor:pointer;user-select:none;transition:all 0.2s ease;background-color:var(--g-btn-color);color:var(--g-btn-text-color);vertical-align:middle;text-decoration:none;white-space:nowrap}.btn:hover{background-color:var(--g-btn-color-hover);border-color:var(--g-btn-color-hover)}.btn:active{background-color:var(--g-btn-color-active);border-color:var(--g-btn-color-active)}.btn:disabled,.btn--disabled{opacity:0.5;cursor:not-allowed;pointer-events:none}.btn--sm{padding:0.375rem 0.75rem;font-size:0.875rem}.btn--md{padding:0.5rem 1rem;font-size:1rem}.btn--lg{padding:0.75rem 1.5rem;font-size:1.125rem}.btn--primary{--g-btn-color:#4f46e5;--g-btn-color-hover:#4338ca;--g-btn-color-active:#3730a3;--g-btn-plain-bg:#eef2ff}.btn--success{--g-btn-color:#10b981;--g-btn-color-hover:#059669;--g-btn-color-active:#047857;--g-btn-plain-bg:#d1fae5}.btn--warning{--g-btn-color:#f59e0b;--g-btn-color-hover:#d97706;--g-btn-color-active:#b45309;--g-btn-plain-bg:#fef3c7}.btn--danger{--g-btn-color:#ef4444;--g-btn-color-hover:#dc2626;--g-btn-color-active:#b91c1c;--g-btn-plain-bg:#fee2e2}.btn--info,.btn--secondary{--g-btn-color:#6b7280;--g-btn-color-hover:#4b5563;--g-btn-color-active:#374151;--g-btn-plain-bg:#f3f4f6}.btn--plain{background-color:transparent;color:var(--g-btn-color)}.btn--plain:hover{background-color:var(--g-btn-plain-bg);color:var(--g-btn-color-hover);border-color:var(--g-btn-color-hover)}.btn--plain:active{background-color:var(--g-btn-plain-bg);color:var(--g-btn-color-active);border-color:var(--g-btn-color-active)}.btn--text{border-color:transparent;background-color:transparent;color:var(--g-btn-color)}.btn--text:hover{background-color:transparent;color:var(--g-btn-color-hover);border-color:transparent}.btn--text:active{color:var(--g-btn-color-active)}.btn--text.btn--bg:hover{background-color:var(--g-btn-plain-bg)}.btn--link{border-color:transparent;background-color:transparent;color:var(--g-btn-color);padding:0;font-weight:400}.btn--link:hover{background-color:transparent;color:var(--g-btn-color-hover);border-color:transparent;text-decoration:underline}.btn--link:active{color:var(--g-btn-color-active)}.btn--round{border-radius:9999px}.btn--circle{border-radius:50%;padding:0.5rem;width:2.5rem;height:2.5rem}.btn--circle.btn--sm{width:2rem;height:2rem;padding:0.375rem}.btn--circle.btn--lg{width:3rem;height:3rem;padding:0.75rem}.btn--dashed{border-style:dashed;background-color:color-mix(in srgb, var(--g-btn-color) 10%, transparent)}.btn--dashed:hover{background-color:color-mix(in srgb, var(--g-btn-color) 20%, transparent)}.btn--loading{cursor:wait;opacity:0.8}.btn__loading-icon{display:inline-flex;animation:g-spin 1s linear infinite}@keyframes g-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.btn__icon{display:inline-flex;font-size:1.1em}.btn__label{display:inline-flex;align-items:center}.btn--dark{--g-btn-color:#818cf8;--g-btn-color-hover:#6366f1;--g-btn-color-active:#4f46e5;--g-btn-plain-bg:#1e1b4b;--g-btn-text-color:#0f0f0f}.btn--dark.btn--plain{background-color:transparent;color:var(--g-btn-color);border-color:var(--g-btn-color)}.btn--dark.btn--text,.btn--dark.btn--link{color:var(--g-btn-color)}:host([style*='--g-btn-color']) .btn{background-color:var(--g-btn-color);border-color:var(--g-btn-color);color:var(--g-btn-text-color, #fff)}:host([style*='--g-btn-color']) .btn.btn--plain{background-color:transparent;color:var(--g-btn-color)}:host([style*='--g-btn-color']) .btn.btn--text,:host([style*='--g-btn-color']) .btn.btn--link{background-color:transparent;border-color:transparent;color:var(--g-btn-color)}"}},[257,"g-button",{type:[1],size:[1],plain:[4],text:[4],bg:[4],link:[4],round:[4],circle:[4],dashed:[4],loading:[4],loadingIcon:[1,"loading-icon"],disabled:[4],icon:[1],autofocus:[4],nativeType:[1,"native-type"],autoInsertSpace:[4,"auto-insert-space"],color:[1],dark:[4],tag:[1],label:[1],shouldAddSpace:[32]},void 0,{label:[{checkAutoSpace:0}],autoInsertSpace:[{checkAutoSpace:0}]}]);function pt(){"undefined"!=typeof customElements&&["g-button"].forEach((t=>{"g-button"===t&&(customElements.get(t)||customElements.define(t,ht))}))}pt();export{ht as GButton,pt as d,k as getAssetPath,gt as render,$ as setAssetPath,ut as setNonce,ft as setPlatformOptions}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export { GButton as g_button } from './index.js';
|
|
2
2
|
import './index-BVAZCj8P.js';
|
package/dist/esm/index.js
CHANGED
|
@@ -2,7 +2,7 @@ import { r as registerInstance, h } from './index-BVAZCj8P.js';
|
|
|
2
2
|
|
|
3
3
|
const gButtonCss = () => `:host{display:inline-block}:host(:not(:first-child)){margin-left:12px}:host{--g-btn-color:#4f46e5;--g-btn-color-hover:#4338ca;--g-btn-color-active:#3730a3;--g-btn-text-color:#fff;--g-btn-plain-bg:#eef2ff}.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.25em;border:1px solid var(--g-btn-color);border-radius:6px;font-family:inherit;font-weight:600;line-height:1;cursor:pointer;user-select:none;transition:all 0.2s ease;background-color:var(--g-btn-color);color:var(--g-btn-text-color);vertical-align:middle;text-decoration:none;white-space:nowrap}.btn:hover{background-color:var(--g-btn-color-hover);border-color:var(--g-btn-color-hover)}.btn:active{background-color:var(--g-btn-color-active);border-color:var(--g-btn-color-active)}.btn:disabled,.btn--disabled{opacity:0.5;cursor:not-allowed;pointer-events:none}.btn--sm{padding:0.375rem 0.75rem;font-size:0.875rem}.btn--md{padding:0.5rem 1rem;font-size:1rem}.btn--lg{padding:0.75rem 1.5rem;font-size:1.125rem}.btn--primary{--g-btn-color:#4f46e5;--g-btn-color-hover:#4338ca;--g-btn-color-active:#3730a3;--g-btn-plain-bg:#eef2ff}.btn--success{--g-btn-color:#10b981;--g-btn-color-hover:#059669;--g-btn-color-active:#047857;--g-btn-plain-bg:#d1fae5}.btn--warning{--g-btn-color:#f59e0b;--g-btn-color-hover:#d97706;--g-btn-color-active:#b45309;--g-btn-plain-bg:#fef3c7}.btn--danger{--g-btn-color:#ef4444;--g-btn-color-hover:#dc2626;--g-btn-color-active:#b91c1c;--g-btn-plain-bg:#fee2e2}.btn--info,.btn--secondary{--g-btn-color:#6b7280;--g-btn-color-hover:#4b5563;--g-btn-color-active:#374151;--g-btn-plain-bg:#f3f4f6}.btn--plain{background-color:transparent;color:var(--g-btn-color)}.btn--plain:hover{background-color:var(--g-btn-plain-bg);color:var(--g-btn-color-hover);border-color:var(--g-btn-color-hover)}.btn--plain:active{background-color:var(--g-btn-plain-bg);color:var(--g-btn-color-active);border-color:var(--g-btn-color-active)}.btn--text{border-color:transparent;background-color:transparent;color:var(--g-btn-color)}.btn--text:hover{background-color:transparent;color:var(--g-btn-color-hover);border-color:transparent}.btn--text:active{color:var(--g-btn-color-active)}.btn--text.btn--bg:hover{background-color:var(--g-btn-plain-bg)}.btn--link{border-color:transparent;background-color:transparent;color:var(--g-btn-color);padding:0;font-weight:400}.btn--link:hover{background-color:transparent;color:var(--g-btn-color-hover);border-color:transparent;text-decoration:underline}.btn--link:active{color:var(--g-btn-color-active)}.btn--round{border-radius:9999px}.btn--circle{border-radius:50%;padding:0.5rem;width:2.5rem;height:2.5rem}.btn--circle.btn--sm{width:2rem;height:2rem;padding:0.375rem}.btn--circle.btn--lg{width:3rem;height:3rem;padding:0.75rem}.btn--dashed{border-style:dashed;background-color:color-mix(in srgb, var(--g-btn-color) 10%, transparent)}.btn--dashed:hover{background-color:color-mix(in srgb, var(--g-btn-color) 20%, transparent)}.btn--loading{cursor:wait;opacity:0.8}.btn__loading-icon{display:inline-flex;animation:g-spin 1s linear infinite}@keyframes g-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.btn__icon{display:inline-flex;font-size:1.1em}.btn__label{display:inline-flex;align-items:center}.btn--dark{--g-btn-color:#818cf8;--g-btn-color-hover:#6366f1;--g-btn-color-active:#4f46e5;--g-btn-plain-bg:#1e1b4b;--g-btn-text-color:#0f0f0f}.btn--dark.btn--plain{background-color:transparent;color:var(--g-btn-color);border-color:var(--g-btn-color)}.btn--dark.btn--text,.btn--dark.btn--link{color:var(--g-btn-color)}:host([style*='--g-btn-color']) .btn{background-color:var(--g-btn-color);border-color:var(--g-btn-color);color:var(--g-btn-text-color, #fff)}:host([style*='--g-btn-color']) .btn.btn--plain{background-color:transparent;color:var(--g-btn-color)}:host([style*='--g-btn-color']) .btn.btn--text,:host([style*='--g-btn-color']) .btn.btn--link{background-color:transparent;border-color:transparent;color:var(--g-btn-color)}`;
|
|
4
4
|
|
|
5
|
-
const
|
|
5
|
+
const GButton = class {
|
|
6
6
|
constructor(hostRef) {
|
|
7
7
|
registerInstance(this, hostRef);
|
|
8
8
|
this.type = 'primary';
|
|
@@ -75,8 +75,8 @@ const MyButton = class {
|
|
|
75
75
|
render() {
|
|
76
76
|
const { loading, disabled, autofocus, nativeType, icon, label, tag: Tag, loadingIcon, shouldAddSpace, } = this;
|
|
77
77
|
const displayLabel = shouldAddSpace ? label.split('').join('\u2009') : label;
|
|
78
|
-
const content = (h(h.Fragment, null, loading && h("span", { key: '
|
|
79
|
-
return (h(Tag, { key: '
|
|
78
|
+
const content = (h(h.Fragment, null, loading && h("span", { key: 'd4c9186587c2e95fe3beb90884d37d82cc80a25f', class: "btn__loading-icon" }, loadingIcon), !loading && icon && h("span", { key: '7bbbb86a286ba64aef939605b55f82f104eb9184', class: "btn__icon" }, icon), displayLabel && h("span", { key: '81cd63a88a02e1f186fda9175fcb27fc9deadd0a', class: "btn__label" }, displayLabel), h("slot", { key: 'a657cd0ddb7784909bb5a2df3648cda59d3e71e2' })));
|
|
79
|
+
return (h(Tag, { key: 'a7afac4641f1d19d513e95200f24bd3bccc48b50', class: this.computedClass, disabled: Tag === 'button' ? (disabled || loading) : undefined, type: Tag === 'button' ? nativeType : undefined, autofocus: Tag === 'button' ? autofocus : undefined, style: this.customStyle, onClick: this.handleClick }, content));
|
|
80
80
|
}
|
|
81
81
|
static get watchers() { return {
|
|
82
82
|
"label": [{
|
|
@@ -87,6 +87,6 @@ const MyButton = class {
|
|
|
87
87
|
}]
|
|
88
88
|
}; }
|
|
89
89
|
};
|
|
90
|
-
|
|
90
|
+
GButton.style = gButtonCss();
|
|
91
91
|
|
|
92
|
-
export {
|
|
92
|
+
export { GButton };
|
package/dist/g-ui/g-ui.esm.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as a,b as e}from"./p-BVAZCj8P.js";export{s as setNonce}from"./p-BVAZCj8P.js";import{g as o}from"./p-DQuL1Twl.js";(()=>{const e=import.meta.url,o={};return""!==e&&(o.resourcesUrl=new URL(".",e).href),a(o)})().then((async a=>(await o(),e([["p-
|
|
1
|
+
import{p as a,b as e}from"./p-BVAZCj8P.js";export{s as setNonce}from"./p-BVAZCj8P.js";import{g as o}from"./p-DQuL1Twl.js";(()=>{const e=import.meta.url,o={};return""!==e&&(o.resourcesUrl=new URL(".",e).href),a(o)})().then((async a=>(await o(),e([["p-c94ef193",[[257,"g-button",{type:[1],size:[1],plain:[4],text:[4],bg:[4],link:[4],round:[4],circle:[4],dashed:[4],loading:[4],loadingIcon:[1,"loading-icon"],disabled:[4],icon:[1],autofocus:[4],nativeType:[1,"native-type"],autoInsertSpace:[4,"auto-insert-space"],color:[1],dark:[4],tag:[1],label:[1],shouldAddSpace:[32]},null,{label:[{checkAutoSpace:0}],autoInsertSpace:[{checkAutoSpace:0}]}]]]],a))));
|
package/dist/g-ui/index.esm.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import{r as t,h as o}from"./p-BVAZCj8P.js";const r=class{constructor(o){t(this,o),this.type="primary",this.size="md",this.plain=!1,this.text=!1,this.bg=!1,this.link=!1,this.round=!1,this.circle=!1,this.dashed=!1,this.loading=!1,this.loadingIcon="●",this.disabled=!1,this.autofocus=!1,this.nativeType="button",this.autoInsertSpace=!1,this.dark=!1,this.tag="button",this.shouldAddSpace=!1,this.handleClick=t=>{(this.loading||this.disabled)&&(t.preventDefault(),t.stopPropagation())}}checkAutoSpace(){this.shouldAddSpace=!(!this.autoInsertSpace||!this.label)&&2===this.label.length&&/^[\u4e00-\u9fa5]+$/.test(this.label)}componentWillLoad(){this.checkAutoSpace()}get computedClass(){const{type:t,size:o,plain:r,text:n,bg:e,link:a,round:
|
|
1
|
+
import{r as t,h as o}from"./p-BVAZCj8P.js";const r=class{constructor(o){t(this,o),this.type="primary",this.size="md",this.plain=!1,this.text=!1,this.bg=!1,this.link=!1,this.round=!1,this.circle=!1,this.dashed=!1,this.loading=!1,this.loadingIcon="●",this.disabled=!1,this.autofocus=!1,this.nativeType="button",this.autoInsertSpace=!1,this.dark=!1,this.tag="button",this.shouldAddSpace=!1,this.handleClick=t=>{(this.loading||this.disabled)&&(t.preventDefault(),t.stopPropagation())}}checkAutoSpace(){this.shouldAddSpace=!(!this.autoInsertSpace||!this.label)&&2===this.label.length&&/^[\u4e00-\u9fa5]+$/.test(this.label)}componentWillLoad(){this.checkAutoSpace()}get computedClass(){const{type:t,size:o,plain:r,text:n,bg:e,link:a,round:b,circle:c,dashed:l,loading:i,disabled:s,dark:d}=this,g=["btn",`btn--${t}`,`btn--${o}`];return r&&g.push("btn--plain"),n&&g.push("btn--text"),e&&g.push("btn--bg"),a&&g.push("btn--link"),b&&g.push("btn--round"),c&&g.push("btn--circle"),l&&g.push("btn--dashed"),i&&g.push("btn--loading"),s&&g.push("btn--disabled"),d&&g.push("btn--dark"),g.join(" ")}get customStyle(){return this.color?{"--g-btn-color":this.color}:{}}render(){const{loading:t,disabled:r,autofocus:n,nativeType:e,icon:a,label:b,tag:c,loadingIcon:l,shouldAddSpace:i}=this,s=i?b.split("").join(" "):b,d=o(o.Fragment,null,t&&o("span",{key:"d4c9186587c2e95fe3beb90884d37d82cc80a25f",class:"btn__loading-icon"},l),!t&&a&&o("span",{key:"7bbbb86a286ba64aef939605b55f82f104eb9184",class:"btn__icon"},a),s&&o("span",{key:"81cd63a88a02e1f186fda9175fcb27fc9deadd0a",class:"btn__label"},s),o("slot",{key:"a657cd0ddb7784909bb5a2df3648cda59d3e71e2"}));return o(c,{key:"a7afac4641f1d19d513e95200f24bd3bccc48b50",class:this.computedClass,disabled:"button"===c?r||t:void 0,type:"button"===c?e:void 0,autofocus:"button"===c?n:void 0,style:this.customStyle,onClick:this.handleClick},d)}static get watchers(){return{label:[{checkAutoSpace:0}],autoInsertSpace:[{checkAutoSpace:0}]}}};r.style=":host{display:inline-block}:host(:not(:first-child)){margin-left:12px}:host{--g-btn-color:#4f46e5;--g-btn-color-hover:#4338ca;--g-btn-color-active:#3730a3;--g-btn-text-color:#fff;--g-btn-plain-bg:#eef2ff}.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.25em;border:1px solid var(--g-btn-color);border-radius:6px;font-family:inherit;font-weight:600;line-height:1;cursor:pointer;user-select:none;transition:all 0.2s ease;background-color:var(--g-btn-color);color:var(--g-btn-text-color);vertical-align:middle;text-decoration:none;white-space:nowrap}.btn:hover{background-color:var(--g-btn-color-hover);border-color:var(--g-btn-color-hover)}.btn:active{background-color:var(--g-btn-color-active);border-color:var(--g-btn-color-active)}.btn:disabled,.btn--disabled{opacity:0.5;cursor:not-allowed;pointer-events:none}.btn--sm{padding:0.375rem 0.75rem;font-size:0.875rem}.btn--md{padding:0.5rem 1rem;font-size:1rem}.btn--lg{padding:0.75rem 1.5rem;font-size:1.125rem}.btn--primary{--g-btn-color:#4f46e5;--g-btn-color-hover:#4338ca;--g-btn-color-active:#3730a3;--g-btn-plain-bg:#eef2ff}.btn--success{--g-btn-color:#10b981;--g-btn-color-hover:#059669;--g-btn-color-active:#047857;--g-btn-plain-bg:#d1fae5}.btn--warning{--g-btn-color:#f59e0b;--g-btn-color-hover:#d97706;--g-btn-color-active:#b45309;--g-btn-plain-bg:#fef3c7}.btn--danger{--g-btn-color:#ef4444;--g-btn-color-hover:#dc2626;--g-btn-color-active:#b91c1c;--g-btn-plain-bg:#fee2e2}.btn--info,.btn--secondary{--g-btn-color:#6b7280;--g-btn-color-hover:#4b5563;--g-btn-color-active:#374151;--g-btn-plain-bg:#f3f4f6}.btn--plain{background-color:transparent;color:var(--g-btn-color)}.btn--plain:hover{background-color:var(--g-btn-plain-bg);color:var(--g-btn-color-hover);border-color:var(--g-btn-color-hover)}.btn--plain:active{background-color:var(--g-btn-plain-bg);color:var(--g-btn-color-active);border-color:var(--g-btn-color-active)}.btn--text{border-color:transparent;background-color:transparent;color:var(--g-btn-color)}.btn--text:hover{background-color:transparent;color:var(--g-btn-color-hover);border-color:transparent}.btn--text:active{color:var(--g-btn-color-active)}.btn--text.btn--bg:hover{background-color:var(--g-btn-plain-bg)}.btn--link{border-color:transparent;background-color:transparent;color:var(--g-btn-color);padding:0;font-weight:400}.btn--link:hover{background-color:transparent;color:var(--g-btn-color-hover);border-color:transparent;text-decoration:underline}.btn--link:active{color:var(--g-btn-color-active)}.btn--round{border-radius:9999px}.btn--circle{border-radius:50%;padding:0.5rem;width:2.5rem;height:2.5rem}.btn--circle.btn--sm{width:2rem;height:2rem;padding:0.375rem}.btn--circle.btn--lg{width:3rem;height:3rem;padding:0.75rem}.btn--dashed{border-style:dashed;background-color:color-mix(in srgb, var(--g-btn-color) 10%, transparent)}.btn--dashed:hover{background-color:color-mix(in srgb, var(--g-btn-color) 20%, transparent)}.btn--loading{cursor:wait;opacity:0.8}.btn__loading-icon{display:inline-flex;animation:g-spin 1s linear infinite}@keyframes g-spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.btn__icon{display:inline-flex;font-size:1.1em}.btn__label{display:inline-flex;align-items:center}.btn--dark{--g-btn-color:#818cf8;--g-btn-color-hover:#6366f1;--g-btn-color-active:#4f46e5;--g-btn-plain-bg:#1e1b4b;--g-btn-text-color:#0f0f0f}.btn--dark.btn--plain{background-color:transparent;color:var(--g-btn-color);border-color:var(--g-btn-color)}.btn--dark.btn--text,.btn--dark.btn--link{color:var(--g-btn-color)}:host([style*='--g-btn-color']) .btn{background-color:var(--g-btn-color);border-color:var(--g-btn-color);color:var(--g-btn-text-color, #fff)}:host([style*='--g-btn-color']) .btn.btn--plain{background-color:transparent;color:var(--g-btn-color)}:host([style*='--g-btn-color']) .btn.btn--text,:host([style*='--g-btn-color']) .btn.btn--link{background-color:transparent;border-color:transparent;color:var(--g-btn-color)}";export{r as GButton}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export{GButton as g_button}from"./index.esm.js";import"./p-BVAZCj8P.js";
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export type ButtonType = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'secondary';
|
|
2
2
|
export type ButtonSize = 'sm' | 'md' | 'lg';
|
|
3
3
|
export type NativeButtonType = 'button' | 'submit' | 'reset';
|
|
4
|
-
export declare class
|
|
4
|
+
export declare class GButton {
|
|
5
5
|
type: ButtonType;
|
|
6
6
|
size: ButtonSize;
|
|
7
7
|
plain: boolean;
|
package/dist/types/index.d.ts
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export {
|
|
1
|
+
export { GButton } from './components/g-button/g-button';
|
|
2
2
|
export type { ButtonType, ButtonSize, NativeButtonType } from './components/g-button/g-button';
|
package/package.json
CHANGED
|
@@ -1,30 +1,40 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "g-ui-core",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.11",
|
|
4
4
|
"description": "G-UI Web Components built with Stencil",
|
|
5
5
|
"main": "dist/index.cjs.js",
|
|
6
6
|
"module": "dist/index.js",
|
|
7
7
|
"es2015": "dist/esm/index.js",
|
|
8
8
|
"es2017": "dist/esm/index.js",
|
|
9
|
-
"types": "
|
|
9
|
+
"types": "types.d.ts",
|
|
10
10
|
"collection": "dist/collection/collection-manifest.json",
|
|
11
11
|
"collection:main": "dist/collection/index.js",
|
|
12
12
|
"unpkg": "dist/g-ui/g-ui.esm.js",
|
|
13
13
|
"files": [
|
|
14
14
|
"dist/",
|
|
15
15
|
"loader/",
|
|
16
|
-
"vue/"
|
|
16
|
+
"vue/",
|
|
17
|
+
"types.d.ts"
|
|
17
18
|
],
|
|
18
19
|
"exports": {
|
|
19
20
|
".": {
|
|
20
21
|
"import": "./dist/index.js",
|
|
21
22
|
"require": "./dist/index.cjs.js",
|
|
22
|
-
"types": "./
|
|
23
|
+
"types": "./types.d.ts"
|
|
24
|
+
},
|
|
25
|
+
"./loader": {
|
|
26
|
+
"import": "./loader/index.js",
|
|
27
|
+
"require": "./loader/index.cjs.js",
|
|
28
|
+
"types": "./loader/index.d.ts"
|
|
23
29
|
},
|
|
24
30
|
"./vue": {
|
|
25
|
-
"
|
|
26
|
-
"
|
|
27
|
-
|
|
31
|
+
"import": "./vue/index.js",
|
|
32
|
+
"types": "./vue/index.d.ts"
|
|
33
|
+
},
|
|
34
|
+
"./dist/*": "./dist/*",
|
|
35
|
+
"./dist/components": {
|
|
36
|
+
"types": "./dist/types/components.d.ts",
|
|
37
|
+
"default": "./dist/components/index.js"
|
|
28
38
|
}
|
|
29
39
|
},
|
|
30
40
|
"scripts": {
|
|
@@ -38,9 +48,12 @@
|
|
|
38
48
|
"storybook:dev": "concurrently -k -n stencil,sb -c cyan,magenta \"stencil build --watch\" \"storybook dev -p 6006\""
|
|
39
49
|
},
|
|
40
50
|
"dependencies": {
|
|
41
|
-
"@stencil/core": "^4.43.5"
|
|
51
|
+
"@stencil/core": "^4.43.5",
|
|
52
|
+
"@stencil/vue-output-target": "^0.14.0"
|
|
42
53
|
},
|
|
43
54
|
"devDependencies": {
|
|
55
|
+
"@stencil/react-output-target": "^1.6.0",
|
|
56
|
+
"@stencil/vue-output-target": "^0.14.0",
|
|
44
57
|
"@storybook/addon-docs": "^8.6.18",
|
|
45
58
|
"@storybook/addon-essentials": "^8.6.18",
|
|
46
59
|
"@storybook/web-components": "^8.6.18",
|
package/types.d.ts
ADDED
package/vue/index.d.ts
CHANGED
|
@@ -1,21 +1,17 @@
|
|
|
1
1
|
import type { AllowedComponentProps, ComponentCustomProps, VNodeProps } from 'vue'
|
|
2
|
-
import type {
|
|
2
|
+
import type { JSX } from 'g-ui-core'
|
|
3
3
|
|
|
4
|
-
|
|
5
|
-
type GButtonProps = Partial<Components.GButton> & { onClick?: (e: MouseEvent) => void }
|
|
4
|
+
type GButtonProps = JSX.GButton
|
|
6
5
|
|
|
7
|
-
export declare const
|
|
6
|
+
export declare const GButton: new () => {
|
|
8
7
|
$props: AllowedComponentProps & ComponentCustomProps & VNodeProps & GButtonProps
|
|
9
8
|
}
|
|
10
9
|
|
|
11
|
-
// Vue 插件
|
|
12
10
|
declare const plugin: { install: (app: any) => void }
|
|
13
11
|
export default plugin
|
|
14
12
|
|
|
15
|
-
// 增强 Vue 全局组件类型(Volar 智能提示)
|
|
16
13
|
declare module '@vue/runtime-core' {
|
|
17
14
|
export interface GlobalComponents {
|
|
18
|
-
GButton:
|
|
19
|
-
MyButton: Components.GButton
|
|
15
|
+
GButton: GButtonProps
|
|
20
16
|
}
|
|
21
17
|
}
|
package/vue/index.ts
CHANGED
|
@@ -1,13 +1,17 @@
|
|
|
1
|
-
import './
|
|
2
|
-
import
|
|
3
|
-
|
|
1
|
+
import './src/components'
|
|
2
|
+
import { defineCustomElements } from '../loader'
|
|
3
|
+
|
|
4
|
+
export function applyPolyfills() {
|
|
5
|
+
return Promise.resolve()
|
|
6
|
+
}
|
|
4
7
|
|
|
5
8
|
const plugin = {
|
|
6
9
|
install(app: any) {
|
|
7
10
|
const original = app.config?.compilerOptions?.isCustomElement
|
|
8
11
|
app.config.compilerOptions.isCustomElement = (tag: string) =>
|
|
9
12
|
tag.startsWith('g-') || (typeof original === 'function' && original(tag))
|
|
10
|
-
|
|
13
|
+
defineCustomElements()
|
|
14
|
+
},
|
|
11
15
|
}
|
|
12
16
|
|
|
13
17
|
export default plugin
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
/* eslint-disable */
|
|
2
|
+
/* tslint:disable */
|
|
3
|
+
/* auto-generated vue proxies */
|
|
4
|
+
import { defineContainer, type StencilVueComponent } from '@stencil/vue-output-target/runtime';
|
|
5
|
+
|
|
6
|
+
import type { JSX } from 'g-ui-core';
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
export const GButton: StencilVueComponent<JSX.GButton> = /*@__PURE__*/ defineContainer<JSX.GButton>('g-button', undefined, [
|
|
13
|
+
'type',
|
|
14
|
+
'size',
|
|
15
|
+
'plain',
|
|
16
|
+
'text',
|
|
17
|
+
'bg',
|
|
18
|
+
'link',
|
|
19
|
+
'round',
|
|
20
|
+
'circle',
|
|
21
|
+
'dashed',
|
|
22
|
+
'loading',
|
|
23
|
+
'loadingIcon',
|
|
24
|
+
'disabled',
|
|
25
|
+
'icon',
|
|
26
|
+
'autofocus',
|
|
27
|
+
'nativeType',
|
|
28
|
+
'autoInsertSpace',
|
|
29
|
+
'color',
|
|
30
|
+
'dark',
|
|
31
|
+
'tag',
|
|
32
|
+
'label'
|
|
33
|
+
]);
|
|
34
|
+
|
|
35
|
+
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export{MyButton as g_button}from"./index.esm.js";import"./p-BVAZCj8P.js";
|
package/vue/MyButton.ts
DELETED
|
@@ -1,45 +0,0 @@
|
|
|
1
|
-
import { defineComponent, h, type PropType } from 'vue'
|
|
2
|
-
|
|
3
|
-
import '../dist/components/g-button.js'
|
|
4
|
-
|
|
5
|
-
export type ButtonType = 'primary' | 'success' | 'warning' | 'danger' | 'info' | 'secondary'
|
|
6
|
-
export type ButtonSize = 'sm' | 'md' | 'lg'
|
|
7
|
-
export type NativeButtonType = 'button' | 'submit' | 'reset'
|
|
8
|
-
|
|
9
|
-
export default defineComponent({
|
|
10
|
-
name: 'GButton',
|
|
11
|
-
props: {
|
|
12
|
-
type: { type: String as PropType<ButtonType>, default: 'primary' },
|
|
13
|
-
size: { type: String as PropType<ButtonSize>, default: 'md' },
|
|
14
|
-
plain: Boolean,
|
|
15
|
-
text: Boolean,
|
|
16
|
-
bg: Boolean,
|
|
17
|
-
link: Boolean,
|
|
18
|
-
round: Boolean,
|
|
19
|
-
circle: Boolean,
|
|
20
|
-
dashed: Boolean,
|
|
21
|
-
loading: Boolean,
|
|
22
|
-
loadingIcon: { type: String, default: '●' },
|
|
23
|
-
disabled: Boolean,
|
|
24
|
-
icon: String,
|
|
25
|
-
autofocus: Boolean,
|
|
26
|
-
nativeType: { type: String as PropType<NativeButtonType>, default: 'button' },
|
|
27
|
-
autoInsertSpace: Boolean,
|
|
28
|
-
color: String,
|
|
29
|
-
dark: Boolean,
|
|
30
|
-
tag: { type: String, default: 'button' },
|
|
31
|
-
label: String
|
|
32
|
-
},
|
|
33
|
-
emits: ['click'],
|
|
34
|
-
setup(props, { slots, emit }) {
|
|
35
|
-
return () =>
|
|
36
|
-
h(
|
|
37
|
-
'g-button',
|
|
38
|
-
{
|
|
39
|
-
...props,
|
|
40
|
-
onClick: (e: MouseEvent) => emit('click', e)
|
|
41
|
-
},
|
|
42
|
-
slots.default?.()
|
|
43
|
-
)
|
|
44
|
-
}
|
|
45
|
-
})
|
package/vue/main.d.ts
DELETED