@imagineio/configurator-sdk 0.1.0-beta.1

package/dist/styles/variables.css

@@ -0,0 +1,299 @@
+@layer sdk-base, vendor, sdk;
+@layer sdk-base {
+:root {
+  /* ============================================
+     BRAND COLORS
+     ============================================ */
+  --color-brand-primary: #ff5722;
+  --color-brand-primary-rgb: 255, 87, 34; /* For rgba() usage */
+  --color-brand-primary-dark: #e64a19;
+  --color-brand-primary-light: #ff8a65;
+  --color-brand-secondary: #424242;
+  --color-brand-accent: #ff9800;
+
+  /* ============================================
+     INTERACTIVE COLORS (Selection, Hover, Focus)
+     ============================================ */
+  --color-selection: #4a90d9;
+  --color-selection-rgb: 74, 144, 217; /* For rgba() usage */
+  --color-selection-light: rgba(74, 144, 217, 0.1);
+  --color-selection-medium: rgba(74, 144, 217, 0.2);
+  --color-selection-border: rgba(74, 144, 217, 0.4);
+  --color-hover: #363636;
+  --color-active: #363636;
+
+  /* ============================================
+     STATUS/FEEDBACK COLORS
+     ============================================ */
+  --color-success: #4caf50;
+  --color-success-light: #10b981;
+  --color-warning: #ff9800;
+  --color-error: #f44336;
+  --color-danger: #dc2626;
+  --color-danger-bg: #fee2e2;
+  --color-info: #2196f3;
+
+  /* ============================================
+     NEUTRAL/GRAY SCALE
+     (900 = darkest, 50 = lightest)
+     ============================================ */
+  --color-neutral-900: #363636;
+  --color-neutral-800: #333333;
+  --color-neutral-700: #555555;
+  --color-neutral-600: #666666;
+  --color-neutral-500: #888888;
+  --color-neutral-400: #999999;
+  --color-neutral-300: #dddddd;
+  --color-neutral-200: #e1e1e1;
+  --color-neutral-100: #e8e8e8;
+  --color-neutral-50: #f0f0f0;
+  --color-neutral-disabled: #9ca3af;
+
+  /* ============================================
+     BACKGROUND COLORS
+     ============================================ */
+  --bg-primary: #ffffff;
+  --bg-secondary: #f5f5f5;
+  --bg-tertiary: #eeeeee;
+  --bg-muted: #f7f7f7;
+  --bg-dark: #1a1a1a;
+  --bg-scene: #fff;
+  --bg-disabled: #f3f4f6;
+  --bg-tooltip: rgba(0, 0, 0, 0.8);
+  --bg-overlay: rgba(0, 0, 0, 0.4);
+  --bg-wall: #e8e2dc;
+
+  /* ============================================
+     TEXT COLORS
+     ============================================ */
+  --text-primary: #1a1a1a;
+  --text-secondary: #666666;
+  --text-muted: #888888;
+  --text-tertiary: #999999;
+  --text-disabled: #cccccc;
+  --text-inverse: #ffffff;
+  --text-link: #4a90d9;
+
+  /* ============================================
+     BORDER COLORS
+     ============================================ */
+  --border-default: #e5e5e5;
+  --border-light: #e1e1e1;
+  --border-dark: #cccccc;
+  --border-disabled: #d1d5db;
+  --border-selected: #363636;
+
+  /* ============================================
+     PREVIEW COLORS (option / layout thumbnails)
+     ============================================ */
+  --preview-wood-light: #c4a070;
+  --preview-wood: #b89060;
+  --preview-wood-dark: #a8845a;
+  --preview-slab-light: #d0d0d0;
+  --preview-slab-dark: #c0c0c0;
+  --preview-glass-border: #a0a0a0;
+  --preview-countertop: #e0e0e0;
+  --preview-floor-light: #e8e8e8;
+  --preview-floor-dark: #dddddd;
+
+  /* ============================================
+     TYPOGRAPHY
+     ============================================ */
+  --font-family-base: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+  --font-family-heading: "PP Neue Montreal", -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+  --font-family-mono: 'SF Mono', 'Monaco', 'Inconsolata', 'Fira Mono', monospace;
+
+  /* Font Sizes */
+  --font-size-2xs: 8px;
+  --font-size-xs: 10px;
+  --font-size-sm: 12px;
+  --font-size-md: 14px;
+  --font-size-lg: 16px;
+  --font-size-xl: 18px;
+  --font-size-2xl: 20px;
+  --font-size-3xl: 24px;
+
+  /* Font Weights */
+  --font-weight-normal: 400;
+  --font-weight-medium: 500;
+  --font-weight-semibold: 600;
+  --font-weight-bold: 700;
+
+  /* Line Heights */
+  --line-height-tight: 1.25;
+  --line-height-normal: 1.5;
+  --line-height-relaxed: 1.75;
+
+  /* Letter Spacing */
+  --letter-spacing-tight: -0.02em;
+  --letter-spacing-normal: 0;
+  --letter-spacing-wide: 0.5px;
+
+  /* ============================================
+     SPACING
+     ============================================ */
+  --spacing-2xs: 2px;
+  --spacing-xs: 4px;
+  --spacing-sm: 8px;
+  --spacing-md: 12px;
+  --spacing-lg: 16px;
+  --spacing-xl: 20px;
+  --spacing-2xl: 24px;
+  --spacing-3xl: 32px;
+  --spacing-4xl: 48px;
+
+  /* ============================================
+     BORDER RADIUS
+     ============================================ */
+  --radius-xs: 2px;
+  --radius-sm: 3px;
+  --radius-md: 4px;
+  --radius-lg: 6px;
+  --radius-xl: 8px;
+  --radius-2xl: 12px;
+  --radius-full: 50px;
+  --radius-circle: 50%;
+
+  /* ============================================
+     SHADOWS
+     ============================================ */
+  --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.05);
+  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.06);
+  --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.08);
+  --shadow-lg: 0 4px 16px rgba(0, 0, 0, 0.12);
+  --shadow-xl: 0 8px 24px rgba(0, 0, 0, 0.15);
+  --shadow-sidebar: none;
+
+  /* ============================================
+     TRANSITIONS
+     ============================================ */
+  --transition-fast: 0.15s ease;
+  --transition-normal: 0.2s ease;
+  --transition-slow: 0.3s ease;
+
+  /* ============================================
+     Z-INDEX LAYERS
+     ============================================ */
+  --z-dropdown: 10;
+  --z-sticky: 20;
+  --z-fixed: 30;
+  --z-overlay: 50;
+  --z-modal: 100;
+  /* Blur applied to the page behind EVERY dialog backdrop — ours (save/export/AR/confirm),
+     host-registered modals, the quote, backend show_message modals. A theme sets 0 to turn it off. */
+  --modal-backdrop-blur: 4px;
+  --z-tooltip: 200;
+
+  /* ============================================
+     LAYOUT DIMENSIONS
+     ============================================ */
+  --header-height: 56px;
+  --sidebar-width: 300px;
+  --sidebar-width-tablet: 260px;
+  --sidebar-width-laptop: 280px;
+  --sidebar-width-collapsed: 0px;
+  --sidebar-max-width-mobile: 85vw;
+  --panel-width: 380px;
+  --chat-bar-height: 120px;
+  --live-status-height: 40px;
+
+  /* ============================================
+     COMPONENT: BUTTONS
+     ============================================ */
+  --btn-height-sm: 24px;
+  --btn-height-md: 36px;
+  --btn-height-lg: 44px;
+  --btn-padding-sm: 6px 12px;
+  --btn-padding-md: 8px 16px;
+  --btn-padding-lg: 12px 24px;
+  --btn-font-size: 13px;
+  --btn-border-radius: 4px;
+  /* NOTE: --btn-shadow is intentionally NOT defined here. applyTheme sets it from
+     config.buttons.shadow; each button falls back to its own resting shadow via
+     var(--btn-shadow, <default>) so untheme'd appearance is unchanged. */
+
+  /* ============================================
+     COMPONENT: THUMBNAILS (Sidebar Cards)
+     ============================================ */
+  --thumbnail-border-radius: 4px;
+  --thumbnail-border-width: 1px;
+  --thumbnail-border-width-selected: 2px;
+  --thumbnail-bg: #f7f7f7;
+  --thumbnail-border: #e1e1e1;
+  --thumbnail-border-hover: #363636;
+  --thumbnail-border-selected: #363636;
+  --thumbnail-gap: 10px;
+  --thumbnail-min-width: 72px;
+
+  /* ============================================
+     COMPONENT: SIDEBAR
+     ============================================ */
+  --sidebar-header-padding: 12px 14px;
+  --sidebar-content-padding: 14px;
+  --sidebar-section-gap: 14px;
+  --sidebar-section-title-size: 11px;
+  --sidebar-section-title-weight: 600;
+  --sidebar-collapse-btn-size: 24px;
+
+  /* ============================================
+     COMPONENT: TOOLTIPS
+     ============================================ */
+  --tooltip-bg: rgba(0, 0, 0, 0.8);
+  --tooltip-text: #ffffff;
+  --tooltip-font-size: 10px;
+  --tooltip-padding: 4px 8px;
+  --tooltip-border-radius: 4px;
+  --tooltip-warning-bg: #b45309;
+
+  /* ============================================
+     COMPONENT: SLIDER (Width Control)
+     ============================================ */
+  --slider-track-height: 4px;
+  --slider-track-bg: #e1e1e1;
+  --slider-thumb-size: 16px;
+  --slider-thumb-bg: #363636;
+
+  /* ============================================
+     COMPONENT: BADGES
+     ============================================ */
+  --badge-font-size: 8px;
+  --badge-padding: 2px 6px;
+  --badge-border-radius: 3px;
+  --badge-success-bg: #10b981;
+  --badge-success-text: #ffffff;
+
+  /* ============================================
+     COMPONENT: ICONS
+     ============================================ */
+  --icon-size-sm: 16px;
+  --icon-size-md: 20px;
+  --icon-size-lg: 24px;
+  --icon-color-default: #888888;
+  --icon-color-hover: #333333;
+  --icon-color-active: #4a90d9;
+
+  /* ============================================
+     STATUS INDICATORS
+     ============================================ */
+  --status-stable: #4caf50;
+  --status-processing: #ff9800;
+  --status-error: #f44336;
+
+  /* ============================================
+     BACKWARD COMPATIBILITY ALIASES
+     (For existing CSS files using old variable names)
+     ============================================ */
+  --font-family: var(--font-family-base);
+  --border-color: var(--border-default);
+  --border-color-light: var(--border-light);
+  --color-primary: var(--color-brand-primary);
+  --color-primary-dark: var(--color-brand-primary-dark);
+  --color-primary-light: var(--color-brand-primary-light);
+  --bg-thumbnail: var(--bg-muted);
+  --border-radius: var(--radius-md);
+  --border-radius-sm: var(--radius-xs);
+  --border-radius-lg: var(--radius-lg);
+  --border-radius-xl: var(--radius-full);
+}
+
+}

package/package.json

@@ -0,0 +1,68 @@
+{
+  "name": "@imagineio/configurator-sdk",
+  "version": "0.1.0-beta.1",
+  "description": "Configurator SDK — backend Configuration Engine client, state stores, shared 3D scene primitives, and pluggable placement (strategy + type). Drives every configurator (kitchen, sectional, …) from one self-contained surface.",
+  "license": "SEE LICENSE IN LICENSE.md",
+  "type": "module",
+  "publishConfig": {
+    "access": "public",
+    "tag": "beta"
+  },
+  "main": "./dist/a0f71d0bf5.js",
+  "module": "./dist/a0f71d0bf5.js",
+  "exports": {
+    ".": "./dist/a0f71d0bf5.js",
+    "./public": "./dist/a0f71d0bf5.js",
+    "./public.js": "./dist/a0f71d0bf5.js",
+    "./internal": "./dist/a77b15c0d6.js",
+    "./vite": "./dist/0a35b2c5f4.js",
+    "./scene": "./dist/8a3a57c008.js",
+    "./placement": "./dist/281cf952fa.js",
+    "./state": "./dist/ff5b3d17e2.js",
+    "./package.json": "./package.json",
+    "./styles/*": "./dist/styles/*"
+  },
+  "sideEffects": [
+    "**/*.css"
+  ],
+  "engines": {
+    "node": ">=18"
+  },
+  "scripts": {
+    "prepack": "node ./stamp-docs.mjs && node build/build.mjs",
+    "postpack": "node ./stamp-docs.mjs --restore",
+    "prepublishOnly": "node ./guard-registry.mjs",
+    "build": "node build/build.mjs",
+    "verify:publish": "node build/verify-publish.mjs"
+  },
+  "dependencies": {
+    "@copilotkit/react-core": "^1.51.3",
+    "@copilotkit/react-ui": "^1.51.3",
+    "@gltf-transform/core": "4.3",
+    "@gltf-transform/extensions": "4.3",
+    "@react-three/postprocessing": "2.16",
+    "html2canvas": "^1.4.1",
+    "jspdf": "^4.2.1",
+    "postprocessing": "6.36",
+    "qrcode": "^1.5.4",
+    "qrcode.react": "^4.2.0",
+    "uuid": "^11.1.1",
+    "zustand": "^4.4.7"
+  },
+  "peerDependencies": {
+    "@react-three/drei": "^9.88.0",
+    "@react-three/fiber": "^8.15.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "three": "^0.159.0"
+  },
+  "devDependencies": {
+    "javascript-obfuscator": "^5.7.0",
+    "tsup": "^8.5.1",
+    "typescript": "^7.0.2"
+  },
+  "files": [
+    "dist",
+    "static"
+  ]
+}

package/static/assets/draco/README.md

@@ -0,0 +1,32 @@
+# Draco 3D Data Compression
+
+Draco is an open-source library for compressing and decompressing 3D geometric meshes and point clouds. It is intended to improve the storage and transmission of 3D graphics.
+
+[Website](https://google.github.io/draco/) | [GitHub](https://github.com/google/draco)
+
+## Contents
+
+This folder contains three utilities:
+
+- `draco_decoder.js` — Emscripten-compiled decoder, compatible with any modern browser.
+- `draco_decoder.wasm` — WebAssembly decoder, compatible with newer browsers and devices.
+- `draco_wasm_wrapper.js` — JavaScript wrapper for the WASM decoder.
+
+Each file is provided in two variations:
+
+- **Default:** Latest stable builds, tracking the project's [master branch](https://github.com/google/draco).
+- **glTF:** Builds targeted by the [glTF mesh compression extension](https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Khronos/KHR_draco_mesh_compression), tracking the [corresponding Draco branch](https://github.com/google/draco/tree/gltf_2.0_draco_extension).
+
+Either variation may be used with `THREE.DRACOLoader`:
+
+```js
+var dracoLoader = new THREE.DRACOLoader();
+dracoLoader.setDecoderPath("path/to/decoders/");
+dracoLoader.setDecoderConfig({ type: "js" }); // (Optional) Override detection of WASM support.
+```
+
+Further [documentation on GitHub](https://github.com/google/draco/tree/master/javascript/example#static-loading-javascript-decoder).
+
+## License
+
+[Apache License 2.0](https://github.com/google/draco/blob/master/LICENSE)