@mekari/pixel3-progress 0.0.0

package/dist/chunk-624LFHHP.mjs

@@ -0,0 +1,27 @@
+var __defProp = Object.defineProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+
+// src/modules/progress.props.ts
+var progressProps = {
+  variant: {
+    type: String,
+    default: "linear"
+  },
+  size: {
+    type: String,
+    default: "md"
+  },
+  color: {
+    type: String,
+    default: "sky.400"
+  },
+  value: {
+    type: String,
+    default: "0"
+  }
+};
+
+export {
+  __name,
+  progressProps
+};

package/dist/chunk-ANRJP6RI.mjs

@@ -0,0 +1,59 @@
+import {
+  __name,
+  progressProps
+} from "./chunk-624LFHHP.mjs";
+
+// src/progress.tsx
+import { createVNode as _createVNode } from "vue";
+import { defineComponent } from "vue";
+import { progressSlotRecipe } from "@mekari/pixel3-styled-system/recipes";
+import { token } from "@mekari/pixel3-styled-system/tokens";
+var MpProgress = defineComponent({
+  name: "MpProgress",
+  props: progressProps,
+  setup(props) {
+    const classes = progressSlotRecipe({
+      size: props.size,
+      variant: props.variant
+    });
+    const progressValue = /* @__PURE__ */ __name((val) => {
+      let value = Number(val);
+      if (value < 0)
+        value = 0;
+      if (value > 100)
+        value = 100;
+      if (props.variant === "circular") {
+        return `${value * 3.6}deg`;
+      }
+      return `${value}%`;
+    }, "progressValue");
+    return () => {
+      const {
+        value,
+        color
+      } = props;
+      return _createVNode("div", {
+        "class": classes.root,
+        "data-pixel-component": "MpProgress",
+        "role": "progressbar",
+        "aria-valuemax": "100",
+        "aria-valuemin": "0",
+        "aria-valuenow": value,
+        "style": {
+          "--mp-progress-color": token(`colors.${color}`) || color,
+          "--mp-progress-width": progressValue(value)
+        }
+      }, [props.variant === "linear" && _createVNode("div", {
+        "class": classes.linear
+      }, null), props.variant === "circular" && _createVNode("div", {
+        "class": classes.circularBase
+      }, [_createVNode("div", {
+        "class": classes.circularTrack
+      }, null)])]);
+    };
+  }
+});
+
+export {
+  MpProgress
+};

package/dist/index.d.mts

@@ -0,0 +1,3 @@
+export { MpProgress } from './progress.mjs';
+import 'vue';
+import './modules/progress.type.mjs';

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export { MpProgress } from './progress.js';
+import 'vue';
+import './modules/progress.type.js';

package/dist/index.js

@@ -0,0 +1,103 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/index.tsx
+var src_exports = {};
+__export(src_exports, {
+  MpProgress: () => MpProgress
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/progress.tsx
+var import_vue = require("vue");
+var import_vue2 = require("vue");
+var import_recipes = require("@mekari/pixel3-styled-system/recipes");
+var import_tokens = require("@mekari/pixel3-styled-system/tokens");
+
+// src/modules/progress.props.ts
+var progressProps = {
+  variant: {
+    type: String,
+    default: "linear"
+  },
+  size: {
+    type: String,
+    default: "md"
+  },
+  color: {
+    type: String,
+    default: "sky.400"
+  },
+  value: {
+    type: String,
+    default: "0"
+  }
+};
+
+// src/progress.tsx
+var MpProgress = (0, import_vue2.defineComponent)({
+  name: "MpProgress",
+  props: progressProps,
+  setup(props) {
+    const classes = (0, import_recipes.progressSlotRecipe)({
+      size: props.size,
+      variant: props.variant
+    });
+    const progressValue = /* @__PURE__ */ __name((val) => {
+      let value = Number(val);
+      if (value < 0)
+        value = 0;
+      if (value > 100)
+        value = 100;
+      if (props.variant === "circular") {
+        return `${value * 3.6}deg`;
+      }
+      return `${value}%`;
+    }, "progressValue");
+    return () => {
+      const {
+        value,
+        color
+      } = props;
+      return (0, import_vue.createVNode)("div", {
+        "class": classes.root,
+        "data-pixel-component": "MpProgress",
+        "role": "progressbar",
+        "aria-valuemax": "100",
+        "aria-valuemin": "0",
+        "aria-valuenow": value,
+        "style": {
+          "--mp-progress-color": (0, import_tokens.token)(`colors.${color}`) || color,
+          "--mp-progress-width": progressValue(value)
+        }
+      }, [props.variant === "linear" && (0, import_vue.createVNode)("div", {
+        "class": classes.linear
+      }, null), props.variant === "circular" && (0, import_vue.createVNode)("div", {
+        "class": classes.circularBase
+      }, [(0, import_vue.createVNode)("div", {
+        "class": classes.circularTrack
+      }, null)])]);
+    };
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  MpProgress
+});

package/dist/index.mjs

@@ -0,0 +1,7 @@
+import {
+  MpProgress
+} from "./chunk-ANRJP6RI.mjs";
+import "./chunk-624LFHHP.mjs";
+export {
+  MpProgress
+};

package/dist/metafile-cjs.json

@@ -0,0 +1 @@
+{"inputs":{"src/modules/progress.props.ts":{"bytes":624,"imports":[{"path":"../modules/progress.type","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"import-statement","external":true}],"format":"esm"},"src/progress.tsx":{"bytes":1761,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"import-statement","external":true},{"path":"src/modules/progress.props.ts","kind":"import-statement","original":"./modules/progress.props"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/index.tsx":{"bytes":125,"imports":[{"path":"src/progress.tsx","kind":"import-statement","original":"./progress"}],"format":"esm"},"src/modules/progress.type.ts":{"bytes":177,"imports":[],"format":"esm"}},"outputs":{"dist/index.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/index.tsx","inputs":{"src/index.tsx":{"bytesInOutput":125},"src/progress.tsx":{"bytesInOutput":1608},"src/modules/progress.props.ts":{"bytesInOutput":241}},"bytes":3061},"dist/progress.js":{"imports":[{"path":"vue","kind":"require-call","external":true},{"path":"vue","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"require-call","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"require-call","external":true}],"exports":[],"entryPoint":"src/progress.tsx","inputs":{"src/progress.tsx":{"bytesInOutput":1748},"src/modules/progress.props.ts":{"bytesInOutput":241}},"bytes":3058},"dist/modules/progress.props.js":{"imports":[],"exports":[],"entryPoint":"src/modules/progress.props.ts","inputs":{"src/modules/progress.props.ts":{"bytesInOutput":405}},"bytes":1345},"dist/modules/progress.type.js":{"imports":[],"exports":[],"entryPoint":"src/modules/progress.type.ts","inputs":{"src/modules/progress.type.ts":{"bytesInOutput":86}},"bytes":790}}}

package/dist/metafile-esm.json

@@ -0,0 +1 @@
+{"inputs":{"src/modules/progress.props.ts":{"bytes":624,"imports":[{"path":"../modules/progress.type","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"import-statement","external":true}],"format":"esm"},"src/progress.tsx":{"bytes":1761,"imports":[{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"import-statement","external":true},{"path":"src/modules/progress.props.ts","kind":"import-statement","original":"./modules/progress.props"},{"path":"<runtime>","kind":"import-statement","external":true}],"format":"esm"},"src/index.tsx":{"bytes":125,"imports":[{"path":"src/progress.tsx","kind":"import-statement","original":"./progress"}],"format":"esm"},"src/modules/progress.type.ts":{"bytes":177,"imports":[],"format":"esm"}},"outputs":{"dist/index.mjs":{"imports":[{"path":"dist/chunk-ANRJP6RI.mjs","kind":"import-statement"},{"path":"dist/chunk-624LFHHP.mjs","kind":"import-statement"}],"exports":["MpProgress"],"entryPoint":"src/index.tsx","inputs":{"src/index.tsx":{"bytesInOutput":0}},"bytes":109},"dist/progress.mjs":{"imports":[{"path":"dist/chunk-ANRJP6RI.mjs","kind":"import-statement"},{"path":"dist/chunk-624LFHHP.mjs","kind":"import-statement"}],"exports":["MpProgress"],"entryPoint":"src/progress.tsx","inputs":{},"bytes":109},"dist/chunk-ANRJP6RI.mjs":{"imports":[{"path":"dist/chunk-624LFHHP.mjs","kind":"import-statement"},{"path":"vue","kind":"import-statement","external":true},{"path":"vue","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/recipes","kind":"import-statement","external":true},{"path":"@mekari/pixel3-styled-system/tokens","kind":"import-statement","external":true}],"exports":["MpProgress"],"inputs":{"src/progress.tsx":{"bytesInOutput":1513}},"bytes":1626},"dist/modules/progress.props.mjs":{"imports":[{"path":"dist/chunk-624LFHHP.mjs","kind":"import-statement"}],"exports":["progressProps"],"entryPoint":"src/modules/progress.props.ts","inputs":{},"bytes":85},"dist/chunk-624LFHHP.mjs":{"imports":[],"exports":["__name","progressProps"],"inputs":{"src/modules/progress.props.ts":{"bytesInOutput":241}},"bytes":443},"dist/modules/progress.type.mjs":{"imports":[],"exports":[],"entryPoint":"src/modules/progress.type.ts","inputs":{"src/modules/progress.type.ts":{"bytesInOutput":0}},"bytes":0}}}

package/dist/modules/progress.props.d.mts

@@ -0,0 +1,23 @@
+import { PropType } from 'vue';
+import { ProgressVariant, ProgressSize } from './progress.type.mjs';
+
+declare const progressProps: {
+    variant: {
+        type: PropType<ProgressVariant>;
+        default: string;
+    };
+    size: {
+        type: PropType<ProgressSize>;
+        default: string;
+    };
+    color: {
+        type: PropType<string>;
+        default: string;
+    };
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+};
+
+export { progressProps };

package/dist/modules/progress.props.d.ts

@@ -0,0 +1,23 @@
+import { PropType } from 'vue';
+import { ProgressVariant, ProgressSize } from './progress.type.js';
+
+declare const progressProps: {
+    variant: {
+        type: PropType<ProgressVariant>;
+        default: string;
+    };
+    size: {
+        type: PropType<ProgressSize>;
+        default: string;
+    };
+    color: {
+        type: PropType<string>;
+        default: string;
+    };
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+};
+
+export { progressProps };

package/dist/modules/progress.props.js

@@ -0,0 +1,47 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/modules/progress.props.ts
+var progress_props_exports = {};
+__export(progress_props_exports, {
+  progressProps: () => progressProps
+});
+module.exports = __toCommonJS(progress_props_exports);
+var progressProps = {
+  variant: {
+    type: String,
+    default: "linear"
+  },
+  size: {
+    type: String,
+    default: "md"
+  },
+  color: {
+    type: String,
+    default: "sky.400"
+  },
+  value: {
+    type: String,
+    default: "0"
+  }
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  progressProps
+});

package/dist/modules/progress.props.mjs

@@ -0,0 +1,6 @@
+import {
+  progressProps
+} from "../chunk-624LFHHP.mjs";
+export {
+  progressProps
+};

package/dist/modules/progress.type.d.mts

@@ -0,0 +1,4 @@
+type ProgressVariant = 'linear' | 'circular';
+type ProgressSize = 'sm' | 'md';
+
+export { ProgressSize, ProgressVariant };

package/dist/modules/progress.type.d.ts

@@ -0,0 +1,4 @@
+type ProgressVariant = 'linear' | 'circular';
+type ProgressSize = 'sm' | 'md';
+
+export { ProgressSize, ProgressVariant };

package/dist/modules/progress.type.js

@@ -0,0 +1,18 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/modules/progress.type.ts
+var progress_type_exports = {};
+module.exports = __toCommonJS(progress_type_exports);

package/dist/progress.d.mts

@@ -0,0 +1,45 @@
+import * as vue from 'vue';
+import { ProgressVariant, ProgressSize } from './modules/progress.type.mjs';
+
+declare const MpProgress: vue.DefineComponent<{
+    variant: {
+        type: vue.PropType<ProgressVariant>;
+        default: string;
+    };
+    size: {
+        type: vue.PropType<ProgressSize>;
+        default: string;
+    };
+    color: {
+        type: vue.PropType<string>;
+        default: string;
+    };
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+}, () => JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    variant: {
+        type: vue.PropType<ProgressVariant>;
+        default: string;
+    };
+    size: {
+        type: vue.PropType<ProgressSize>;
+        default: string;
+    };
+    color: {
+        type: vue.PropType<string>;
+        default: string;
+    };
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    variant: ProgressVariant;
+    size: ProgressSize;
+    color: string;
+    value: string;
+}, {}>;
+
+export { MpProgress };

package/dist/progress.d.ts

@@ -0,0 +1,45 @@
+import * as vue from 'vue';
+import { ProgressVariant, ProgressSize } from './modules/progress.type.js';
+
+declare const MpProgress: vue.DefineComponent<{
+    variant: {
+        type: vue.PropType<ProgressVariant>;
+        default: string;
+    };
+    size: {
+        type: vue.PropType<ProgressSize>;
+        default: string;
+    };
+    color: {
+        type: vue.PropType<string>;
+        default: string;
+    };
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+}, () => JSX.Element, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {}, string, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, Readonly<vue.ExtractPropTypes<{
+    variant: {
+        type: vue.PropType<ProgressVariant>;
+        default: string;
+    };
+    size: {
+        type: vue.PropType<ProgressSize>;
+        default: string;
+    };
+    color: {
+        type: vue.PropType<string>;
+        default: string;
+    };
+    value: {
+        type: StringConstructor;
+        default: string;
+    };
+}>>, {
+    variant: ProgressVariant;
+    size: ProgressSize;
+    color: string;
+    value: string;
+}, {}>;
+
+export { MpProgress };

package/dist/progress.js

@@ -0,0 +1,101 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/progress.tsx
+var progress_exports = {};
+__export(progress_exports, {
+  MpProgress: () => MpProgress
+});
+module.exports = __toCommonJS(progress_exports);
+var import_vue = require("vue");
+var import_vue2 = require("vue");
+var import_recipes = require("@mekari/pixel3-styled-system/recipes");
+var import_tokens = require("@mekari/pixel3-styled-system/tokens");
+
+// src/modules/progress.props.ts
+var progressProps = {
+  variant: {
+    type: String,
+    default: "linear"
+  },
+  size: {
+    type: String,
+    default: "md"
+  },
+  color: {
+    type: String,
+    default: "sky.400"
+  },
+  value: {
+    type: String,
+    default: "0"
+  }
+};
+
+// src/progress.tsx
+var MpProgress = (0, import_vue2.defineComponent)({
+  name: "MpProgress",
+  props: progressProps,
+  setup(props) {
+    const classes = (0, import_recipes.progressSlotRecipe)({
+      size: props.size,
+      variant: props.variant
+    });
+    const progressValue = /* @__PURE__ */ __name((val) => {
+      let value = Number(val);
+      if (value < 0)
+        value = 0;
+      if (value > 100)
+        value = 100;
+      if (props.variant === "circular") {
+        return `${value * 3.6}deg`;
+      }
+      return `${value}%`;
+    }, "progressValue");
+    return () => {
+      const {
+        value,
+        color
+      } = props;
+      return (0, import_vue.createVNode)("div", {
+        "class": classes.root,
+        "data-pixel-component": "MpProgress",
+        "role": "progressbar",
+        "aria-valuemax": "100",
+        "aria-valuemin": "0",
+        "aria-valuenow": value,
+        "style": {
+          "--mp-progress-color": (0, import_tokens.token)(`colors.${color}`) || color,
+          "--mp-progress-width": progressValue(value)
+        }
+      }, [props.variant === "linear" && (0, import_vue.createVNode)("div", {
+        "class": classes.linear
+      }, null), props.variant === "circular" && (0, import_vue.createVNode)("div", {
+        "class": classes.circularBase
+      }, [(0, import_vue.createVNode)("div", {
+        "class": classes.circularTrack
+      }, null)])]);
+    };
+  }
+});
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  MpProgress
+});

package/dist/progress.mjs

@@ -0,0 +1,7 @@
+import {
+  MpProgress
+} from "./chunk-ANRJP6RI.mjs";
+import "./chunk-624LFHHP.mjs";
+export {
+  MpProgress
+};

package/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "@mekari/pixel3-progress",
+  "description": "Progress component for mekari pixel 3",
+  "version": "0.0.0",
+  "main": "dist/index.js",
+  "license": "MIT",
+  "files": [
+    "dist"
+  ],
+  "dependencies": {
+    "@mekari/pixel3-icon": "0.0.0",
+    "@mekari/pixel3-spinner": "0.0.0",
+    "@mekari/pixel3-styled-system": "0.0.0"
+  },
+  "peerDependencies": {
+    "vue": "^3.3.7"
+  },
+  "devDependencies": {
+    "vue": "^3.3.7"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "module": "dist/index.mjs",
+  "types": "dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "require": "./dist/index.js",
+      "default": "./dist/index.mjs"
+    }
+  },
+  "scripts": {
+    "clean": "rimraf dist .turbo",
+    "build": "tsup && pnpm build:types",
+    "build:fast": "tsup",
+    "build:types": "tsup src --dts-only",
+    "build:external": "tsup src/index.tsx --external",
+    "types:check": "tsc --noEmit",
+    "replace-config": "clean-package",
+    "restore-config": "clean-package restore"
+  }
+}