@vibes.diy/use-vibes-base 0.18.27-dev → 0.19.0-dev-simpler

package/styles/colors.css

@@ -1,198 +0,0 @@
-/**
- * Vibes Design System - Color Tokens
- *
- * Structure:
- * 1. Base Colors - Static colors that never change with theme
- * 2. Semantic Colors - Theme-aware colors that adapt to light/dark mode
- * 3. Component-Specific Tokens - Colors for specific component needs
- */
-
-:root {
-  /* ============================================
-     BASE COLORS - These never change with theme
-     Use these when you want consistent colors regardless of dark mode
-     ============================================ */
-
-  /* Primary Palette */
-  --vibes-blue: #3b82f6;
-  --vibes-blue-accent: #0066cc;
-  --vibes-blue-bright: #0074d9;
-  --vibes-blue-dark: #357abd;
-  --vibes-blue-darker: #4a90e2;
-
-  --vibes-red: #ef4444;
-  --vibes-red-accent: #da291c;
-  --vibes-red-dark: #b91c1c;
-  --vibes-red-bright: #dc2626;
-  --vibes-red-light: #ff6666;
-  --vibes-red-delete: #ff3333;
-
-  --vibes-yellow: #eab308;
-  --vibes-yellow-accent: #fedd00;
-  --vibes-yellow-bright: #fe0;
-
-  --vibes-gray: #6b7280;
-  --vibes-green: #51cf66;
-
-  /* Neon/Phosphorescent colors for dark mode */
-  --vibes-purple-neon: #c084fc;
-  --vibes-magenta-neon: #e879f9;
-  --vibes-pink-neon: #f472b6;
-  --vibes-cyan-neon: #22d3ee;
-  --vibes-lime-neon: #a3e635;
-  --vibes-orange-neon: #fb923c;
-
-  /* Neutrals */
-  --vibes-black: #000000;
-  --vibes-near-black: #1a1a1a;
-  --vibes-dark-gray: #222222;
-  --vibes-gray-dark: #333333;
-  --vibes-gray-mid: #555555;
-  --vibes-gray-medium: #666666;
-  --vibes-gray-light: #aaaaaa;
-  --vibes-gray-lighter: #cccccc;
-  --vibes-gray-lightest: #d4d4d4;
-  --vibes-gray-ultralight: #e0e0e0;
-  --vibes-gray-pale: #e5e5e5;
-  --vibes-gray-offwhite: #eeeeee;
-  --vibes-gray-ghost: #f0f0f0;
-  --vibes-gray-whisper: #f5f5f5;
-  --vibes-gray-mist: #fafafa;
-
-  --vibes-white: #ffffff;
-  --vibes-cream: #fffff0;
-
-  /* ============================================
-     SEMANTIC COLORS - Theme-aware (change with light/dark mode)
-     Use these for most UI elements that should adapt to theme
-     ============================================ */
-
-  /* Backgrounds */
-  --vibes-bg-primary: var(--vibes-white);
-  --vibes-bg-secondary: var(--vibes-gray-whisper);
-  --vibes-bg-tertiary: var(--vibes-gray-pale);
-  --vibes-bg-overlay: rgba(255, 255, 255, 0.5);
-  --vibes-bg-input: var(--vibes-white);
-  --vibes-bg-dropzone: var(--vibes-gray-mist);
-  --vibes-bg-dropzone-active: #f0f8ff;
-  --vibes-bg-light: var(--vibes-gray-ghost);
-
-  /* Text */
-  --vibes-text-primary: var(--vibes-gray-dark);
-  --vibes-text-secondary: var(--vibes-gray-medium);
-  --vibes-text-muted: var(--vibes-gray-light);
-  --vibes-text-inverse: var(--vibes-white);
-
-  /* Borders */
-  --vibes-border-primary: var(--vibes-near-black);
-  --vibes-border-secondary: var(--vibes-gray-lighter);
-  --vibes-border-light: #dddddd;
-  --vibes-border-input: var(--vibes-gray-lighter);
-
-  /* Shadows */
-  --vibes-shadow-color: var(--vibes-near-black);
-  --vibes-shadow-sm: rgba(0, 0, 0, 0.15);
-  --vibes-shadow-md: rgba(0, 0, 0, 0.3);
-  --vibes-shadow-lg: rgba(0, 0, 0, 0.5);
-  --vibes-shadow-backdrop: rgba(0, 0, 0, 0.9);
-
-  /* Component-Specific Semantic Colors */
-  /* Button - Light mode (cream/light by default) */
-  --vibes-button-bg: var(--vibes-cream);
-  --vibes-button-text: var(--vibes-near-black);
-  --vibes-button-border: var(--vibes-near-black);
-  --vibes-button-icon-bg: #2a2a2a;
-  --vibes-button-icon-fill: var(--vibes-white);
-
-  /* Button - Dark mode aware variants (for when ignoreDarkMode=false) */
-  --vibes-button-bg-dark-aware: var(--vibes-cream);
-  --vibes-button-text-dark-aware: var(--vibes-near-black);
-  --vibes-button-border-dark-aware: var(--vibes-near-black);
-  --vibes-button-icon-bg-dark-aware: var(--vibes-white);
-
-  /* Button variant colors - Light mode */
-  --vibes-variant-blue: var(--vibes-blue);
-  --vibes-variant-red: var(--vibes-red);
-  --vibes-variant-yellow: var(--vibes-yellow);
-  --vibes-variant-gray: var(--vibes-gray);
-
-  --vibes-card-bg: var(--vibes-gray-pale);
-  --vibes-card-text: var(--vibes-near-black);
-  --vibes-card-border: var(--vibes-near-black);
-
-  /* Error States */
-  --vibes-error-bg: rgba(0, 0, 0, 0.7);
-  --vibes-error-border: var(--vibes-red-light);
-  --vibes-error-text: var(--vibes-red-light);
-  --vibes-error-text-body: var(--vibes-white);
-
-  /* ImgGen specific */
-  --imggen-accent: var(--vibes-blue-accent);
-  --imggen-flash: var(--vibes-yellow-bright);
-  --imggen-button-bg: rgba(255, 255, 255, 0.7);
-  --imggen-delete-hover: var(--vibes-red-delete);
-}
-
-/* ============================================
-   DARK MODE - Theme-aware colors adapt here
-   Base colors remain unchanged
-   ============================================ */
-@media (prefers-color-scheme: dark) {
-  :root {
-    /* Backgrounds */
-    --vibes-bg-primary: var(--vibes-near-black);
-    --vibes-bg-secondary: #2a2a2a;
-    --vibes-bg-tertiary: #404040;
-    --vibes-bg-overlay: rgba(0, 0, 0, 0.5);
-    --vibes-bg-input: #2a2a2a;
-    --vibes-bg-dropzone: #2a2a2a;
-    --vibes-bg-dropzone-active: #1a3a4a;
-    --vibes-bg-light: #404040;
-
-    /* Text */
-    --vibes-text-primary: var(--vibes-gray-ultralight);
-    --vibes-text-secondary: var(--vibes-gray-light);
-    --vibes-text-muted: var(--vibes-gray-medium);
-    --vibes-text-inverse: var(--vibes-near-black);
-
-    /* Borders */
-    --vibes-border-primary: var(--vibes-gray-mid);
-    --vibes-border-secondary: var(--vibes-gray-mid);
-    --vibes-border-light: var(--vibes-gray-mid);
-    --vibes-border-input: var(--vibes-gray-mid);
-
-    /* Shadows */
-    --vibes-shadow-color: var(--vibes-near-black);
-    --vibes-shadow-sm: rgba(255, 255, 255, 0.1);
-    --vibes-shadow-md: rgba(255, 255, 255, 0.1);
-    --vibes-shadow-lg: rgba(0, 0, 0, 0.5);
-    --vibes-shadow-backdrop: rgba(0, 0, 0, 0.9);
-
-    /* Component-Specific Dark Mode Adjustments */
-    --vibes-card-bg: var(--vibes-near-black);
-    --vibes-card-text: var(--vibes-white);
-    --vibes-card-border: var(--vibes-gray-mid);
-
-    /* Note: Default button colors remain cream/light in dark mode for contrast */
-    /* --vibes-button-bg: var(--vibes-cream); (unchanged) */
-    /* --vibes-button-text: var(--vibes-near-black); (unchanged) */
-    /* --vibes-button-border: var(--vibes-near-black); (unchanged) */
-    --vibes-button-icon-bg: var(--vibes-white);
-    --vibes-button-icon-fill: #2a2a2a;
-
-    /* Dark mode aware buttons - darker background with light text */
-    --vibes-button-bg-dark-aware: #2a2a2a;
-    --vibes-button-text-dark-aware: var(--vibes-gray-ultralight);
-    --vibes-button-border-dark-aware: var(--vibes-gray-mid);
-    --vibes-button-icon-bg-dark-aware: #404040;
-
-    /* Button variant colors - Dark mode (neon/phosphorescent) */
-    --vibes-variant-blue: var(--vibes-purple-neon);
-    --vibes-variant-red: var(--vibes-pink-neon);
-    --vibes-variant-yellow: var(--vibes-orange-neon);
-    --vibes-variant-gray: var(--vibes-cyan-neon);
-
-    /* ImgGen dark mode adjustments */
-    --imggen-button-bg: rgba(0, 0, 0, 0.7);
-  }
-}

package/vibe-app-mount.d.ts

@@ -1,13 +0,0 @@
-import * as React from 'react';
-import { type VibeMetadata } from './contexts/VibeContext.js';
-export interface MountVibesAppOptions {
-    readonly container: HTMLElement;
-    readonly appComponent?: React.ComponentType;
-    readonly showVibesSwitch?: boolean;
-    readonly vibeMetadata?: VibeMetadata;
-}
-export interface MountVibesAppResult {
-    unmount: () => void;
-    getContainer: () => HTMLElement;
-}
-export declare function mountVibesApp(options: MountVibesAppOptions): MountVibesAppResult;

package/vibe-app-mount.js

@@ -1,39 +0,0 @@
-import * as React from 'react';
-import * as ReactDOM from 'react-dom/client';
-import { HiddenMenuWrapper } from './components/HiddenMenuWrapper/HiddenMenuWrapper.js';
-import { VibesPanel } from './components/VibesPanel.js';
-import { VibeContextProvider, validateVibeMetadata, VibeMetadataValidationError, } from './contexts/VibeContext.js';
-function VibesApp({ showVibesSwitch = true, vibeMetadata, children, }) {
-    const content = showVibesSwitch ? (React.createElement(HiddenMenuWrapper, { menuContent: React.createElement(VibesPanel, null), showVibesSwitch: true }, children)) : (React.createElement(React.Fragment, null, children));
-    if (vibeMetadata) {
-        return React.createElement(VibeContextProvider, { metadata: vibeMetadata }, content);
-    }
-    return content;
-}
-export function mountVibesApp(options) {
-    const { container, appComponent, showVibesSwitch, vibeMetadata } = options;
-    if (vibeMetadata) {
-        try {
-            validateVibeMetadata(vibeMetadata);
-        }
-        catch (error) {
-            if (error instanceof VibeMetadataValidationError) {
-                throw new Error(`Failed to mount Vibes app: ${error.message} (code: ${error.code}). ` +
-                    `Received vibeMetadata: ${JSON.stringify(vibeMetadata)}`);
-            }
-            throw error;
-        }
-    }
-    const root = ReactDOM.createRoot(container);
-    const AppComponent = appComponent;
-    root.render(React.createElement(VibesApp, { ...(showVibesSwitch !== undefined && { showVibesSwitch }), ...(vibeMetadata !== undefined && { vibeMetadata }) }, AppComponent && React.createElement(AppComponent, null)));
-    return {
-        unmount: () => {
-            setTimeout(() => {
-                root.unmount();
-            }, 0);
-        },
-        getContainer: () => container,
-    };
-}
-//# sourceMappingURL=vibe-app-mount.js.map

package/vibe-app-mount.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"vibe-app-mount.js","sourceRoot":"","sources":["../jsr/vibe-app-mount.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,QAAQ,MAAM,kBAAkB,CAAC;AAC7C,OAAO,EAAE,iBAAiB,EAAE,MAAM,qDAAqD,CAAC;AACxF,OAAO,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAC;AACxD,OAAO,EACL,mBAAmB,EAEnB,oBAAoB,EACpB,2BAA2B,GAC5B,MAAM,2BAA2B,CAAC;AAmBnC,SAAS,QAAQ,CAAC,EAChB,eAAe,GAAG,IAAI,EACtB,YAAY,EACZ,QAAQ,GAKT,EAAE;IAID,MAAM,OAAO,GAAG,eAAe,CAAC,CAAC,CAAC,CAChC,oBAAC,iBAAiB,IAAC,WAAW,EAAE,oBAAC,UAAU,OAAG,EAAE,eAAe,EAAE,IAAI,IAClE,QAAQ,CACS,CACrB,CAAC,CAAC,CAAC,CACF,0CAAG,QAAQ,CAAI,CAChB,CAAC;IAGF,IAAI,YAAY,EAAE,CAAC;QACjB,OAAO,oBAAC,mBAAmB,IAAC,QAAQ,EAAE,YAAY,IAAG,OAAO,CAAuB,CAAC;IACtF,CAAC;IAED,OAAO,OAAO,CAAC;AAAA,CAChB;AAED,MAAM,UAAU,aAAa,CAAC,OAA6B,EAAuB;IAChF,MAAM,EAAE,SAAS,EAAE,YAAY,EAAE,eAAe,EAAE,YAAY,EAAE,GAAG,OAAO,CAAC;IAG3E,IAAI,YAAY,EAAE,CAAC;QACjB,IAAI,CAAC;YACH,oBAAoB,CAAC,YAAY,CAAC,CAAC;QACrC,CAAC;QAAC,OAAO,KAAK,EAAE,CAAC;YACf,IAAI,KAAK,YAAY,2BAA2B,EAAE,CAAC;gBACjD,MAAM,IAAI,KAAK,CACb,8BAA8B,KAAK,CAAC,OAAO,WAAW,KAAK,CAAC,IAAI,KAAK;oBACnE,0BAA0B,IAAI,CAAC,SAAS,CAAC,YAAY,CAAC,EAAE,CAC3D,CAAC;YACJ,CAAC;YACD,MAAM,KAAK,CAAC;QACd,CAAC;IACH,CAAC;IAED,MAAM,IAAI,GAAG,QAAQ,CAAC,UAAU,CAAC,SAAS,CAAC,CAAC;IAE5C,MAAM,YAAY,GAAG,YAAY,CAAC;IAElC,IAAI,CAAC,MAAM,CACT,oBAAC,QAAQ,OACH,CAAC,eAAe,KAAK,SAAS,IAAI,EAAE,eAAe,EAAE,CAAC,KACtD,CAAC,YAAY,KAAK,SAAS,IAAI,EAAE,YAAY,EAAE,CAAC,IAEnD,YAAY,IAAI,oBAAC,YAAY,OAAG,CACxB,CACZ,CAAC;IAEF,OAAO;QACL,OAAO,EAAE,GAAG,EAAE,CAAC;YACb,UAAU,CAAC,GAAG,EAAE,CAAC;gBACf,IAAI,CAAC,OAAO,EAAE,CAAC;YAAA,CAChB,EAAE,CAAC,CAAC,CAAC;QAAA,CACP;QAED,YAAY,EAAE,GAAG,EAAE,CAAC,SAAS;KAC9B,CAAC;AAAA,CACH"}