@re-code/ui-components 0.0.1

package/dist/ui-components/index.esm.js

@@ -0,0 +1 @@
+//! Autogenerated index

package/dist/ui-components/index.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["@user-index-entrypoint"],"sourcesContent":["//! Autogenerated index"],"names":[],"mappings":"AAAA"}

package/dist/ui-components/ui-components.css

@@ -0,0 +1,28 @@
+:root {
+  --color-primary: #6750A4;
+  --color-on-primary: #FFFFFF;
+  --color-primary-container: #EADDFF;
+  --color-on-primary-container: #21005D;
+  --color-secondary: #625B71;
+  --color-on-secondary: #FFFFFF;
+  --color-secondary-container: #E8DEF8;
+  --color-on-secondary-container: #1D192B;
+  --color-tertiary: #7D5260;
+  --color-on-tertiary: #FFFFFF;
+  --color-tertiary-container: #FFD8E4;
+  --color-on-tertiary-container: #31111D;
+  --color-error: #B3261E;
+  --color-on-error: #FFFFFF;
+  --color-surface: #FEF7FF;
+  --color-on-surface: #1D1B20;
+  --color-on-surface-variant: #49454F;
+  --color-outline: #79747E;
+}
+
+html, body {
+  margin: 0;
+  padding: 0;
+  font-family: "Roboto", system-ui, -apple-system, sans-serif;
+  background-color: #FEF7FF;
+  color: #1D1B20;
+}

package/dist/ui-components/ui-components.esm.js

@@ -0,0 +1,47 @@
+import { B as BUILD, c as consoleDevInfo, H, w as win, N as NAMESPACE, p as promiseResolve, g as globalScripts, b as bootstrapLazy } from './index-CDwILsz8.js';
+export { s as setNonce } from './index-CDwILsz8.js';
+
+/*
+ Stencil Client Patch Browser v4.41.2 | MIT Licensed | https://stenciljs.com
+ */
+
+var patchBrowser = () => {
+  if (BUILD.isDev && !BUILD.isTesting) {
+    consoleDevInfo("Running in development mode.");
+  }
+  if (BUILD.cloneNodeFix) {
+    patchCloneNodeFix(H.prototype);
+  }
+  const scriptElm = BUILD.scriptDataOpts ? win.document && Array.from(win.document.querySelectorAll("script")).find(
+    (s) => new RegExp(`/${NAMESPACE}(\\.esm)?\\.js($|\\?|#)`).test(s.src) || s.getAttribute("data-stencil-namespace") === NAMESPACE
+  ) : null;
+  const importMeta = import.meta.url;
+  const opts = BUILD.scriptDataOpts ? (scriptElm || {})["data-opts"] || {} : {};
+  if (importMeta !== "") {
+    opts.resourcesUrl = new URL(".", importMeta).href;
+  }
+  return promiseResolve(opts);
+};
+var patchCloneNodeFix = (HTMLElementPrototype) => {
+  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;
+  HTMLElementPrototype.cloneNode = function(deep) {
+    if (this.nodeName === "TEMPLATE") {
+      return nativeCloneNodeFn.call(this, deep);
+    }
+    const clonedNode = nativeCloneNodeFn.call(this, false);
+    const srcChildNodes = this.childNodes;
+    if (deep) {
+      for (let i = 0; i < srcChildNodes.length; i++) {
+        if (srcChildNodes[i].nodeType !== 2) {
+          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));
+        }
+      }
+    }
+    return clonedNode;
+  };
+};
+
+patchBrowser().then(async (options) => {
+  await globalScripts();
+  return bootstrapLazy([["ui-label",[[257,"ui-label",{"label":[1],"variant":[1],"color":[1],"weight":[1],"italic":[4]}]]]], options);
+});

package/dist/ui-components/ui-components.esm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ui-components.esm.js","sources":["node_modules/@stencil/core/internal/client/patch-browser.js","@lazy-browser-entrypoint?app-data=conditional"],"sourcesContent":["/*\n Stencil Client Patch Browser v4.41.2 | MIT Licensed | https://stenciljs.com\n */\n\n// src/client/client-patch-browser.ts\nimport { BUILD, NAMESPACE } from \"@stencil/core/internal/app-data\";\nimport { consoleDevInfo, H, promiseResolve, win } from \"@stencil/core\";\nvar patchBrowser = () => {\n  if (BUILD.isDev && !BUILD.isTesting) {\n    consoleDevInfo(\"Running in development mode.\");\n  }\n  if (BUILD.cloneNodeFix) {\n    patchCloneNodeFix(H.prototype);\n  }\n  const scriptElm = BUILD.scriptDataOpts ? win.document && Array.from(win.document.querySelectorAll(\"script\")).find(\n    (s) => new RegExp(`/${NAMESPACE}(\\\\.esm)?\\\\.js($|\\\\?|#)`).test(s.src) || s.getAttribute(\"data-stencil-namespace\") === NAMESPACE\n  ) : null;\n  const importMeta = import.meta.url;\n  const opts = BUILD.scriptDataOpts ? (scriptElm || {})[\"data-opts\"] || {} : {};\n  if (importMeta !== \"\") {\n    opts.resourcesUrl = new URL(\".\", importMeta).href;\n  }\n  return promiseResolve(opts);\n};\nvar patchCloneNodeFix = (HTMLElementPrototype) => {\n  const nativeCloneNodeFn = HTMLElementPrototype.cloneNode;\n  HTMLElementPrototype.cloneNode = function(deep) {\n    if (this.nodeName === \"TEMPLATE\") {\n      return nativeCloneNodeFn.call(this, deep);\n    }\n    const clonedNode = nativeCloneNodeFn.call(this, false);\n    const srcChildNodes = this.childNodes;\n    if (deep) {\n      for (let i = 0; i < srcChildNodes.length; i++) {\n        if (srcChildNodes[i].nodeType !== 2) {\n          clonedNode.appendChild(srcChildNodes[i].cloneNode(true));\n        }\n      }\n    }\n    return clonedNode;\n  };\n};\nexport {\n  patchBrowser\n};\n","export { setNonce } from '@stencil/core';\nimport { bootstrapLazy } from '@stencil/core';\nimport { patchBrowser } from '@stencil/core/internal/client/patch-browser';\nimport { globalScripts } from '@stencil/core/internal/app-globals';\npatchBrowser().then(async (options) => {\n  await globalScripts();\n  return bootstrapLazy([/*!__STENCIL_LAZY_DATA__*/], options);\n});\n"],"names":[],"mappings":";;;AAAA;AACA;AACA;;AAKA,IAAI,YAAY,GAAG,MAAM;AACzB,EAAE,IAAI,KAAK,CAAC,KAAK,IAAI,CAAC,KAAK,CAAC,SAAS,EAAE;AACvC,IAAI,cAAc,CAAC,8BAA8B,CAAC;AAClD;AACA,EAAE,IAAI,KAAK,CAAC,YAAY,EAAE;AAC1B,IAAI,iBAAiB,CAAC,CAAC,CAAC,SAAS,CAAC;AAClC;AACA,EAAE,MAAM,SAAS,GAAG,KAAK,CAAC,cAAc,GAAG,GAAG,CAAC,QAAQ,IAAI,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI;AACnH,IAAI,CAAC,CAAC,KAAK,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,SAAS,CAAC,uBAAuB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,YAAY,CAAC,wBAAwB,CAAC,KAAK;AAC1H,GAAG,GAAG,IAAI;AACV,EAAE,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG;AACpC,EAAE,MAAM,IAAI,GAAG,KAAK,CAAC,cAAc,GAAG,CAAC,SAAS,IAAI,EAAE,EAAE,WAAW,CAAC,IAAI,EAAE,GAAG,EAAE;AAC/E,EAAE,IAAI,UAAU,KAAK,EAAE,EAAE;AACzB,IAAI,IAAI,CAAC,YAAY,GAAG,IAAI,GAAG,CAAC,GAAG,EAAE,UAAU,CAAC,CAAC,IAAI;AACrD;AACA,EAAE,OAAO,cAAc,CAAC,IAAI,CAAC;AAC7B,CAAC;AACD,IAAI,iBAAiB,GAAG,CAAC,oBAAoB,KAAK;AAClD,EAAE,MAAM,iBAAiB,GAAG,oBAAoB,CAAC,SAAS;AAC1D,EAAE,oBAAoB,CAAC,SAAS,GAAG,SAAS,IAAI,EAAE;AAClD,IAAI,IAAI,IAAI,CAAC,QAAQ,KAAK,UAAU,EAAE;AACtC,MAAM,OAAO,iBAAiB,CAAC,IAAI,CAAC,IAAI,EAAE,IAAI,CAAC;AAC/C;AACA,IAAI,MAAM,UAAU,GAAG,iBAAiB,CAAC,IAAI,CAAC,IAAI,EAAE,KAAK,CAAC;AAC1D,IAAI,MAAM,aAAa,GAAG,IAAI,CAAC,UAAU;AACzC,IAAI,IAAI,IAAI,EAAE;AACd,MAAM,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,aAAa,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;AACrD,QAAQ,IAAI,aAAa,CAAC,CAAC,CAAC,CAAC,QAAQ,KAAK,CAAC,EAAE;AAC7C,UAAU,UAAU,CAAC,WAAW,CAAC,aAAa,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC;AAClE;AACA;AACA;AACA,IAAI,OAAO,UAAU;AACrB,GAAG;AACH,CAAC;;ACrCD,YAAY,EAAE,CAAC,IAAI,CAAC,OAAO,OAAO,KAAK;AACvC,EAAE,MAAM,aAAa,EAAE;AACvB,EAAE,OAAO,aAAa,CAAC,4BAA4B,EAAE,OAAO,CAAC;AAC7D,CAAC,CAAC","x_google_ignoreList":[0]}

package/dist/ui-components/ui-label.entry.js

@@ -0,0 +1,24 @@
+import { r as registerInstance, h, a as Host } from './index-CDwILsz8.js';
+
+const uiLabelCss = () => `:host{display:inline-block;font-family:"Roboto", system-ui, -apple-system, sans-serif;color:#1D1B20;transition:all 0.2s ease-in-out}:host(.ui-label--display-large){font-size:57px;line-height:64px;font-weight:400;letter-spacing:-0.25px}:host(.ui-label--display-medium){font-size:45px;line-height:52px;font-weight:400;letter-spacing:0px}:host(.ui-label--display-small){font-size:36px;line-height:44px;font-weight:400;letter-spacing:0px}:host(.ui-label--headline-large){font-size:32px;line-height:40px;font-weight:400;letter-spacing:0px}:host(.ui-label--headline-medium){font-size:28px;line-height:36px;font-weight:400;letter-spacing:0px}:host(.ui-label--headline-small){font-size:24px;line-height:32px;font-weight:400;letter-spacing:0px}:host(.ui-label--title-large){font-size:22px;line-height:28px;font-weight:400;letter-spacing:0px}:host(.ui-label--title-medium){font-size:16px;line-height:24px;font-weight:500;letter-spacing:0.15px}:host(.ui-label--title-small){font-size:14px;line-height:20px;font-weight:500;letter-spacing:0.1px}:host(.ui-label--body-large){font-size:16px;line-height:24px;font-weight:400;letter-spacing:0.5px}:host(.ui-label--body-medium){font-size:14px;line-height:20px;font-weight:400;letter-spacing:0.25px}:host(.ui-label--body-small){font-size:12px;line-height:16px;font-weight:400;letter-spacing:0.4px}:host(.ui-label--label-large){font-size:14px;line-height:20px;font-weight:500;letter-spacing:0.1px}:host(.ui-label--label-medium){font-size:12px;line-height:16px;font-weight:500;letter-spacing:0.5px}:host(.ui-label--label-small){font-size:11px;line-height:16px;font-weight:500;letter-spacing:0.5px}:host(.ui-label--color-primary){color:#6750A4}:host(.ui-label--color-on-primary){color:#FFFFFF}:host(.ui-label--color-primary-container){color:#EADDFF}:host(.ui-label--color-on-primary-container){color:#21005D}:host(.ui-label--color-secondary){color:#625B71}:host(.ui-label--color-on-secondary){color:#FFFFFF}:host(.ui-label--color-secondary-container){color:#E8DEF8}:host(.ui-label--color-on-secondary-container){color:#1D192B}:host(.ui-label--color-tertiary){color:#7D5260}:host(.ui-label--color-on-tertiary){color:#FFFFFF}:host(.ui-label--color-tertiary-container){color:#FFD8E4}:host(.ui-label--color-on-tertiary-container){color:#31111D}:host(.ui-label--color-error){color:#B3261E}:host(.ui-label--color-on-error){color:#FFFFFF}:host(.ui-label--color-surface){color:#FEF7FF}:host(.ui-label--color-on-surface){color:#1D1B20}:host(.ui-label--color-on-surface-variant){color:#49454F}:host(.ui-label--color-outline){color:#79747E}:host(.ui-label--weight-normal){font-weight:400}:host(.ui-label--weight-medium){font-weight:500}:host(.ui-label--weight-bold){font-weight:700}:host(.ui-label--italic){font-style:italic !important}`;
+
+const UiLabel = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.variant = 'body-medium';
+        this.color = 'on-surface';
+        this.italic = false;
+    }
+    render() {
+        const classMap = {
+            [`ui-label--${this.variant}`]: true,
+            [`ui-label--color-${this.color}`]: true,
+            [`ui-label--weight-${this.weight}`]: !!this.weight,
+            'ui-label--italic': this.italic
+        };
+        return (h(Host, { key: 'aa90dba620bb302ef1f8d2d9452eab3cb1c993db', class: classMap }, h("span", { key: '09e6a2daad525a3946a4d926799e866970a70fc3' }, this.label, " ", h("slot", { key: '972f325c8826a2bc3f7d1a36bf5adb4335285904' }))));
+    }
+};
+UiLabel.style = uiLabelCss();
+
+export { UiLabel as ui_label };

package/dist/ui-components/ui-label.entry.js.map

@@ -0,0 +1 @@
+{"file":"ui-label.entry.js","mappings":";;AAAA,MAAM,UAAU,GAAG,MAAM,CAAC,isFAAisF,CAAC;;MCQ/sF,OAAO,GAAA,MAAA;AALpB,IAAA,WAAA,CAAA,OAAA,EAAA;;AAOU,QAAA,IAAO,CAAA,OAAA,GAAsB,aAAa;AAC1C,QAAA,IAAK,CAAA,KAAA,GAAiB,YAAY;AAElC,QAAA,IAAM,CAAA,MAAA,GAAY,KAAK;AAkBhC;IAhBC,MAAM,GAAA;AACJ,QAAA,MAAM,QAAQ,GAAG;AACf,YAAA,CAAC,aAAa,IAAI,CAAC,OAAO,CAAE,CAAA,GAAG,IAAI;AACnC,YAAA,CAAC,mBAAmB,IAAI,CAAC,KAAK,CAAE,CAAA,GAAG,IAAI;YACvC,CAAC,CAAA,iBAAA,EAAoB,IAAI,CAAC,MAAM,CAAA,CAAE,GAAG,CAAC,CAAC,IAAI,CAAC,MAAM;YAClD,kBAAkB,EAAE,IAAI,CAAC;SAC1B;QAED,QACE,CAAC,CAAA,IAAI,EAAC,EAAA,GAAA,EAAA,0CAAA,EAAA,KAAK,EAAE,QAAQ,EAAA,EACnB,CAAA,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,EACG,IAAI,CAAC,KAAK,OAAE,CAAa,CAAA,MAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAA,CACrB,CACF;;;;;;;","names":[],"sources":["src/components/ui-label/ui-label.scss?tag=ui-label&encapsulation=shadow","src/components/ui-label/ui-label.tsx"],"sourcesContent":["@use '../../global/variables' as *;\r\n@use '../../global/mixins' as *;\r\n\r\n:host {\r\n  display: inline-block;\r\n  font-family: $font-family-base;\r\n  color: get-color('on-surface'); \r\n  transition: all 0.2s ease-in-out;\r\n}\r\n\r\n\r\n@each $key, $value in $typography {\r\n  :host(.ui-label--#{$key}) {\r\n    @include apply-typography($key);\r\n  }\r\n}\r\n\r\n@each $name, $value in $colors {\r\n  :host(.ui-label--color-#{$name}) {\r\n    color: get-color($name);\r\n  }\r\n}\r\n\r\n:host(.ui-label--weight-normal) { font-weight: 400; }\r\n:host(.ui-label--weight-medium) { font-weight: 500; }\r\n:host(.ui-label--weight-bold)   { font-weight: 700; }\r\n\r\n:host(.ui-label--italic) {\r\n  font-style: italic !important;\r\n}","import { Component, Host, h, Prop } from '@stencil/core';\r\nimport { TypographyVariant, ColorVariant, FontWeight } from '../../global/types';\r\n\r\n@Component({\r\n  tag: 'ui-label',\r\n  styleUrl: 'ui-label.scss',\r\n  shadow: true,\r\n})\r\nexport class UiLabel {\r\n  @Prop() label!: string;\r\n  @Prop() variant: TypographyVariant = 'body-medium';\r\n  @Prop() color: ColorVariant = 'on-surface';\r\n  @Prop() weight?: FontWeight;\r\n  @Prop() italic: boolean = false;\r\n\r\n  render() {\r\n    const classMap = {\r\n      [`ui-label--${this.variant}`]: true,\r\n      [`ui-label--color-${this.color}`]: true,\r\n      [`ui-label--weight-${this.weight}`]: !!this.weight,\r\n      'ui-label--italic': this.italic\r\n    };\r\n\r\n    return (\r\n      <Host class={classMap}>\r\n        <span>\r\n          {this.label} <slot></slot>\r\n        </span>\r\n      </Host>\r\n    );\r\n  }\r\n}"],"version":3}

package/package.json

@@ -0,0 +1,65 @@
+{
+  "name": "@re-code/ui-components",
+  "version": "0.0.1",
+  "description": "Stencil Component Starter for Wa-Machi Design System",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.js",
+  "es2015": "dist/esm/index.mjs",
+  "es2017": "dist/esm/index.mjs",
+  "types": "dist/types/index.d.ts",
+  "collection": "dist/collection/collection-manifest.json",
+  "collection:main": "dist/collection/index.js",
+  "unpkg": "dist/ui-components/ui-components.esm.js",
+  "files": [
+    "dist/"
+  ],
+  "scripts": {
+    "build": "stencil build --docs",
+    "build:watch": "stencil build --dev --watch",
+    "start": "stencil build --dev --watch --serve",
+    "test": "stencil test --spec --e2e",
+    "test:watch": "stencil test --spec --e2e --watchAll",
+    "generate": "stencil generate",
+    "lint": "eslint .",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "npm run build && storybook build",
+    "dev": "concurrently \"npm run build:watch\" \"npm run storybook\""
+  },
+  "dependencies": {
+    "@stencil/core": "^4.12.0",
+    "@stencil/sass": "^3.0.0"
+  },
+  "devDependencies": {
+    "@eslint/js": "^9.39.2",
+    "@storybook/addon-essentials": "^8.0.0",
+    "@storybook/addon-links": "^8.0.0",
+    "@storybook/blocks": "^8.0.0",
+    "@storybook/web-components": "^8.0.0",
+    "@storybook/web-components-vite": "^8.0.0",
+    "@types/jest": "^29.5.0",
+    "@types/node": "^20.0.0",
+    "@typescript-eslint/eslint-plugin": "^8.53.1",
+    "@typescript-eslint/parser": "^8.53.1",
+    "concurrently": "^9.1.2",
+    "eslint": "^9.39.2",
+    "globals": "^17.0.0",
+    "jest": "^29.5.0",
+    "jest-cli": "^29.5.0",
+    "lit": "^3.1.0",
+    "puppeteer": "^21.0.0",
+    "rimraf": "^5.0.0",
+    "storybook": "^8.0.0",
+    "typescript": "^5.0.0",
+    "typescript-eslint": "^8.53.1",
+    "vite": "^5.0.0"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/iamcodex96/ui-components.git"
+  },
+  "tags": [
+    "autodocs"
+  ],
+  "private": false
+}