bth-ui 0.0.0-stage → 0.0.2

package/docs/tokens.json

@@ -0,0 +1,340 @@
+{
+  "version": "0.0.2",
+  "tokens": [
+    {
+      "name": "$primary-color",
+      "value": "#0861ff",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$success-color",
+      "value": "#26d07c",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$danger-color",
+      "value": "#df4661",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$warning-color",
+      "value": "#f7b500",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$info-color",
+      "value": "#009cde",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$accent-color",
+      "value": "#7740ff",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.primary.base",
+      "value": "#0861ff",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.primary.contrast",
+      "value": "#ffffff",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.success.base",
+      "value": "#26d07c",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.success.contrast",
+      "value": "#ffffff",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.danger.base",
+      "value": "#df4661",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.danger.contrast",
+      "value": "#ffffff",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.warning.base",
+      "value": "#f7b500",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.warning.contrast",
+      "value": "#ffffff",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.info.base",
+      "value": "#009cde",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.info.contrast",
+      "value": "#ffffff",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.accent.base",
+      "value": "#7740ff",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$colors.accent.contrast",
+      "value": "#ffffff",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$text-color",
+      "value": "var(--bth-color-text, #222222)",
+      "cssVariable": "--bth-color-text",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$border-color",
+      "value": "var(--bth-color-border, #d1d5db)",
+      "cssVariable": "--bth-color-border",
+      "file": "src/tokens/_colors.scss"
+    },
+    {
+      "name": "$radius-xs",
+      "value": "var(--bth-radius-xs, 6px)",
+      "cssVariable": "--bth-radius-xs",
+      "file": "src/tokens/_radius.scss"
+    },
+    {
+      "name": "$radius-sm",
+      "value": "var(--bth-radius-sm, 8px)",
+      "cssVariable": "--bth-radius-sm",
+      "file": "src/tokens/_radius.scss"
+    },
+    {
+      "name": "$radius-md",
+      "value": "var(--bth-radius-md, 10px)",
+      "cssVariable": "--bth-radius-md",
+      "file": "src/tokens/_radius.scss"
+    },
+    {
+      "name": "$radius-lg",
+      "value": "var(--bth-radius-lg, 12px)",
+      "cssVariable": "--bth-radius-lg",
+      "file": "src/tokens/_radius.scss"
+    },
+    {
+      "name": "$radius-xl",
+      "value": "var(--bth-radius-xl, 14px)",
+      "cssVariable": "--bth-radius-xl",
+      "file": "src/tokens/_radius.scss"
+    },
+    {
+      "name": "$control-height-xs",
+      "value": "var(--bth-control-height-xs, 24px)",
+      "cssVariable": "--bth-control-height-xs",
+      "file": "src/tokens/_sizing.scss"
+    },
+    {
+      "name": "$control-height-sm",
+      "value": "var(--bth-control-height-sm, 32px)",
+      "cssVariable": "--bth-control-height-sm",
+      "file": "src/tokens/_sizing.scss"
+    },
+    {
+      "name": "$control-height-md",
+      "value": "var(--bth-control-height-md, 40px)",
+      "cssVariable": "--bth-control-height-md",
+      "file": "src/tokens/_sizing.scss"
+    },
+    {
+      "name": "$control-height-lg",
+      "value": "var(--bth-control-height-lg, 48px)",
+      "cssVariable": "--bth-control-height-lg",
+      "file": "src/tokens/_sizing.scss"
+    },
+    {
+      "name": "$control-height-xl",
+      "value": "var(--bth-control-height-xl, 56px)",
+      "cssVariable": "--bth-control-height-xl",
+      "file": "src/tokens/_sizing.scss"
+    },
+    {
+      "name": "$grid-system-point",
+      "value": "4px",
+      "file": "src/tokens/_spacing.scss"
+    },
+    {
+      "name": "$spacing-1x",
+      "value": "var(--bth-spacing-1x, 4px)",
+      "cssVariable": "--bth-spacing-1x",
+      "file": "src/tokens/_spacing.scss"
+    },
+    {
+      "name": "$spacing-2x",
+      "value": "var(--bth-spacing-2x, 8px)",
+      "cssVariable": "--bth-spacing-2x",
+      "file": "src/tokens/_spacing.scss"
+    },
+    {
+      "name": "$spacing-3x",
+      "value": "var(--bth-spacing-3x, 12px)",
+      "cssVariable": "--bth-spacing-3x",
+      "file": "src/tokens/_spacing.scss"
+    },
+    {
+      "name": "$spacing-4x",
+      "value": "var(--bth-spacing-4x, 16px)",
+      "cssVariable": "--bth-spacing-4x",
+      "file": "src/tokens/_spacing.scss"
+    },
+    {
+      "name": "$spacing-5x",
+      "value": "var(--bth-spacing-5x, 20px)",
+      "cssVariable": "--bth-spacing-5x",
+      "file": "src/tokens/_spacing.scss"
+    },
+    {
+      "name": "$spacing-6x",
+      "value": "var(--bth-spacing-6x, 24px)",
+      "cssVariable": "--bth-spacing-6x",
+      "file": "src/tokens/_spacing.scss"
+    },
+    {
+      "name": "$spacing-8x",
+      "value": "var(--bth-spacing-8x, 32px)",
+      "cssVariable": "--bth-spacing-8x",
+      "file": "src/tokens/_spacing.scss"
+    },
+    {
+      "name": "$spacing-10x",
+      "value": "var(--bth-spacing-10x, 40px)",
+      "cssVariable": "--bth-spacing-10x",
+      "file": "src/tokens/_spacing.scss"
+    },
+    {
+      "name": "$spacing-12x",
+      "value": "var(--bth-spacing-12x, 48px)",
+      "cssVariable": "--bth-spacing-12x",
+      "file": "src/tokens/_spacing.scss"
+    },
+    {
+      "name": "$opacity-hover",
+      "value": "var(--bth-opacity-hover, 0.88)",
+      "cssVariable": "--bth-opacity-hover",
+      "file": "src/tokens/_states.scss"
+    },
+    {
+      "name": "$opacity-active",
+      "value": "var(--bth-opacity-active, 0.76)",
+      "cssVariable": "--bth-opacity-active",
+      "file": "src/tokens/_states.scss"
+    },
+    {
+      "name": "$opacity-disabled",
+      "value": "var(--bth-opacity-disabled, 0.5)",
+      "cssVariable": "--bth-opacity-disabled",
+      "file": "src/tokens/_states.scss"
+    },
+    {
+      "name": "$tint-subtle",
+      "value": "var(--bth-tint-subtle, 10%)",
+      "cssVariable": "--bth-tint-subtle",
+      "file": "src/tokens/_states.scss"
+    },
+    {
+      "name": "$tint-hover",
+      "value": "var(--bth-tint-hover, 10%)",
+      "cssVariable": "--bth-tint-hover",
+      "file": "src/tokens/_states.scss"
+    },
+    {
+      "name": "$tint-active",
+      "value": "var(--bth-tint-active, 18%)",
+      "cssVariable": "--bth-tint-active",
+      "file": "src/tokens/_states.scss"
+    },
+    {
+      "name": "$font-family",
+      "value": "var(--bth-font-family, \"Geist\", sans-serif)",
+      "cssVariable": "--bth-font-family",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$font-size-xs",
+      "value": "var(--bth-font-size-xs, 0.75rem)",
+      "cssVariable": "--bth-font-size-xs",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$font-size-sm",
+      "value": "var(--bth-font-size-sm, 0.8125rem)",
+      "cssVariable": "--bth-font-size-sm",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$font-size-md",
+      "value": "var(--bth-font-size-md, 0.875rem)",
+      "cssVariable": "--bth-font-size-md",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$font-size-lg",
+      "value": "var(--bth-font-size-lg, 1rem)",
+      "cssVariable": "--bth-font-size-lg",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$font-size-xl",
+      "value": "var(--bth-font-size-xl, 1.125rem)",
+      "cssVariable": "--bth-font-size-xl",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$font-weight-regular",
+      "value": "var(--bth-font-weight-regular, 400)",
+      "cssVariable": "--bth-font-weight-regular",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$font-weight-medium",
+      "value": "var(--bth-font-weight-medium, 500)",
+      "cssVariable": "--bth-font-weight-medium",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$font-weight-semibold",
+      "value": "var(--bth-font-weight-semibold, 600)",
+      "cssVariable": "--bth-font-weight-semibold",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$line-height-none",
+      "value": "var(--bth-line-height-none, 1)",
+      "cssVariable": "--bth-line-height-none",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$line-height-tight",
+      "value": "var(--bth-line-height-tight, 1.2)",
+      "cssVariable": "--bth-line-height-tight",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$line-height-normal",
+      "value": "var(--bth-line-height-normal, 1.45)",
+      "cssVariable": "--bth-line-height-normal",
+      "file": "src/tokens/_typography.scss"
+    },
+    {
+      "name": "$icon-size",
+      "value": "var(--bth-icon-font-size, 24px)",
+      "cssVariable": "--bth-icon-font-size",
+      "file": "src/tokens/_typography.scss"
+    }
+  ]
+}

package/loader/cdn.js

@@ -0,0 +1 @@
+module.exports = require('../dist/cjs/loader.cjs.js');

package/loader/index.cjs.js

@@ -0,0 +1 @@
+module.exports = require('../dist/cjs/loader.cjs.js');

package/loader/index.d.ts

@@ -0,0 +1,24 @@
+export * from '../dist/types/components';
+export interface CustomElementsDefineOptions {
+  exclude?: string[];
+  resourcesUrl?: string;
+  syncQueue?: boolean;
+  jmp?: (c: Function) => any;
+  raf?: (c: FrameRequestCallback) => number;
+  ael?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
+}
+export declare function defineCustomElements(win?: Window, opts?: CustomElementsDefineOptions): Promise<void>;
+/**
+ * @deprecated
+ */
+export declare function applyPolyfills(): Promise<void>;
+
+/**
+ * Used to specify a nonce value that corresponds with an application's CSP.
+ * When set, the nonce will be added to all dynamically created script and style tags at runtime.
+ * Alternatively, the nonce value can be set on a meta tag in the DOM head
+ * (<meta name="csp-nonce" content="{ nonce value here }" />) which
+ * will result in the same behavior.
+ */
+export declare function setNonce(nonce: string): void;

package/loader/index.es2017.js

@@ -0,0 +1 @@
+export * from '../dist/esm/loader.js';

package/loader/index.js

@@ -0,0 +1,2 @@
+(function(){if("undefined"!==typeof window&&void 0!==window.Reflect&&void 0!==window.customElements){var a=HTMLElement;window.HTMLElement=function(){return Reflect.construct(a,[],this.constructor)};HTMLElement.prototype=a.prototype;HTMLElement.prototype.constructor=HTMLElement;Object.setPrototypeOf(HTMLElement,a)}})();
+export * from '../dist/esm/loader.js';

package/package.json

@@ -1,6 +1,57 @@
 {
   "name": "bth-ui",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.0.2",
+  "description": "Web components built with Stencil.js",
+  "main": "dist/index.cjs.js",
+  "module": "dist/index.js",
+  "types": "dist/types/index.d.ts",
+  "collection": "dist/collection/collection-manifest.json",
+  "collection:main": "dist/collection/index.js",
+  "unpkg": "dist/bth-ui/bth-ui.esm.js",
+  "exports": {
+    ".": {
+      "import": "./dist/bth-ui/bth-ui.esm.js",
+      "require": "./dist/bth-ui/bth-ui.cjs.js"
+    },
+    "./docs.json": {
+      "import": "./docs/docs.json"
+    },
+    "./loader": {
+      "import": "./loader/index.js",
+      "require": "./loader/index.cjs",
+      "types": "./loader/index.d.ts"
+    },
+    "./tokens.json": {
+      "import": "./docs/tokens.json"
+    }
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/pamelacfelipe/bth-ui.git"
+  },
+  "files": [
+    "dist/",
+    "docs/",
+    "loader/"
+  ],
+  "scripts": {
+    "build": "stencil build && node scripts/build-tokens.mjs",
+    "start": "stencil build --dev --watch --serve",
+    "test": "stencil-test --prod",
+    "test:watch": "stencil-test --prod --watch",
+    "generate": "stencil generate",
+    "check:docs": "node scripts/check-docs.mjs"
+  },
+  "devDependencies": {
+    "@stencil/core": "^4.27.1 || ^5.0.0-0",
+    "@stencil/sass": "^3.3.3",
+    "@stencil/vitest": "^1.8.3",
+    "@types/node": "^22.13.5",
+    "@vitest/browser-playwright": "^4.0.0",
+    "clsx": "^2.1.1",
+    "playwright": "^1.52.0",
+    "sass-embedded": "^1.105.1",
+    "vitest": "^4.0.0"
+  },
+  "license": "MIT"
+}

package/readme.md

@@ -0,0 +1,31 @@
+[![Built With Stencil](https://img.shields.io/badge/-Built%20With%20Stencil-16161d.svg?logo=data%3Aimage%2Fsvg%2Bxml%3Bbase64%2CPD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4KPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE5LjIuMSwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPgo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IgoJIHZpZXdCb3g9IjAgMCA1MTIgNTEyIiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IDAgMCA1MTIgNTEyOyIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI%2BCjxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI%2BCgkuc3Qwe2ZpbGw6I0ZGRkZGRjt9Cjwvc3R5bGU%2BCjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik00MjQuNywzNzMuOWMwLDM3LjYtNTUuMSw2OC42LTkyLjcsNjguNkgxODAuNGMtMzcuOSwwLTkyLjctMzAuNy05Mi43LTY4LjZ2LTMuNmgzMzYuOVYzNzMuOXoiLz4KPHBhdGggY2xhc3M9InN0MCIgZD0iTTQyNC43LDI5Mi4xSDE4MC40Yy0zNy42LDAtOTIuNy0zMS05Mi43LTY4LjZ2LTMuNkgzMzJjMzcuNiwwLDkyLjcsMzEsOTIuNyw2OC42VjI5Mi4xeiIvPgo8cGF0aCBjbGFzcz0ic3QwIiBkPSJNNDI0LjcsMTQxLjdIODcuN3YtMy42YzAtMzcuNiw1NC44LTY4LjYsOTIuNy02OC42SDMzMmMzNy45LDAsOTIuNywzMC43LDkyLjcsNjguNlYxNDEuN3oiLz4KPC9zdmc%2BCg%3D%3D&colorA=16161d&style=flat-square)](https://stenciljs.com)
+
+# Componentes do bth-ui
+
+## Iniciando
+
+Para começar a criar novos componentes, clone este repositório para um novo diretório:
+
+```bash
+git clone https://github.com/pamelacfelipe/bth-ui.git
+cd bth-ui
+```
+
+E executa:
+
+```bash
+npm install
+npm start
+```
+
+Para *buildar* os componentes para produção, rode:
+
+```bash
+npm run build
+```
+
+Para executar os testes dos componentes, rode:
+
+```bash
+npm test
+```

package/README.md

@@ -1,3 +0,0 @@
-# Temporary Holding Version
-
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.