@prioticket/design-system-web 1.0.7 → 1.1.0-beta.2

package/COMPONENT-DOCUMENTATION.md

@@ -1,6 +1,6 @@
 # @prioticket/design-system-web Components
 
-Version: 1.0.7
+Version: 1.1.0-beta.2
 
 ### <pd-button> (PdButton)
 

package/README.md

@@ -321,18 +321,37 @@ Choose `theme-only.css` to use your existing fonts, or `theme-with-fonts.css` fo
 
 ```bash
 # Install dependencies
-npm install
+yarn install
 
 # Start development server
-npm run dev
+yarn dev
 
 # Build the library
-npm run build
+yarn build
 
 # Run Storybook
-npm run storybook
+yarn storybook
 ```
 
+## Contributing
+
+This project is open for internal contributions. See our documentation:
+
+- **[CONTRIBUTING.md](CONTRIBUTING.md)** - Complete developer guide for adding components and features
+- **[RELEASE-SETUP.md](RELEASE-SETUP.md)** - CI/CD setup and release workflow
+
+### Quick Start for Contributors
+
+1. Clone the repository
+2. Install dependencies: `yarn install`
+3. Create a feature branch from `development`
+4. Make your changes and test in Storybook: `yarn storybook`
+5. Write tests: `yarn test`
+6. Commit using [Conventional Commits](https://www.conventionalcommits.org/): `git commit -m "feat: Add new feature"`
+7. Push and create a Merge Request to `development`
+
+Our automated CI/CD will handle versioning and publishing based on your commit messages.
+
 ## Source Code
 
 The source code for this library is proprietary and maintained in a private repository at Prioticket.

package/component-documentation.json

@@ -1,11 +1,11 @@
 {
   "package": {
     "name": "@prioticket/design-system-web",
-    "version": "1.0.7",
+    "version": "1.1.0-beta.2",
     "description": "",
     "installation": "npm install @prioticket/design-system-web"
   },
-  "generatedAt": "2025-09-30T13:55:32.011Z",
+  "generatedAt": "2025-11-12T19:28:18.786Z",
   "components": {
     "pd-button": {
       "tagName": "pd-button",

package/custom-elements.json

@@ -6266,6 +6266,357 @@
         }
       ]
     },
+    {
+      "kind": "javascript-module",
+      "path": "src/test/setup.ts",
+      "declarations": [],
+      "exports": []
+    },
+    {
+      "kind": "javascript-module",
+      "path": "src/test/test-utils.ts",
+      "declarations": [
+        {
+          "kind": "function",
+          "name": "waitForComponent",
+          "return": {
+            "type": {
+              "text": "Promise<void>"
+            }
+          },
+          "parameters": [
+            {
+              "name": "tagName",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "name": "timeout",
+              "default": "5000"
+            }
+          ],
+          "description": "Wait for a web component to be defined and upgraded"
+        },
+        {
+          "kind": "function",
+          "name": "createComponentFixture",
+          "return": {
+            "type": {
+              "text": "Promise<T>"
+            }
+          },
+          "parameters": [
+            {
+              "name": "tagName",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "name": "template",
+              "type": {
+                "text": "any"
+              }
+            }
+          ],
+          "description": "Create a test fixture for a web component\nEnsures the component is defined before creating the fixture"
+        },
+        {
+          "kind": "function",
+          "name": "waitForComponentUpdate",
+          "return": {
+            "type": {
+              "text": "Promise<void>"
+            }
+          },
+          "parameters": [
+            {
+              "name": "element",
+              "type": {
+                "text": "any"
+              }
+            },
+            {
+              "name": "timeout",
+              "default": "1000"
+            }
+          ],
+          "description": "Wait for component to complete its update cycle"
+        },
+        {
+          "kind": "function",
+          "name": "userInteraction",
+          "return": {
+            "type": {
+              "text": "Promise<void>"
+            }
+          },
+          "parameters": [
+            {
+              "name": "callback",
+              "type": {
+                "text": "() => void"
+              }
+            },
+            {
+              "name": "delay",
+              "default": "50"
+            }
+          ],
+          "description": "Simulate user interaction with a delay"
+        },
+        {
+          "kind": "function",
+          "name": "queryShadowRoot",
+          "return": {
+            "type": {
+              "text": "T | null"
+            }
+          },
+          "parameters": [
+            {
+              "name": "element",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "name": "selector",
+              "type": {
+                "text": "string"
+              }
+            }
+          ],
+          "description": "Query shadow DOM"
+        },
+        {
+          "kind": "function",
+          "name": "queryShadowRootAll",
+          "return": {
+            "type": {
+              "text": "T[]"
+            }
+          },
+          "parameters": [
+            {
+              "name": "element",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "name": "selector",
+              "type": {
+                "text": "string"
+              }
+            }
+          ],
+          "description": "Query all in shadow DOM"
+        },
+        {
+          "kind": "function",
+          "name": "getShadowStyle",
+          "return": {
+            "type": {
+              "text": "string"
+            }
+          },
+          "parameters": [
+            {
+              "name": "element",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "name": "property",
+              "type": {
+                "text": "string"
+              }
+            }
+          ],
+          "description": "Get computed styles from shadow DOM element"
+        },
+        {
+          "kind": "function",
+          "name": "dispatchEventAndWait",
+          "return": {
+            "type": {
+              "text": "Promise<CustomEvent>"
+            }
+          },
+          "parameters": [
+            {
+              "name": "element",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "name": "eventName",
+              "type": {
+                "text": "string"
+              }
+            },
+            {
+              "name": "detail",
+              "optional": true,
+              "type": {
+                "text": "any"
+              }
+            }
+          ],
+          "description": "Dispatch a custom event and wait for it to be handled"
+        },
+        {
+          "kind": "function",
+          "name": "waitForVisible",
+          "return": {
+            "type": {
+              "text": "Promise<void>"
+            }
+          },
+          "parameters": [
+            {
+              "name": "element",
+              "type": {
+                "text": "HTMLElement"
+              }
+            },
+            {
+              "name": "timeout",
+              "default": "3000"
+            }
+          ],
+          "description": "Wait for an element to be visible"
+        },
+        {
+          "kind": "function",
+          "name": "getCSSCustomProperties",
+          "return": {
+            "type": {
+              "text": "Record<string, string>"
+            }
+          },
+          "parameters": [
+            {
+              "name": "element",
+              "type": {
+                "text": "HTMLElement"
+              }
+            }
+          ],
+          "description": "Get all CSS custom properties from an element"
+        }
+      ],
+      "exports": [
+        {
+          "kind": "js",
+          "name": "waitForComponent",
+          "declaration": {
+            "name": "waitForComponent",
+            "module": "src/test/test-utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "createComponentFixture",
+          "declaration": {
+            "name": "createComponentFixture",
+            "module": "src/test/test-utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "waitForComponentUpdate",
+          "declaration": {
+            "name": "waitForComponentUpdate",
+            "module": "src/test/test-utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "userInteraction",
+          "declaration": {
+            "name": "userInteraction",
+            "module": "src/test/test-utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "queryShadowRoot",
+          "declaration": {
+            "name": "queryShadowRoot",
+            "module": "src/test/test-utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "queryShadowRootAll",
+          "declaration": {
+            "name": "queryShadowRootAll",
+            "module": "src/test/test-utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "getShadowStyle",
+          "declaration": {
+            "name": "getShadowStyle",
+            "module": "src/test/test-utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "dispatchEventAndWait",
+          "declaration": {
+            "name": "dispatchEventAndWait",
+            "module": "src/test/test-utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "waitForVisible",
+          "declaration": {
+            "name": "waitForVisible",
+            "module": "src/test/test-utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "getCSSCustomProperties",
+          "declaration": {
+            "name": "getCSSCustomProperties",
+            "module": "src/test/test-utils.ts"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "html",
+          "declaration": {
+            "name": "html",
+            "package": "@open-wc/testing"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "fixture",
+          "declaration": {
+            "name": "fixture",
+            "package": "@open-wc/testing"
+          }
+        },
+        {
+          "kind": "js",
+          "name": "wcExpect",
+          "declaration": {
+            "name": "expect",
+            "package": "@open-wc/testing"
+          }
+        }
+      ]
+    },
     {
       "kind": "javascript-module",
       "path": "src/theming/index.ts",

package/dist/types/test/setup.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/test/test-utils.d.ts

@@ -0,0 +1,42 @@
+/**
+ * Wait for a web component to be defined and upgraded
+ */
+export declare function waitForComponent(tagName: string, timeout?: number): Promise<void>;
+/**
+ * Create a test fixture for a web component
+ * Ensures the component is defined before creating the fixture
+ */
+export declare function createComponentFixture<T extends HTMLElement>(tagName: string, template: any): Promise<T>;
+/**
+ * Wait for component to complete its update cycle
+ */
+export declare function waitForComponentUpdate(element: any, timeout?: number): Promise<void>;
+/**
+ * Simulate user interaction with a delay
+ */
+export declare function userInteraction(callback: () => void, delay?: number): Promise<void>;
+/**
+ * Query shadow DOM
+ */
+export declare function queryShadowRoot<T extends Element>(element: HTMLElement, selector: string): T | null;
+/**
+ * Query all in shadow DOM
+ */
+export declare function queryShadowRootAll<T extends Element>(element: HTMLElement, selector: string): T[];
+/**
+ * Get computed styles from shadow DOM element
+ */
+export declare function getShadowStyle(element: HTMLElement, property: string): string;
+/**
+ * Dispatch a custom event and wait for it to be handled
+ */
+export declare function dispatchEventAndWait(element: HTMLElement, eventName: string, detail?: any): Promise<CustomEvent>;
+/**
+ * Wait for an element to be visible
+ */
+export declare function waitForVisible(element: HTMLElement, timeout?: number): Promise<void>;
+/**
+ * Get all CSS custom properties from an element
+ */
+export declare function getCSSCustomProperties(element: HTMLElement): Record<string, string>;
+export { html, fixture, expect as wcExpect } from '@open-wc/testing';

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@prioticket/design-system-web",
-  "private": false,
-  "version": "1.0.7",
+  "version": "1.1.0-beta.2",
   "type": "module",
+  "packageManager": "yarn@3.6.4",
   "main": "./dist/prioticket-design-system-web.cjs.js",
   "module": "./dist/prioticket-design-system-web.es.js",
   "types": "./dist/types/index.d.ts",
@@ -62,10 +62,17 @@
     "dev": "vite",
     "build": "tsc && vite build && tsc --project tsconfig.build.json && node scripts/copy-css.js",
     "preview": "vite preview",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "test:ui": "vitest --ui",
+    "test:coverage": "vitest run --coverage",
+    "test:web": "vitest run src/components",
+    "test:react": "vitest run packages/react",
     "storybook": "storybook dev -p 6006",
     "build-storybook": "storybook build",
-    "chromatic": "chromatic --project-token=chpt_5c8c5ef4fd7f67b",
-    "prepublishOnly": "npm run build:packages && npm run docs",
+    "chromatic": "chromatic",
+    "prepare": "husky || true",
+    "prepublishOnly": "npm run build:packages && npm run docs && npm run test",
     "docs:manifest": "node scripts/build-manifest.mjs",
     "docs:build": "node scripts/generate-docs.mjs",
     "docs": "npm run docs:manifest && npm run docs:build",
@@ -74,7 +81,8 @@
     "build:packages": "npm run build && npm run react:build",
     "publish:web": "npm publish --access public --ignore-scripts",
     "publish:react": "npm publish --workspace packages/react --access public --ignore-scripts",
-    "publish:packages": "npm run build:packages && npm run docs && npm run publish:web && npm run publish:react"
+    "publish:packages": "npm run build:packages && npm run docs && npm run publish:web && npm run publish:react",
+    "semantic-release": "semantic-release"
   },
   "keywords": [
     "design-system",
@@ -95,28 +103,41 @@
     "lit": "^3.3.1"
   },
   "devDependencies": {
-    "@chromatic-com/storybook": "^4.1.1",
+    "@chromatic-com/storybook": "^4.1.2",
+    "@commitlint/cli": "^19.6.0",
+    "@commitlint/config-conventional": "^19.6.0",
+    "@custom-elements-manifest/analyzer": "^0.9.6",
     "@material/web": "^2.4.0",
-    "@storybook/addon-a11y": "^9.1.3",
-    "@storybook/addon-docs": "^9.1.3",
-    "@storybook/addon-vitest": "^9.1.3",
-    "@storybook/web-components-vite": "^9.1.3",
+    "@open-wc/testing": "^4.0.0",
+    "@semantic-release/changelog": "^6.0.3",
+    "@semantic-release/exec": "^6.0.3",
+    "@semantic-release/git": "^10.0.1",
+    "@storybook/addon-a11y": "^10.0.7",
+    "@storybook/addon-docs": "^10.0.7",
+    "@storybook/addon-vitest": "^10.0.7",
+    "@storybook/web-components-vite": "^10.0.7",
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.1.0",
+    "@testing-library/user-event": "^14.5.2",
     "@types/node": "^24.3.1",
+    "@types/react": "^18.3.5",
+    "@types/react-dom": "^18.3.0",
     "@vitest/browser": "^3.2.4",
     "@vitest/coverage-v8": "^3.2.4",
     "chromatic": "^13.1.3",
     "glob": "^11.0.3",
+    "happy-dom": "^15.11.7",
+    "husky": "^9.1.7",
     "lit": "^3.3.1",
     "playwright": "^1.55.0",
-    "storybook": "^9.1.3",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "semantic-release": "^24.2.0",
+    "semantic-release-monorepo": "^8.0.2",
+    "storybook": "^10.0.7",
     "typescript": "~5.8.3",
     "vite": "^7.1.2",
-    "vitest": "^3.2.4",
-    "@custom-elements-manifest/analyzer": "^0.9.6",
-    "@types/react": "^18.3.5",
-    "@types/react-dom": "^18.3.0",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1"
+    "vitest": "^3.2.4"
   },
   "workspaces": [
     "packages/react"