@idp.global/catalog 1.1.1

package/dist_watch/index.html

@@ -0,0 +1,29 @@
+<!--gitzone element-->
+<!-- made by Task Venture Capital GmbH -->
+<!-- checkout https://maintainedby.lossless.com for awesome OpenSource projects -->
+<html lang="en">
+  <head>
+    <!--Lets set some basic meta tags-->
+    <meta
+      name="viewport"
+      content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height"
+    />
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
+    <!--Lets load standard fonts-->
+    <link rel="preconnect" href="https://assetbroker.lossless.one/" crossorigin>
+    <link rel="stylesheet" href="https://assetbroker.lossless.one/fonts/fonts.css">
+    <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233b82f6' d='M12 2l8 3v7c0 6-8 10-8 10s-8-4-8-10V5l8-3z'/%3E%3C/svg%3E">
+
+    <style>
+      body {
+        margin: 0px;
+        background: #222222;
+      }
+    </style>
+
+    <script type="module" src="/bundle.js"></script>
+  </head>
+  <body>
+  </body>
+</html>

package/html/index.html

@@ -0,0 +1,29 @@
+<!--gitzone element-->
+<!-- made by Task Venture Capital GmbH -->
+<!-- checkout https://maintainedby.lossless.com for awesome OpenSource projects -->
+<html lang="en">
+  <head>
+    <!--Lets set some basic meta tags-->
+    <meta
+      name="viewport"
+      content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height"
+    />
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+
+    <!--Lets load standard fonts-->
+    <link rel="preconnect" href="https://assetbroker.lossless.one/" crossorigin>
+    <link rel="stylesheet" href="https://assetbroker.lossless.one/fonts/fonts.css">
+    <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%233b82f6' d='M12 2l8 3v7c0 6-8 10-8 10s-8-4-8-10V5l8-3z'/%3E%3C/svg%3E">
+
+    <style>
+      body {
+        margin: 0px;
+        background: #222222;
+      }
+    </style>
+
+    <script type="module" src="/bundle.js"></script>
+  </head>
+  <body>
+  </body>
+</html>

package/html/index.ts

@@ -0,0 +1,39 @@
+// dees tools
+import * as deesWccTools from '@design.estate/dees-wcctools';
+import * as deesDomTools from '@design.estate/dees-domtools';
+
+// elements and pages
+import * as elements from '../ts_web/elements/index.js';
+import * as pages from '../ts_web/pages/index.js';
+
+const fullPageElementNames = new Set([
+  'IdpAdminShell',
+  'IdpLandingPage',
+  'IdpMobileShowcase',
+]);
+
+deesWccTools.setupWccTools({
+  sections: [
+    {
+      name: 'Full Pages',
+      type: 'pages',
+      items: pages,
+      icon: 'web',
+    },
+    {
+      name: 'Composed Views',
+      type: 'elements',
+      items: elements,
+      icon: 'dashboard',
+      filter: (nameArg) => fullPageElementNames.has(nameArg) || ['IdpDashboardWindow', 'IdpLandingHero', 'IdpInboxPreview'].includes(nameArg),
+    },
+    {
+      name: 'Primitives',
+      type: 'elements',
+      items: elements,
+      icon: 'category',
+      filter: (nameArg) => nameArg.startsWith('Idp') && !fullPageElementNames.has(nameArg) && !['IdpDashboardWindow', 'IdpLandingHero', 'IdpInboxPreview'].includes(nameArg),
+    },
+  ],
+});
+deesDomTools.elementBasic.setup();

package/license

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 Task Venture Capital GmbH
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/package.json

@@ -0,0 +1,64 @@
+{
+  "name": "@idp.global/catalog",
+  "version": "1.1.1",
+  "private": false,
+  "description": "Web component catalog for idp.global, based on the v3 product design language.",
+  "exports": {
+    ".": "./dist_ts_web/index.js"
+  },
+  "main": "dist_ts_web/index.js",
+  "typings": "dist_ts_web/index.d.ts",
+  "type": "module",
+  "author": "Task Venture Capital GmbH",
+  "license": "MIT",
+  "dependencies": {
+    "@design.estate/dees-catalog": "^3.81.0",
+    "@design.estate/dees-domtools": "^2.5.6",
+    "@design.estate/dees-element": "^2.2.4",
+    "@design.estate/dees-wcctools": "^3.9.0",
+    "lucide": "^1.16.0"
+  },
+  "devDependencies": {
+    "@git.zone/tsbuild": "^4.4.1",
+    "@git.zone/tsbundle": "^2.10.4",
+    "@git.zone/tswatch": "^3.3.5",
+    "@push.rocks/projectinfo": "^5.1.0",
+    "@types/node": "^25.9.0"
+  },
+  "files": [
+    "ts_web/**/*",
+    "dist/**/*",
+    "dist_*/**/*",
+    "dist_ts_web/**/*",
+    "assets/**/*",
+    "html/**/*",
+    "license",
+    "readme.md",
+    "changelog.md"
+  ],
+  "repository": {
+    "type": "git",
+    "url": "git+ssh://git@code.foss.global:29419/idp.global/catalog.git"
+  },
+  "bugs": {
+    "url": "https://code.foss.global/idp.global/catalog/issues"
+  },
+  "homepage": "https://code.foss.global/idp.global/catalog#readme",
+  "browserslist": [
+    "last 1 Chrome versions"
+  ],
+  "keywords": [
+    "idp.global",
+    "catalog",
+    "web components",
+    "identity",
+    "authentication",
+    "design system"
+  ],
+  "scripts": {
+    "test": "pnpm run build",
+    "build": "tsbuild tsfolders --allowimplicitany && tsbundle",
+    "watch": "tswatch",
+    "buildDocs": "tsdoc"
+  }
+}

package/readme.md

@@ -0,0 +1,103 @@
+# @idp.global/catalog
+
+Web component catalog for idp.global, based on the v3 product design language.
+
+This package turns the current identity product direction into reusable custom elements for landing pages, approval surfaces, account/admin shells, mobile passport previews, and full-page product showcases.
+
+## Issue Reporting and Security
+
+For reporting bugs, issues, or security vulnerabilities, please visit [community.foss.global/](https://community.foss.global/). This is the central community hub for all issue reporting. Developers who sign and comply with our contribution agreement and go through identification can also get a [code.foss.global/](https://code.foss.global/) account to submit Pull Requests directly.
+
+## Install
+
+```bash
+pnpm add @idp.global/catalog
+```
+
+## Usage
+
+Import the package once in your frontend entrypoint so the custom elements are registered.
+
+```ts
+import '@idp.global/catalog';
+```
+
+Then compose the elements in HTML, Lit, or any framework that can render custom elements.
+
+```html
+<idp-landing-hero></idp-landing-hero>
+<idp-approval-card app-name="GitHub" request-text="Sign in to github.com"></idp-approval-card>
+<idp-mobile-showcase></idp-mobile-showcase>
+```
+
+The package also exports the TypeScript types for the interactive elements and admin shell events, so applications can strongly type `idp-submit`, `idp-select`, and account-management handlers.
+
+```ts
+import type {
+  IIdpFormSubmitEventDetail,
+  IIdpSelectOption,
+  IIdpAdminNavigateEventDetail,
+} from '@idp.global/catalog';
+```
+
+## Element Surface
+
+| Element | Purpose |
+| --- | --- |
+| `idp-button` | Product button variants |
+| `idp-badge` | Small status labels and pills |
+| `idp-card` | Bordered content containers |
+| `idp-input` | Text, password, and email inputs |
+| `idp-checkbox` | Required consent and boolean inputs |
+| `idp-form` | Form composition with validation, status, and `idp-submit` events |
+| `idp-form-submit` | Full-width catalog submit action for `idp-form` |
+| `idp-select` | Select/dropdown controls with `idp-select` events |
+| `idp-toggle` | Compact boolean controls |
+| `idp-icon` | Bundled monochrome identity icons |
+| `idp-approval-card` | Approve/deny identity request cards |
+| `idp-inbox-preview` | Mobile approval inbox previews |
+| `idp-mobile-frame` | iOS-style product screenshots |
+| `idp-dashboard-window` | Desktop dashboard preview window |
+| `idp-admin-shell` | Account and organization admin layout preview |
+| `idp-landing-hero` | Public landing hero section |
+| `idp-landing-page` | Full public landing page composition |
+| `idp-mobile-showcase` | Mobile, watch, tablet, and desktop showcase composition |
+
+## Design Language
+
+The catalog uses shared tokens from `ts_web/elements/tokens.ts` for color, type, spacing, borders, and product chrome. The visual system is intentionally product-facing: dark identity surfaces, sharp admin panels, mobile passport cards, and high-contrast approval states.
+
+## Scope
+
+This package is component-only. It does not perform authentication, store sessions, call the idp.global backend, or implement business logic. Use it together with `@idp.global/sdk/browser` and `@idp.global/interfaces` when you need live identity behavior.
+
+## Development
+
+```bash
+pnpm install
+pnpm run build
+pnpm test
+```
+
+The source entrypoint is `ts_web/index.ts`; it exports the element catalog from `ts_web/elements/index.ts`.
+
+## License and Legal Information
+
+This repository contains open-source code licensed under the MIT License. A copy of the license can be found in the [license](./license) file.
+
+**Please note:** The MIT License does not grant permission to use the trade names, trademarks, service marks, or product names of the project, except as required for reasonable and customary use in describing the origin of the work and reproducing the content of the NOTICE file.
+
+### Trademarks
+
+This project is owned and maintained by Task Venture Capital GmbH. The names and logos associated with Task Venture Capital GmbH and any related products or services are trademarks of Task Venture Capital GmbH or third parties, and are not included within the scope of the MIT license granted herein.
+
+Use of these trademarks must comply with Task Venture Capital GmbH's Trademark Guidelines or the guidelines of the respective third-party owners, and any usage must be approved in writing. Third-party trademarks used herein are the property of their respective owners and used only in a descriptive manner, e.g. for an implementation of an API or similar.
+
+### Company Information
+
+Task Venture Capital GmbH  
+Registered at District Court Bremen HRB 35230 HB, Germany
+
+For any legal inquiries or further information, please contact us via email at hello@task.vc.
+
+By using this repository, you acknowledge that you have read this section, agree to comply with its terms, and understand that the licensing of the code does not imply endorsement by Task Venture Capital GmbH of any derivative works.

package/ts_web/00_commitinfo_data.ts

@@ -0,0 +1,8 @@
+/**
+ * autocreated commitinfo by @push.rocks/commitinfo
+ */
+export const commitinfo = {
+  name: '@idp.global/catalog',
+  version: '1.1.1',
+  description: 'Web component catalog for idp.global, based on the v3 product design language.'
+}