@illinois-grad/grad-vue 6.0.9 → 6.0.11

package/custom-elements.json

@@ -125,7 +125,7 @@
               "kind": "field",
               "name": "size",
               "type": {
-                "text": "\"small\" | \"medium\" | \"large\""
+                "text": "\"tiny\" | \"small\" | \"medium\" | \"large\""
               },
               "optional": true,
               "description": "Button size",
@@ -161,6 +161,16 @@
               "description": "Use text style",
               "default": "false"
             },
+            {
+              "kind": "field",
+              "name": "disabled",
+              "type": {
+                "text": "boolean"
+              },
+              "optional": true,
+              "description": "Prevent interaction with the button",
+              "default": "false"
+            },
             {
               "kind": "field",
               "name": "to",

package/dist/components/GButton.vue.d.ts

@@ -23,7 +23,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      * Button size
      * @demo
      */
-    size?: "small" | "medium" | "large";
+    size?: "tiny" | "small" | "medium" | "large";
     /**
      * Button color theme
      * @demo
@@ -39,6 +39,11 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      * @demo
      */
     text?: boolean;
+    /**
+     * Prevent interaction with the button
+     * @demo
+     */
+    disabled?: boolean;
     /**
      * The to target for when using the button as a router-link
      */
@@ -72,7 +77,7 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      * Button size
      * @demo
      */
-    size?: "small" | "medium" | "large";
+    size?: "tiny" | "small" | "medium" | "large";
     /**
      * Button color theme
      * @demo
@@ -88,6 +93,11 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      * @demo
      */
     text?: boolean;
+    /**
+     * Prevent interaction with the button
+     * @demo
+     */
+    disabled?: boolean;
     /**
      * The to target for when using the button as a router-link
      */
@@ -117,11 +127,12 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     onMouseenter?: ((...args: any[]) => any) | undefined;
     onMouseleave?: ((...args: any[]) => any) | undefined;
 }>, {
-    size: "small" | "medium" | "large";
+    size: "tiny" | "small" | "medium" | "large";
     type: "button" | "submit" | "reset";
     text: boolean;
     theme: "primary" | "secondary" | "accent" | "danger" | "none";
     outlined: boolean;
+    disabled: boolean;
     to: string | Record<string, any>;
     component: string;
     icon: string;

package/dist/components/GCurrencyInput.vue.d.ts

@@ -99,8 +99,8 @@ declare const __VLS_export: import("vue").DefineComponent<{
     placeholder: string;
     required: boolean;
     name: string;
+    disabled: boolean;
     instructions: string;
     errors: string[];
     formKey: string;
-    disabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/GDateInput.vue.d.ts

@@ -99,8 +99,8 @@ declare const __VLS_export: import("vue").DefineComponent<{
     placeholder: string;
     required: boolean;
     name: string;
+    disabled: boolean;
     instructions: string;
     errors: string[];
     formKey: string;
-    disabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/GDateRangeInput.vue.d.ts

@@ -120,10 +120,10 @@ declare const __VLS_export: import("vue").DefineComponent<{
     label: string;
     required: boolean;
     name: string;
+    disabled: boolean;
     instructions: string;
     errors: string[];
     formKey: string;
-    disabled: boolean;
     startLabel: string;
     endLabel: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/GEmailInput.vue.d.ts

@@ -87,7 +87,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     placeholder: string;
     required: boolean;
     name: string;
+    disabled: boolean;
     instructions: string;
     errors: string[];
-    disabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/GFileInput.vue.d.ts

@@ -131,8 +131,8 @@ declare const __VLS_export: import("vue").DefineComponent<{
     onChange?: ((files: File[]) => any) | undefined;
 }>, {
     required: boolean;
+    disabled: boolean;
     instructions: string;
     errors: string[];
-    disabled: boolean;
     multiple: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/GMultiSelect.vue.d.ts

@@ -147,8 +147,8 @@ declare const __VLS_export: import("vue").DefineComponent<{
     onChange?: ((value: (string | number)[]) => any) | undefined;
 }>, {
     required: boolean;
-    errors: string[];
     disabled: boolean;
+    errors: string[];
     hiddenLabel: boolean;
     searchDescription: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/GSelect.vue.d.ts

@@ -161,8 +161,8 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     "onUpdate:modelValue"?: ((value: string | number | null | undefined) => any) | undefined;
 }>, {
     required: boolean;
-    errors: string[];
     disabled: boolean;
+    errors: string[];
     searchDescription: boolean;
     searchable: boolean;
     compact: boolean;

package/dist/components/GSelectButton.vue.d.ts

@@ -105,7 +105,7 @@ declare const __VLS_export: import("vue").DefineComponent<{
     size: "small" | "medium" | "large";
     required: boolean;
     name: string;
+    disabled: boolean;
     errors: string[];
     formKey: string;
-    disabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;

package/dist/components/GSubmitButton.vue.d.ts

@@ -60,8 +60,8 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
      */
     formKey?: string;
 }> & Readonly<{}>, {
-    formKey: string;
     disabled: boolean;
+    formKey: string;
     variant: "primary" | "secondary" | "danger";
     loadingText: string;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>, {

package/dist/components/GTextInput.vue.d.ts

@@ -141,10 +141,10 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     placeholder: string;
     required: boolean;
     name: string;
+    disabled: boolean;
     instructions: string;
     errors: string[];
     formKey: string;
-    disabled: boolean;
     prefix: string;
     suffix: string;
     debounce: number;

package/dist/components/GTextarea.vue.d.ts

@@ -152,10 +152,10 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<{
     placeholder: string;
     required: boolean;
     name: string;
+    disabled: boolean;
     instructions: string;
     errors: string[];
     formKey: string;
-    disabled: boolean;
     readonly: boolean;
     rows: number;
     maxlength: number;

package/dist/{grad-vue-BvxFT_h2.js → grad-vue-BzzzfIfW.js}

@@ -34,6 +34,10 @@ var pe = { class: "g-btn--icon" }, me = { class: "g-btn--label" }, Q = /* @__PUR
 			type: Boolean,
 			default: !1
 		},
+		disabled: {
+			type: Boolean,
+			default: !1
+		},
 		to: { default: void 0 },
 		component: { default: void 0 },
 		icon: { default: void 0 },
@@ -50,45 +54,57 @@ var pe = { class: "g-btn--icon" }, me = { class: "g-btn--label" }, Q = /* @__PUR
 		"mouseenter",
 		"mouseleave"
 	],
-	setup(t) {
-		let n = t, a = z(), { forwardedAttrs: c } = fe({ omitInCustomElement: ["id"] }), l = r(() => [
+	setup(t, { emit: n }) {
+		let a = t, c = z(), l = n, { forwardedAttrs: u } = fe({ omitInCustomElement: ["id"] }), d = r(() => [
 			"g-btn",
-			`g-btn--${n.size}`,
-			`g-btn--${n.theme}`,
+			`g-btn--${a.size}`,
+			`g-btn--${a.theme}`,
 			{
-				"g-btn--outlined": n.outlined,
-				"g-btn--text": n.text,
-				"g-btn--primary": n.theme === "primary",
-				"g-btn--accent": n.theme === "accent",
-				"g-btn-has-text": n.text,
-				"g-btn-has-icon-class": n.icon,
-				"g-btn-has-icon-svg": !!a.icon
+				"g-btn--outlined": a.outlined,
+				"g-btn--text": a.text,
+				"g-btn--primary": a.theme === "primary",
+				"g-btn--accent": a.theme === "accent",
+				"g-btn-has-text": a.text,
+				"g-btn-has-icon-class": a.icon,
+				"g-btn-has-icon-svg": !!c.icon,
+				"g-btn--disabled": a.disabled
 			}
 		]);
-		return (r, u) => (S(), i(O(n.component ? n.component : "button"), m(F(c), {
-			to: n.to,
-			class: l.value,
-			type: n.to ? void 0 : n.type,
-			onClick: u[0] ||= (e) => r.$emit("click", e),
-			onFocus: u[1] ||= (e) => r.$emit("focus", e),
-			onBlur: u[2] ||= (e) => r.$emit("blur", e),
-			onKeydown: u[3] ||= (e) => r.$emit("keydown", e),
-			onKeyup: u[4] ||= (e) => r.$emit("keyup", e),
-			onMousedown: u[5] ||= (e) => r.$emit("mousedown", e),
-			onMouseup: u[6] ||= (e) => r.$emit("mouseup", e),
-			onMouseenter: u[7] ||= (e) => r.$emit("mouseenter", e),
-			onMouseleave: u[8] ||= (e) => r.$emit("mouseleave", e)
+		function f(e) {
+			if (a.disabled) {
+				e.preventDefault(), e.stopPropagation();
+				return;
+			}
+			l("click", e);
+		}
+		return (n, r) => (S(), i(O(a.component ? a.component : "button"), m(F(u), {
+			to: a.to,
+			class: d.value,
+			type: a.to ? void 0 : a.type,
+			disabled: a.disabled,
+			"aria-disabled": a.disabled || void 0,
+			onClick: f,
+			onFocus: r[0] ||= (e) => n.$emit("focus", e),
+			onBlur: r[1] ||= (e) => n.$emit("blur", e),
+			onKeydown: r[2] ||= (e) => n.$emit("keydown", e),
+			onKeyup: r[3] ||= (e) => n.$emit("keyup", e),
+			onMousedown: r[4] ||= (e) => n.$emit("mousedown", e),
+			onMouseup: r[5] ||= (e) => n.$emit("mouseup", e),
+			onMouseenter: r[6] ||= (e) => n.$emit("mouseenter", e),
+			onMouseleave: r[7] ||= (e) => n.$emit("mouseleave", e)
 		}), {
-			default: G(() => [t.icon || a.icon ? (S(), o(e, { key: 0 }, [s("span", pe, [a.icon ? D(r.$slots, "icon", {}, void 0, void 0, 0) : (S(), o("span", {
+			default: G(() => [t.icon || c.icon ? (S(), o(e, { key: 0 }, [s("span", pe, [c.icon ? D(n.$slots, "icon", {}, void 0, void 0, 0) : (S(), o("span", {
 				key: 1,
 				class: g(t.icon + " g-btn--icon-span"),
 				"aria-hidden": "true"
-			}, null, 2))]), s("span", me, [D(r.$slots, "default")])], 64)) : D(r.$slots, "default", {}, void 0, void 0, 1)]),
+			}, null, 2))]), s("span", me, [D(n.$slots, "default")])], 64)) : D(n.$slots, "default", {}, void 0, void 0, 1)]),
 			_: 3
 		}, 16, [
 			"to",
 			"class",
-			"type"
+			"type",
+			"disabled",
+			"aria-disabled"
 		]));
 	}
 }), he = { class: "g-tree-menu__divider" }, ge = {
@@ -5260,4 +5276,4 @@ function Wo(e, t) {
 //#endregion
 export { ht as $, li as A, An as B, La as C, ui as D, Ea as E, Rr as F, bn as G, Dn as H, Dr as I, rn as J, fn as K, dr as L, di as M, vi as N, ci as O, _i as P, St as Q, Xn as R, za as S, Ma as T, Cn as U, On as V, xn as W, Nt as X, qt as Y, Dt as Z, eo as _, Po as a, qe as at, qa as b, Mo as c, ke as ct, To as d, be as dt, st as et, yo as f, ye as ft, so as g, co as h, No as i, Ke as it, gi as j, hi as k, jo as l, De as lt, go as m, Ho as n, tt as nt, Fo as o, Re as ot, vo as p, Q as pt, sn as q, Io as r, et as rt, Vo as s, $ as st, Wo as t, nt as tt, Ao as u, Ee as ut, $a as v, Na as w, Ua as x, Qa as y, Fn as z };
 
-//# sourceMappingURL=grad-vue-BvxFT_h2.js.map
+//# sourceMappingURL=grad-vue-BzzzfIfW.js.map