@mekari/pixel3-button - npm Package Compare versions

Comparing version 0.1.8-dev.0 to 0.2.0-dev.1

dist/chunk-NT45ABTV.mjs

+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+
+// src/modules/button.props.ts
+var buttonProps = {
+  as: {
+    type: [String, Object],
+    default: "button"
+  },
+  size: {
+    type: String,
+    default: "md"
+  },
+  variant: {
+    type: String,
+    default: "primary"
+  },
+  isDisabled: {
+    type: Boolean,
+    default: false
+  },
+  isLoading: {
+    type: Boolean,
+    default: false
+  },
+  leftIcon: {
+    type: String
+  },
+  rightIcon: {
+    type: String
+  },
+  isFullWidth: {
+    type: Boolean,
+    default: false
+  },
+  isRounded: {
+    type: Boolean,
+    default: false
+  }
+};
+var buttonGroupProps = {
+  spacing: {
+    type: String,
+    default: "2"
+  },
+  isSplit: {
+    type: Boolean
+  }
+};
+
+export {
+  __name,
+  buttonProps,
+  buttonGroupProps
+};

dist/chunk-WNQOVJVI.mjs

+import {
+  __name,
+  buttonGroupProps,
+  buttonProps
+} from "./chunk-NT45ABTV.mjs";
+
+// src/button.tsx
+import { createVNode as _createVNode } from "vue";
+import { defineComponent, computed } from "vue";
+import { token } from "@mekari/pixel3-styled-system/tokens";
+import { buttonRecipe, buttonGroupRecipe } from "@mekari/pixel3-styled-system/recipes";
+import { MpIcon } from "@mekari/pixel3-icon";
+import { MpSpinner } from "@mekari/pixel3-spinner";
+var MpButton = defineComponent({
+  name: "MpButton",
+  props: buttonProps,
+  emits: ["click"],
+  setup(props, {
+    slots,
+    emit
+  }) {
+    const classes = computed(() => {
+      return buttonRecipe({
+        size: props.size,
+        variant: props.variant
+      });
+    });
+    const onClick = /* @__PURE__ */ __name((event) => {
+      if (props.isLoading) {
+        event.preventDefault();
+      } else if (!props.isDisabled) {
+        emit("click", event);
+      }
+    }, "onClick");
+    return () => {
+      const children = slots.default && slots.default();
+      const {
+        variant,
+        isDisabled,
+        isLoading,
+        leftIcon,
+        rightIcon,
+        isFullWidth,
+        isRounded
+      } = props;
+      const Component = props.as;
+      return _createVNode(Component, {
+        "class": classes.value,
+        "data-pixel-component": "MpButton",
+        "data-has-icon": variant !== "textLink" && (rightIcon || leftIcon) ? true : void 0,
+        "data-icon-position": rightIcon ? "right" : leftIcon ? "left" : void 0,
+        "data-has-label": variant !== "textLink" && children ? true : void 0,
+        "data-is-full-width": isFullWidth || void 0,
+        "data-is-rounded": isRounded || void 0,
+        "disabled": isDisabled || void 0,
+        "aria-disabled": isDisabled || void 0,
+        "onClick": onClick
+      }, {
+        default: () => [isLoading && !isDisabled && _createVNode("span", {
+          "data-loading": "true",
+          "data-is-rounded": isRounded || void 0
+        }, [_createVNode(MpSpinner, {
+          "color": "currentcolor"
+        }, null)]), leftIcon && _createVNode(MpIcon, {
+          "name": leftIcon,
+          "color": "currentcolor"
+        }, null), children, rightIcon && _createVNode(MpIcon, {
+          "name": rightIcon,
+          "color": "currentcolor"
+        }, null)]
+      });
+    };
+  }
+});
+var MpButtonGroup = defineComponent({
+  name: "MpButtonGroup",
+  props: buttonGroupProps,
+  setup(props, {
+    slots
+  }) {
+    const classes = buttonGroupRecipe();
+    return () => {
+      const children = slots.default && slots.default();
+      const {
+        spacing,
+        isSplit
+      } = props;
+      return _createVNode("div", {
+        "class": classes,
+        "data-pixel-component": "MpButtonGroup",
+        "data-split-button": isSplit ? true : void 0,
+        "style": {
+          "--mp-button-group-spacing": token(`spacing.${spacing}`) || spacing
+        }
+      }, [children]);
+    };
+  }
+});
+
+export {
+  MpButton,
+  MpButtonGroup
+};

dist/button.d.mts

@@ -38,2 +38,6 @@ import * as _mekari_pixel3_utils from '@mekari/pixel3-utils';
     };
+    isRounded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "click"[], "click", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
@@ -70,2 +74,6 @@ as: {
     };
+    isRounded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & {
@@ -80,2 +88,3 @@ onClick?: ((...args: any[]) => any) | undefined;
     isFullWidth: boolean;
+    isRounded: boolean;
 }, {}>;
@@ -82,0 +91,0 @@ declare const MpButtonGroup: vue.DefineComponent<{

dist/button.d.ts

@@ -38,2 +38,6 @@ import * as _mekari_pixel3_utils from '@mekari/pixel3-utils';
     };
+    isRounded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }, () => vue_jsx_runtime.JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, "click"[], "click", vue.PublicProps, Readonly<vue.ExtractPropTypes<{
@@ -70,2 +74,6 @@ as: {
     };
+    isRounded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & {
@@ -80,2 +88,3 @@ onClick?: ((...args: any[]) => any) | undefined;
     isFullWidth: boolean;
+    isRounded: boolean;
 }, {}>;
@@ -82,0 +91,0 @@ declare const MpButtonGroup: vue.DefineComponent<{

dist/button.js

@@ -66,2 +66,6 @@ "use strict";
     default: false
+  },
+  isRounded: {
+    type: Boolean,
+    default: false
   }
@@ -109,3 +113,4 @@ };
         rightIcon,
-        isFullWidth
+        isFullWidth,
+        isRounded
       } = props;
@@ -120,2 +125,3 @@ const Component = props.as;
         "data-is-full-width": isFullWidth || void 0,
+        "data-is-rounded": isRounded || void 0,
         "disabled": isDisabled || void 0,
@@ -126,3 +132,4 @@ "aria-disabled": isDisabled || void 0,
         default: () => [isLoading && !isDisabled && (0, import_vue.createVNode)("span", {
-          "data-loading": "true"
+          "data-loading": "true",
+          "data-is-rounded": isRounded || void 0
         }, [(0, import_vue.createVNode)(import_pixel3_spinner.MpSpinner, {
@@ -129,0 +136,0 @@ "color": "currentcolor"

dist/button.mjs

 import {
   MpButton,
   MpButtonGroup
-} from "./chunk-JIGNZFPU.mjs";
-import "./chunk-CHZ43RJA.mjs";
+} from "./chunk-WNQOVJVI.mjs";
+import "./chunk-NT45ABTV.mjs";
 export {
@@ -7,0 +7,0 @@ MpButton,

dist/index.js

@@ -68,2 +68,6 @@ "use strict";
     default: false
+  },
+  isRounded: {
+    type: Boolean,
+    default: false
   }
@@ -111,3 +115,4 @@ };
         rightIcon,
-        isFullWidth
+        isFullWidth,
+        isRounded
       } = props;
@@ -122,2 +127,3 @@ const Component = props.as;
         "data-is-full-width": isFullWidth || void 0,
+        "data-is-rounded": isRounded || void 0,
         "disabled": isDisabled || void 0,
@@ -128,3 +134,4 @@ "aria-disabled": isDisabled || void 0,
         default: () => [isLoading && !isDisabled && (0, import_vue.createVNode)("span", {
-          "data-loading": "true"
+          "data-loading": "true",
+          "data-is-rounded": isRounded || void 0
         }, [(0, import_vue.createVNode)(import_pixel3_spinner.MpSpinner, {
@@ -131,0 +138,0 @@ "color": "currentcolor"

dist/index.mjs

 import {
   MpButton,
   MpButtonGroup
-} from "./chunk-JIGNZFPU.mjs";
-import "./chunk-CHZ43RJA.mjs";
+} from "./chunk-WNQOVJVI.mjs";
+import "./chunk-NT45ABTV.mjs";
 import "./chunk-6IMGI6CD.mjs";
@@ -7,0 +7,0 @@ export {

dist/metafile-cjs.json

@@ -1,1 +0,1 @@
-{"inputs":{"src/modules/button.props.ts":{"bytes":1193,"imports":[],"format":"esm"},"src/button.tsx":{"bytes":3122,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-icon","kind":"import-statement","external":true},{"path":"@mekari/pixel3-spinner","kind":"import-statement","external":true},{"path":"src/modules/button.props.ts","kind":"import-statement","original":"./modules/button.props"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/modules/button.types.ts":{"bytes":235,"imports":[],"format":"esm"},"src/index.ts":{"bytes":176,"imports":[{"path":"src/button.tsx","kind":"import-statement","original":"./button"},{"path":"src/modules/button.types.ts","kind":"import-statement","original":"./modules/button.types"}],"format":"esm"}},"outputs":{"dist/button.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true},{"path":"@mekari/pixel3-icon","kind":"require-call","external":true},{"path":"@mekari/pixel3-spinner","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/button.tsx","inputs":{"src/button.tsx":{"bytesInOutput":3123},"src/modules/button.props.ts":{"bytesInOutput":561}},"bytes":4762},"dist/index.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true},{"path":"@mekari/pixel3-icon","kind":"require-call","external":true},{"path":"@mekari/pixel3-spinner","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":159},"src/button.tsx":{"bytesInOutput":2955},"src/modules/button.props.ts":{"bytesInOutput":561}},"bytes":4770},"dist/modules/button.props.js":{"imports":[],"exports":[],"entryPoint":"src/modules/button.props.ts","inputs":{"src/modules/button.props.ts":{"bytesInOutput":759}},"bytes":1715},"dist/modules/button.types.js":{"imports":[],"exports":[],"entryPoint":"src/modules/button.types.ts","inputs":{"src/modules/button.types.ts":{"bytesInOutput":84}},"bytes":787}}}
+{"inputs":{"src/modules/button.props.ts":{"bytes":1251,"imports":[],"format":"esm"},"src/button.tsx":{"bytes":3245,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-icon","kind":"import-statement","external":true},{"path":"@mekari/pixel3-spinner","kind":"import-statement","external":true},{"path":"src/modules/button.props.ts","kind":"import-statement","original":"./modules/button.props"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/modules/button.types.ts":{"bytes":235,"imports":[],"format":"esm"},"src/index.ts":{"bytes":176,"imports":[{"path":"src/button.tsx","kind":"import-statement","original":"./button"},{"path":"src/modules/button.types.ts","kind":"import-statement","original":"./modules/button.types"}],"format":"esm"}},"outputs":{"dist/button.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true},{"path":"@mekari/pixel3-icon","kind":"require-call","external":true},{"path":"@mekari/pixel3-spinner","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/button.tsx","inputs":{"src/button.tsx":{"bytesInOutput":3240},"src/modules/button.props.ts":{"bytesInOutput":619}},"bytes":4937},"dist/index.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true},{"path":"@mekari/pixel3-icon","kind":"require-call","external":true},{"path":"@mekari/pixel3-spinner","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":159},"src/button.tsx":{"bytesInOutput":3072},"src/modules/button.props.ts":{"bytesInOutput":619}},"bytes":4945},"dist/modules/button.props.js":{"imports":[],"exports":[],"entryPoint":"src/modules/button.props.ts","inputs":{"src/modules/button.props.ts":{"bytesInOutput":817}},"bytes":1773},"dist/modules/button.types.js":{"imports":[],"exports":[],"entryPoint":"src/modules/button.types.ts","inputs":{"src/modules/button.types.ts":{"bytesInOutput":84}},"bytes":787}}}

dist/metafile-esm.json

@@ -1,1 +0,1 @@
-{"inputs":{"src/modules/button.props.ts":{"bytes":1193,"imports":[],"format":"esm"},"src/button.tsx":{"bytes":3122,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-icon","kind":"import-statement","external":true},{"path":"@mekari/pixel3-spinner","kind":"import-statement","external":true},{"path":"src/modules/button.props.ts","kind":"import-statement","original":"./modules/button.props"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/modules/button.types.ts":{"bytes":235,"imports":[],"format":"esm"},"src/index.ts":{"bytes":176,"imports":[{"path":"src/button.tsx","kind":"import-statement","original":"./button"},{"path":"src/modules/button.types.ts","kind":"import-statement","original":"./modules/button.types"}],"format":"esm"}},"outputs":{"dist/button.mjs":{"imports":[{"path":"dist/chunk-JIGNZFPU.mjs","kind":"import-statement"},{"path":"dist/chunk-CHZ43RJA.mjs","kind":"import-statement"}],"exports":["MpButton","MpButtonGroup"],"entryPoint":"src/button.tsx","inputs":{},"bytes":139},"dist/index.mjs":{"imports":[{"path":"dist/chunk-JIGNZFPU.mjs","kind":"import-statement"},{"path":"dist/chunk-CHZ43RJA.mjs","kind":"import-statement"},{"path":"dist/chunk-6IMGI6CD.mjs","kind":"import-statement"}],"exports":["MpButton","MpButtonGroup"],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":0}},"bytes":170},"dist/chunk-JIGNZFPU.mjs":{"imports":[{"path":"dist/chunk-CHZ43RJA.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-icon","kind":"import-statement","external":true},{"path":"@mekari/pixel3-spinner","kind":"import-statement","external":true}],"exports":["MpButton","MpButtonGroup"],"inputs":{"src/button.tsx":{"bytesInOutput":2717}},"bytes":2861},"dist/modules/button.props.mjs":{"imports":[{"path":"dist/chunk-CHZ43RJA.mjs","kind":"import-statement"}],"exports":["buttonGroupProps","buttonProps"],"entryPoint":"src/modules/button.props.ts","inputs":{},"bytes":121},"dist/chunk-CHZ43RJA.mjs":{"imports":[],"exports":["__name","buttonGroupProps","buttonProps"],"inputs":{"src/modules/button.props.ts":{"bytesInOutput":561}},"bytes":779},"dist/modules/button.types.mjs":{"imports":[{"path":"dist/chunk-6IMGI6CD.mjs","kind":"import-statement"}],"exports":[],"entryPoint":"src/modules/button.types.ts","inputs":{},"bytes":32},"dist/chunk-6IMGI6CD.mjs":{"imports":[],"exports":[],"inputs":{"src/modules/button.types.ts":{"bytesInOutput":0}},"bytes":0}}}
+{"inputs":{"src/modules/button.props.ts":{"bytes":1251,"imports":[],"format":"esm"},"src/button.tsx":{"bytes":3245,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-icon","kind":"import-statement","external":true},{"path":"@mekari/pixel3-spinner","kind":"import-statement","external":true},{"path":"src/modules/button.props.ts","kind":"import-statement","original":"./modules/button.props"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/modules/button.types.ts":{"bytes":235,"imports":[],"format":"esm"},"src/index.ts":{"bytes":176,"imports":[{"path":"src/button.tsx","kind":"import-statement","original":"./button"},{"path":"src/modules/button.types.ts","kind":"import-statement","original":"./modules/button.types"}],"format":"esm"}},"outputs":{"dist/button.mjs":{"imports":[{"path":"dist/chunk-WNQOVJVI.mjs","kind":"import-statement"},{"path":"dist/chunk-NT45ABTV.mjs","kind":"import-statement"}],"exports":["MpButton","MpButtonGroup"],"entryPoint":"src/button.tsx","inputs":{},"bytes":139},"dist/index.mjs":{"imports":[{"path":"dist/chunk-WNQOVJVI.mjs","kind":"import-statement"},{"path":"dist/chunk-NT45ABTV.mjs","kind":"import-statement"},{"path":"dist/chunk-6IMGI6CD.mjs","kind":"import-statement"}],"exports":["MpButton","MpButtonGroup"],"entryPoint":"src/index.ts","inputs":{"src/index.ts":{"bytesInOutput":0}},"bytes":170},"dist/chunk-WNQOVJVI.mjs":{"imports":[{"path":"dist/chunk-NT45ABTV.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-icon","kind":"import-statement","external":true},{"path":"@mekari/pixel3-spinner","kind":"import-statement","external":true}],"exports":["MpButton","MpButtonGroup"],"inputs":{"src/button.tsx":{"bytesInOutput":2834}},"bytes":2978},"dist/modules/button.props.mjs":{"imports":[{"path":"dist/chunk-NT45ABTV.mjs","kind":"import-statement"}],"exports":["buttonGroupProps","buttonProps"],"entryPoint":"src/modules/button.props.ts","inputs":{},"bytes":121},"dist/chunk-NT45ABTV.mjs":{"imports":[],"exports":["__name","buttonGroupProps","buttonProps"],"inputs":{"src/modules/button.props.ts":{"bytesInOutput":619}},"bytes":837},"dist/modules/button.types.mjs":{"imports":[{"path":"dist/chunk-6IMGI6CD.mjs","kind":"import-statement"}],"exports":[],"entryPoint":"src/modules/button.types.ts","inputs":{},"bytes":32},"dist/chunk-6IMGI6CD.mjs":{"imports":[],"exports":[],"inputs":{"src/modules/button.types.ts":{"bytesInOutput":0}},"bytes":0}}}

dist/modules/button.props.d.mts

@@ -37,2 +37,6 @@ import { PropType, Component } from 'vue';
     };
+    isRounded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 };
@@ -39,0 +43,0 @@ declare const buttonGroupProps: {

dist/modules/button.props.d.ts

@@ -37,2 +37,6 @@ import { PropType, Component } from 'vue';
     };
+    isRounded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 };
@@ -39,0 +43,0 @@ declare const buttonGroupProps: {

dist/modules/button.props.js

@@ -57,2 +57,6 @@ "use strict";
     default: false
+  },
+  isRounded: {
+    type: Boolean,
+    default: false
   }
@@ -59,0 +63,0 @@ };

dist/modules/button.props.mjs

 import {
   buttonGroupProps,
   buttonProps
-} from "../chunk-CHZ43RJA.mjs";
+} from "../chunk-NT45ABTV.mjs";
 export {
@@ -6,0 +6,0 @@ buttonGroupProps,

package.json

 {
   "name": "@mekari/pixel3-button",
   "description": "Button component for mekari pixel 3",
-  "version": "0.1.8-dev.0",
+  "version": "0.2.0-dev.1",
   "main": "dist/index.js",
@@ -11,6 +11,6 @@ "license": "MIT",
   "dependencies": {
-    "@mekari/pixel3-icon": "0.1.1-dev.0",
-    "@mekari/pixel3-spinner": "0.0.25-dev.0",
-    "@mekari/pixel3-styled-system": "0.2.0-dev.0",
-    "@mekari/pixel3-utils": "0.1.0-dev.0"
+    "@mekari/pixel3-icon": "0.1.1-dev.1",
+    "@mekari/pixel3-spinner": "0.0.25-dev.1",
+    "@mekari/pixel3-styled-system": "0.2.0-dev.1",
+    "@mekari/pixel3-utils": "0.1.0-dev.1"
   },
@@ -17,0 +17,0 @@ "peerDependencies": {

dist/chunk-CHZ43RJA.mjs

-var __defProp = Object.defineProperty;
-var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
-
-// src/modules/button.props.ts
-var buttonProps = {
-  as: {
-    type: [String, Object],
-    default: "button"
-  },
-  size: {
-    type: String,
-    default: "md"
-  },
-  variant: {
-    type: String,
-    default: "primary"
-  },
-  isDisabled: {
-    type: Boolean,
-    default: false
-  },
-  isLoading: {
-    type: Boolean,
-    default: false
-  },
-  leftIcon: {
-    type: String
-  },
-  rightIcon: {
-    type: String
-  },
-  isFullWidth: {
-    type: Boolean,
-    default: false
-  }
-};
-var buttonGroupProps = {
-  spacing: {
-    type: String,
-    default: "2"
-  },
-  isSplit: {
-    type: Boolean
-  }
-};
-
-export {
-  __name,
-  buttonProps,
-  buttonGroupProps
-};

dist/chunk-JIGNZFPU.mjs

-import {
-  __name,
-  buttonGroupProps,
-  buttonProps
-} from "./chunk-CHZ43RJA.mjs";
-
-// src/button.tsx
-import { createVNode as _createVNode } from "vue";
-import { defineComponent, computed } from "vue";
-import { token } from "@mekari/pixel3-styled-system/tokens";
-import { buttonRecipe, buttonGroupRecipe } from "@mekari/pixel3-styled-system/recipes";
-import { MpIcon } from "@mekari/pixel3-icon";
-import { MpSpinner } from "@mekari/pixel3-spinner";
-var MpButton = defineComponent({
-  name: "MpButton",
-  props: buttonProps,
-  emits: ["click"],
-  setup(props, {
-    slots,
-    emit
-  }) {
-    const classes = computed(() => {
-      return buttonRecipe({
-        size: props.size,
-        variant: props.variant
-      });
-    });
-    const onClick = /* @__PURE__ */ __name((event) => {
-      if (props.isLoading) {
-        event.preventDefault();
-      } else if (!props.isDisabled) {
-        emit("click", event);
-      }
-    }, "onClick");
-    return () => {
-      const children = slots.default && slots.default();
-      const {
-        variant,
-        isDisabled,
-        isLoading,
-        leftIcon,
-        rightIcon,
-        isFullWidth
-      } = props;
-      const Component = props.as;
-      return _createVNode(Component, {
-        "class": classes.value,
-        "data-pixel-component": "MpButton",
-        "data-has-icon": variant !== "textLink" && (rightIcon || leftIcon) ? true : void 0,
-        "data-icon-position": rightIcon ? "right" : leftIcon ? "left" : void 0,
-        "data-has-label": variant !== "textLink" && children ? true : void 0,
-        "data-is-full-width": isFullWidth || void 0,
-        "disabled": isDisabled || void 0,
-        "aria-disabled": isDisabled || void 0,
-        "onClick": onClick
-      }, {
-        default: () => [isLoading && !isDisabled && _createVNode("span", {
-          "data-loading": "true"
-        }, [_createVNode(MpSpinner, {
-          "color": "currentcolor"
-        }, null)]), leftIcon && _createVNode(MpIcon, {
-          "name": leftIcon,
-          "color": "currentcolor"
-        }, null), children, rightIcon && _createVNode(MpIcon, {
-          "name": rightIcon,
-          "color": "currentcolor"
-        }, null)]
-      });
-    };
-  }
-});
-var MpButtonGroup = defineComponent({
-  name: "MpButtonGroup",
-  props: buttonGroupProps,
-  setup(props, {
-    slots
-  }) {
-    const classes = buttonGroupRecipe();
-    return () => {
-      const children = slots.default && slots.default();
-      const {
-        spacing,
-        isSplit
-      } = props;
-      return _createVNode("div", {
-        "class": classes,
-        "data-pixel-component": "MpButtonGroup",
-        "data-split-button": isSplit ? true : void 0,
-        "style": {
-          "--mp-button-group-spacing": token(`spacing.${spacing}`) || spacing
-        }
-      }, [children]);
-    };
-  }
-});
-
-export {
-  MpButton,
-  MpButtonGroup
-};

No alert changes

Improved metrics

Total package byte prevSize

106192

1.08%

Lines of code

899

4.41%

Dependency changes

• + Added

  @mekari/pixel3-icon@0.1.1-dev.1
  (transitive)

• + Added

  @mekari/pixel3-spinner@0.0.25-dev.1
  (transitive)

• + Added

  @mekari/pixel3-styled-system@0.2.0-dev.1
  (transitive)

• + Added

  @mekari/pixel3-utils@0.1.0-dev.1
  (transitive)

• - Removed

  @mekari/pixel3-icon@0.1.1-dev.0
  (transitive)

• - Removed

  @mekari/pixel3-spinner@0.0.25-dev.0
  (transitive)

• - Removed

  @mekari/pixel3-styled-system@0.2.0-dev.0
  (transitive)

• - Removed

  @mekari/pixel3-utils@0.1.0-dev.0
  (transitive)

• Updated

  @mekari/pixel3-icon@0.1.1-dev.1

• Updated

  @mekari/pixel3-spinner@0.0.25-dev.1

• Updated

  @mekari/pixel3-styled-system@0.2.0-dev.1

• Updated

  @mekari/pixel3-utils@0.1.0-dev.1