@usecapsule/core-components 3.1.3 → 3.2.0-dev.0

package/dist/types/components.d.ts

@@ -332,6 +332,12 @@ export namespace Components {
          */
         "fixed": boolean;
     }
+    interface CpslHero {
+        /**
+          * The variant of the button. Options are: `"default"`, `"loading", `"success". Default is: `"default"`.
+         */
+        "variant"?: 'connection' | 'pending' | 'approved' | 'failed';
+    }
     interface CpslIcon {
         /**
           * The name of the icon. If both `icon` and `src` are provided, `icon` will be used.
@@ -342,6 +348,13 @@ export namespace Components {
          */
         "src"?: string;
     }
+    interface CpslIdenticon {
+        "hash": string;
+        /**
+          * The size of the identicon. Default is: 40.
+         */
+        "size": number;
+    }
     interface CpslInfoBox {
     }
     interface CpslInput {
@@ -988,12 +1001,24 @@ declare global {
         prototype: HTMLCpslGridElement;
         new (): HTMLCpslGridElement;
     };
+    interface HTMLCpslHeroElement extends Components.CpslHero, HTMLStencilElement {
+    }
+    var HTMLCpslHeroElement: {
+        prototype: HTMLCpslHeroElement;
+        new (): HTMLCpslHeroElement;
+    };
     interface HTMLCpslIconElement extends Components.CpslIcon, HTMLStencilElement {
     }
     var HTMLCpslIconElement: {
         prototype: HTMLCpslIconElement;
         new (): HTMLCpslIconElement;
     };
+    interface HTMLCpslIdenticonElement extends Components.CpslIdenticon, HTMLStencilElement {
+    }
+    var HTMLCpslIdenticonElement: {
+        prototype: HTMLCpslIdenticonElement;
+        new (): HTMLCpslIdenticonElement;
+    };
     interface HTMLCpslInfoBoxElement extends Components.CpslInfoBox, HTMLStencilElement {
     }
     var HTMLCpslInfoBoxElement: {
@@ -1295,7 +1320,9 @@ declare global {
         "cpsl-dropdown": HTMLCpslDropdownElement;
         "cpsl-file-upload": HTMLCpslFileUploadElement;
         "cpsl-grid": HTMLCpslGridElement;
+        "cpsl-hero": HTMLCpslHeroElement;
         "cpsl-icon": HTMLCpslIconElement;
+        "cpsl-identicon": HTMLCpslIdenticonElement;
         "cpsl-info-box": HTMLCpslInfoBoxElement;
         "cpsl-input": HTMLCpslInputElement;
         "cpsl-modal": HTMLCpslModalElement;
@@ -1664,6 +1691,12 @@ declare namespace LocalJSX {
          */
         "fixed"?: boolean;
     }
+    interface CpslHero {
+        /**
+          * The variant of the button. Options are: `"default"`, `"loading", `"success". Default is: `"default"`.
+         */
+        "variant"?: 'connection' | 'pending' | 'approved' | 'failed';
+    }
     interface CpslIcon {
         /**
           * The name of the icon. If both `icon` and `src` are provided, `icon` will be used.
@@ -1674,6 +1707,13 @@ declare namespace LocalJSX {
          */
         "src"?: string;
     }
+    interface CpslIdenticon {
+        "hash"?: string;
+        /**
+          * The size of the identicon. Default is: 40.
+         */
+        "size"?: number;
+    }
     interface CpslInfoBox {
     }
     interface CpslInput {
@@ -2224,7 +2264,9 @@ declare namespace LocalJSX {
         "cpsl-dropdown": CpslDropdown;
         "cpsl-file-upload": CpslFileUpload;
         "cpsl-grid": CpslGrid;
+        "cpsl-hero": CpslHero;
         "cpsl-icon": CpslIcon;
+        "cpsl-identicon": CpslIdenticon;
         "cpsl-info-box": CpslInfoBox;
         "cpsl-input": CpslInput;
         "cpsl-modal": CpslModal;
@@ -2269,7 +2311,9 @@ declare module "@stencil/core" {
             "cpsl-dropdown": LocalJSX.CpslDropdown & JSXBase.HTMLAttributes<HTMLCpslDropdownElement>;
             "cpsl-file-upload": LocalJSX.CpslFileUpload & JSXBase.HTMLAttributes<HTMLCpslFileUploadElement>;
             "cpsl-grid": LocalJSX.CpslGrid & JSXBase.HTMLAttributes<HTMLCpslGridElement>;
+            "cpsl-hero": LocalJSX.CpslHero & JSXBase.HTMLAttributes<HTMLCpslHeroElement>;
             "cpsl-icon": LocalJSX.CpslIcon & JSXBase.HTMLAttributes<HTMLCpslIconElement>;
+            "cpsl-identicon": LocalJSX.CpslIdenticon & JSXBase.HTMLAttributes<HTMLCpslIdenticonElement>;
             "cpsl-info-box": LocalJSX.CpslInfoBox & JSXBase.HTMLAttributes<HTMLCpslInfoBoxElement>;
             "cpsl-input": LocalJSX.CpslInput & JSXBase.HTMLAttributes<HTMLCpslInputElement>;
             "cpsl-modal": LocalJSX.CpslModal & JSXBase.HTMLAttributes<HTMLCpslModalElement>;

package/dist/types/interface.d.ts

@@ -1,4 +1,5 @@
 import { Icons } from './assets/icons';
+import { Images } from './assets/images';
 export type PredefinedColors = 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger' | 'light' | 'medium' | 'dark';
 export type AutocompleteTypes = 'on' | 'off' | 'name' | 'honorific-prefix' | 'given-name' | 'additional-name' | 'family-name' | 'honorific-suffix' | 'nickname' | 'email' | 'username' | 'new-password' | 'current-password' | 'one-time-code' | 'organization-title' | 'organization' | 'street-address' | 'address-line1' | 'address-line2' | 'address-line3' | 'address-level4' | 'address-level3' | 'address-level2' | 'address-level1' | 'country' | 'country-name' | 'postal-code' | 'cc-name' | 'cc-given-name' | 'cc-additional-name' | 'cc-family-name' | 'cc-family-name' | 'cc-number' | 'cc-exp' | 'cc-exp-month' | 'cc-exp-year' | 'cc-csc' | 'cc-type' | 'transaction-currency' | 'transaction-amount' | 'language' | 'bday' | 'bday-day' | 'bday-month' | 'bday-year' | 'sex' | 'tel' | 'tel-country-code' | 'tel-national' | 'tel-area-code' | 'tel-local' | 'tel-extension' | 'impp' | 'url' | 'photo';
 export type TextFieldTypes = 'date' | 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url' | 'time' | 'week' | 'month' | 'datetime-local';
@@ -8,6 +9,7 @@ export type CssClassMap = {
     [className: string]: boolean;
 };
 export type IconType = keyof typeof Icons;
+export type ImageType = keyof typeof Images;
 export type Theme = {
     foregroundColor?: string;
     backgroundColor?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@usecapsule/core-components",
-  "version": "3.1.3",
+  "version": "3.2.0-dev.0",
   "description": "Capsule Core Components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",
@@ -16,14 +16,16 @@
     "css/"
   ],
   "scripts": {
-    "build": "yarn build:icons && yarn build:css && stencil build",
-    "start": "yarn build:icons && yarn build:css && stencil build --dev --watch --serve",
+    "build": "yarn build:assets && yarn build:css && stencil build",
+    "start": "yarn build:assets && yarn build:css && stencil build --dev --watch --serve",
     "test": "stencil test --spec --e2e",
     "test.watch": "stencil test --spec --e2e --watchAll",
     "generate": "stencil generate",
     "lint": "eslint src/**/*{.ts,.tsx}",
     "build:css": "sass --embed-sources src/css:./css",
-    "build:icons": "ts-node -T ./scripts/buildIconLibrary.ts"
+    "build:assets": "ts-node -T ./scripts/buildAssets.ts",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
   },
   "dependencies": {
     "@stencil/core": "^4.7.0",
@@ -34,22 +36,35 @@
     "qr-code-styling": "^1.6.0-rc.1"
   },
   "devDependencies": {
+    "@babel/plugin-transform-react-jsx": "^7.24.7",
     "@stencil-community/eslint-plugin": "^0.7.2",
     "@stencil/react-output-target": "^0.5.3",
     "@stencil/sass": "^3.0.10",
+    "@storybook/addon-essentials": "^8.1.11",
+    "@storybook/addon-interactions": "^8.1.11",
+    "@storybook/addon-links": "^8.1.11",
+    "@storybook/addon-notes": "^5.3.21",
+    "@storybook/addon-webpack5-compiler-swc": "^1.0.4",
+    "@storybook/blocks": "^8.1.11",
+    "@storybook/html": "^8.1.11",
+    "@storybook/html-webpack5": "^8.1.11",
+    "@storybook/test": "^8.1.11",
     "@types/jest": "^29.5.6",
     "@types/node": "^16.18.11",
     "@typescript-eslint/eslint-plugin": "^7.1.1",
     "@typescript-eslint/parser": "^7.1.1",
     "eslint": "^8.57.0",
     "eslint-plugin-react": "^7.34.0",
+    "eslint-plugin-storybook": "^0.8.0",
     "jest": "^29.7.0",
     "jest-cli": "^29.7.0",
     "puppeteer": "^21.9.0",
     "rollup-plugin-dotenv": "^0.5.0",
+    "rollup-plugin-node-polyfills": "^0.2.1",
     "sass": "^1.71.1",
     "stencil-inline-svg": "^1.1.0",
+    "storybook": "^8.1.11",
     "ts-node": "^10.9.2"
   },
-  "gitHead": "053223d08103dd92ba69ec487393ccfdce00436a"
+  "gitHead": "ca0d8cab915d9cef706c8dd619176032cdcd165f"
 }

package/dist/capsule/p-2c16694d.entry.js

@@ -1,2 +0,0 @@
-import{r as s,h as r,H as a}from"./p-7dde3172.js";const e=":host{display:flex;flex-wrap:wrap}";const f=e;const o=class{constructor(r){s(this,r)}render(){return r(a,{key:"7f72521f5a00092d54fb143c73334dfdc8d5daf7"},r("slot",{key:"a23bda8f3a3178b61e409f73e6004586f8b26509"}))}};o.style=f;export{o as cpsl_row};
-//# sourceMappingURL=p-2c16694d.entry.js.map