@admin-layout/tailwind-design-pro 10.0.9-alpha.4 → 10.0.9-alpha.42

package/lib/styles/index.css

@@ -3,49 +3,441 @@
 @tailwind components;
 @tailwind utilities;
 
-@layer base {
-    :root {
-        --background: 0 0% 100%;
-        --foreground: 222.2 84% 4.9%;
-        --card: 0 0% 100%;
-        --card-foreground: 222.2 84% 4.9%;
-        --popover: 0 0% 100%;
-        --popover-foreground: 222.2 84% 4.9%;
-        --primary: 221.2 83.2% 53.3%;
-        --primary-foreground: 210 40% 98%;
-        --secondary: 210 40% 96.1%;
-        --secondary-foreground: 222.2 47.4% 11.2%;
-        --muted: 210 40% 96.1%;
-        --muted-foreground: 215.4 16.3% 46.9%;
-        --accent: 210 40% 96.1%;
-        --accent-foreground: 222.2 47.4% 11.2%;
-        --destructive: 0 84.2% 60.2%;
-        --destructive-foreground: 210 40% 98%;
-        --border: 214.3 31.8% 91.4%;
-        --input: 214.3 31.8% 91.4%;
-        --ring: 221.2 83.2% 53.3%;
-        --radius: 0.5rem;
-    }
-
-    .dark {
-        --background: 222.2 84% 4.9%;
-        --foreground: 210 40% 98%;
-        --card: 222.2 84% 4.9%;
-        --card-foreground: 210 40% 98%;
-        --popover: 222.2 84% 4.9%;
-        --popover-foreground: 210 40% 98%;
-        --primary: 217.2 91.2% 59.8%;
-        --primary-foreground: 222.2 47.4% 11.2%;
-        --secondary: 217.2 32.6% 17.5%;
-        --secondary-foreground: 210 40% 98%;
-        --muted: 217.2 32.6% 17.5%;
-        --muted-foreground: 215 20.2% 65.1%;
-        --accent: 217.2 32.6% 17.5%;
-        --accent-foreground: 210 40% 98%;
-        --destructive: 0 62.8% 30.6%;
-        --destructive-foreground: 210 40% 98%;
-        --border: 217.2 32.6% 17.5%;
-        --input: 217.2 32.6% 17.5%;
-        --ring: 224.3 76.3% 48%;
-    }
-}
+/* Base theme variables */
+:root {
+    /* Theme colors */
+    --background: 0 0% 100%;
+    --foreground: 222.2 84% 4.9%;
+    --card: 0 0% 100%;
+    --card-foreground: 222.2 84% 4.9%;
+    --popover: 0 0% 100%;
+    --popover-foreground: 222.2 84% 4.9%;
+    --primary: 221.2 83.2% 53.3%;
+    --primary-foreground: 210 40% 98%;
+    --secondary: 210 40% 96.1%;
+    --secondary-foreground: 222.2 47.4% 11.2%;
+    --muted: 210 40% 96.1%;
+    --muted-foreground: 215.4 16.3% 46.9%;
+    --accent: 210 40% 96.1%;
+    --accent-foreground: 222.2 47.4% 11.2%;
+    --destructive: 0 84.2% 60.2%;
+    --destructive-foreground: 210 40% 98%;
+    --border: 214.3 31.8% 91.4%;
+    --input: 214.3 31.8% 91.4%;
+    --ring: 221.2 83.2% 53.3%;
+    --radius: 0.5rem;
+    
+    /* Fonts */
+    --font-family: 'Inter', sans-serif;
+    
+    /* Font sizes */
+    --font-size-xs: 0.75rem;
+    --font-size-sm: 0.875rem;
+    --font-size-base: 1rem;
+    --font-size-lg: 1.125rem;
+    --font-size-xl: 1.25rem;
+    --font-size-2xl: 1.5rem;
+    --font-size-3xl: 1.875rem;
+    --font-size-4xl: 2.25rem;
+    --font-size-5xl: 3rem;
+    
+    /* Spacing */
+    --spacing-px: 1px;
+    --spacing-0: 0;
+    --spacing-0_5: 0.125rem;
+    --spacing-1: 0.25rem;
+    --spacing-1_5: 0.375rem;
+    --spacing-2: 0.5rem;
+    --spacing-2_5: 0.625rem;
+    --spacing-3: 0.75rem;
+    --spacing-3_5: 0.875rem;
+    --spacing-4: 1rem;
+    --spacing-5: 1.25rem;
+    --spacing-6: 1.5rem;
+    --spacing-8: 2rem;
+    --spacing-10: 2.5rem;
+    --spacing-12: 3rem;
+    --spacing-16: 4rem;
+    --spacing-20: 5rem;
+    --spacing-24: 6rem;
+    --spacing-32: 8rem;
+    --spacing-40: 10rem;
+    --spacing-48: 12rem;
+    --spacing-56: 14rem;
+    --spacing-64: 16rem;
+    
+    /* Border radius */
+    --radius-none: 0;
+    --radius-sm: 0.125rem;
+    --radius-default: 0.25rem;
+    --radius-md: 0.375rem;
+    --radius-lg: 0.5rem;
+    --radius-xl: 0.75rem;
+    --radius-2xl: 1rem;
+    --radius-3xl: 1.5rem;
+    --radius-full: 9999px;
+  }
+  
+  /* Dark mode theme variables */
+  .dark {
+    --background: 222.2 84% 4.9%;
+    --foreground: 210 40% 98%;
+    --card: 222.2 84% 4.9%;
+    --card-foreground: 210 40% 98%;
+    --popover: 222.2 84% 4.9%;
+    --popover-foreground: 210 40% 98%;
+    --primary: 217.2 91.2% 59.8%;
+    --primary-foreground: 222.2 47.4% 11.2%;
+    --secondary: 217.2 32.6% 17.5%;
+    --secondary-foreground: 210 40% 98%;
+    --muted: 217.2 32.6% 17.5%;
+    --muted-foreground: 215 20.2% 65.1%;
+    --accent: 217.2 32.6% 17.5%;
+    --accent-foreground: 210 40% 98%;
+    --destructive: 0 62.8% 30.6%;
+    --destructive-foreground: 210 40% 98%;
+    --border: 217.2 32.6% 17.5%;
+    --input: 217.2 32.6% 17.5%;
+    --ring: 224.3 76.3% 48%;
+  }
+  
+  /* Theme color utilities */
+  .bg-background {
+    background-color: hsl(var(--background)) !important;
+  }
+  
+  .text-foreground {
+    color: hsl(var(--foreground)) !important;
+  }
+  
+  .bg-card {
+    background-color: hsl(var(--card)) !important;
+  }
+  
+  .text-card-foreground {
+    color: hsl(var(--card-foreground)) !important;
+  }
+  
+  .bg-popover {
+    background-color: hsl(var(--popover)) !important;
+  }
+  
+  .text-popover-foreground {
+    color: hsl(var(--popover-foreground)) !important;
+  }
+  
+  .bg-primary {
+    background-color: hsl(var(--primary)) !important;
+  }
+  
+  .text-primary {
+    color: hsl(var(--primary)) !important;
+  }
+  
+  .border-primary {
+    border-color: hsl(var(--primary)) !important;
+  }
+  
+  .ring-primary {
+    --tw-ring-color: hsl(var(--primary)) !important;
+  }
+  
+  .hover\:bg-primary:hover {
+    background-color: hsl(var(--primary)) !important;
+  }
+  
+  .hover\:text-primary:hover {
+    color: hsl(var(--primary)) !important;
+  }
+  
+  .text-primary-foreground {
+    color: hsl(var(--primary-foreground)) !important;
+  }
+  
+  .bg-secondary {
+    background-color: hsl(var(--secondary)) !important;
+  }
+  
+  .text-secondary {
+    color: hsl(var(--secondary)) !important;
+  }
+  
+  .border-secondary {
+    border-color: hsl(var(--secondary)) !important;
+  }
+  
+  .text-secondary-foreground {
+    color: hsl(var(--secondary-foreground)) !important;
+  }
+  
+  .bg-muted {
+    background-color: hsl(var(--muted)) !important;
+  }
+  
+  .text-muted {
+    color: hsl(var(--muted)) !important;
+  }
+  
+  .text-muted-foreground {
+    color: hsl(var(--muted-foreground)) !important;
+  }
+  
+  .bg-accent {
+    background-color: hsl(var(--accent)) !important;
+  }
+  
+  .text-accent {
+    color: hsl(var(--accent)) !important;
+  }
+  
+  .text-accent-foreground {
+    color: hsl(var(--accent-foreground)) !important;
+  }
+  
+  .bg-destructive {
+    background-color: hsl(var(--destructive)) !important;
+  }
+  
+  .text-destructive {
+    color: hsl(var(--destructive)) !important;
+  }
+  
+  .text-destructive-foreground {
+    color: hsl(var(--destructive-foreground)) !important;
+  }
+  
+  .border-border {
+    border-color: hsl(var(--border)) !important;
+  }
+  
+  .border-input {
+    border-color: hsl(var(--input)) !important;
+  }
+  
+  .focus-ring {
+    outline: 2px solid hsl(var(--ring));
+    outline-offset: 2px;
+  }
+  
+  /* Font family utility */
+  .font-sans {
+    font-family: var(--font-family) !important;
+  }
+  
+  /* Border radius utilities */
+  .rounded-none {
+    border-radius: var(--radius-none) !important;
+  }
+  
+  .rounded-sm {
+    border-radius: var(--radius-sm) !important;
+  }
+  
+  .rounded {
+    border-radius: var(--radius-default) !important;
+  }
+  
+  .rounded-md {
+    border-radius: var(--radius-md) !important;
+  }
+  
+  .rounded-lg {
+    border-radius: var(--radius-lg) !important;
+  }
+  
+  .rounded-xl {
+    border-radius: var(--radius-xl) !important;
+  }
+  
+  .rounded-2xl {
+    border-radius: var(--radius-2xl) !important;
+  }
+  
+  .rounded-3xl {
+    border-radius: var(--radius-3xl) !important;
+  }
+  
+  .rounded-full {
+    border-radius: var(--radius-full) !important;
+  }
+  
+  /* Font size utilities */
+  .text-xs {
+    font-size: var(--font-size-xs) !important;
+  }
+  
+  .text-sm {
+    font-size: var(--font-size-sm) !important;
+  }
+  
+  .text-base {
+    font-size: var(--font-size-base) !important;
+  }
+  
+  .text-lg {
+    font-size: var(--font-size-lg) !important;
+  }
+  
+  .text-xl {
+    font-size: var(--font-size-xl) !important;
+  }
+  
+  .text-2xl {
+    font-size: var(--font-size-2xl) !important;
+  }
+  
+  .text-3xl {
+    font-size: var(--font-size-3xl) !important;
+  }
+  
+  .text-4xl {
+    font-size: var(--font-size-4xl) !important;
+  }
+  
+  .text-5xl {
+    font-size: var(--font-size-5xl) !important;
+  }
+  
+  /* Button styles */
+  .btn {
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    border-radius: var(--radius-md);
+    font-weight: 500;
+    transition-property: color, background-color, border-color;
+    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    transition-duration: 150ms;
+    padding: 0.5rem 1rem;
+    font-family: var(--font-family);
+  }
+  
+  .btn-primary {
+    background-color: hsl(var(--primary));
+    color: hsl(var(--primary-foreground));
+  }
+  
+  .btn-primary:hover {
+    background-color: hsl(var(--primary) / 0.9);
+  }
+  
+  .btn-secondary {
+    background-color: hsl(var(--secondary));
+    color: hsl(var(--secondary-foreground));
+  }
+  
+  .btn-secondary:hover {
+    background-color: hsl(var(--secondary) / 0.9);
+  }
+  
+  .btn-accent {
+    background-color: hsl(var(--accent));
+    color: hsl(var(--accent-foreground));
+  }
+  
+  .btn-accent:hover {
+    background-color: hsl(var(--accent) / 0.9);
+  }
+  
+  .btn-destructive {
+    background-color: hsl(var(--destructive));
+    color: hsl(var(--destructive-foreground));
+  }
+  
+  .btn-destructive:hover {
+    background-color: hsl(var(--destructive) / 0.9);
+  }
+  
+  .btn-outline {
+    border: 1px solid hsl(var(--input));
+    background-color: transparent;
+    color: hsl(var(--foreground));
+  }
+  
+  .btn-outline:hover {
+    background-color: hsl(var(--accent));
+    color: hsl(var(--accent-foreground));
+  }
+  
+  /* Card styles */
+  .card {
+    background-color: hsl(var(--card));
+    color: hsl(var(--card-foreground));
+    border-radius: var(--radius-lg);
+    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+  }
+  
+  /* Form input styles */
+  .input {
+    display: block;
+    width: 100%;
+    padding: 0.5rem;
+    border-radius: var(--radius-md);
+    border: 1px solid hsl(var(--input));
+    background-color: transparent;
+    color: hsl(var(--foreground));
+    font-family: var(--font-family);
+    font-size: var(--font-size-base);
+  }
+  
+  .input:focus {
+    outline: 2px solid hsl(var(--ring));
+    outline-offset: 2px;
+  }
+  
+  /* Menu and navbar styles */
+  .menu {
+    list-style: none;
+    padding: 0;
+    margin: 0;
+    font-family: var(--font-family);
+  }
+  
+  .menu-item {
+    padding: 0.5rem 1rem;
+    border-radius: var(--radius-md);
+    color: hsl(var(--foreground));
+    transition-property: color, background-color;
+    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    transition-duration: 150ms;
+  }
+  
+  .menu-item:hover {
+    background-color: hsl(var(--accent));
+    color: hsl(var(--accent-foreground));
+  }
+  
+  .menu-item.active {
+    background-color: hsl(var(--primary));
+    color: hsl(var(--primary-foreground));
+  }
+  
+  /* Navbar styles */
+  .navbar {
+    background-color: hsl(var(--background));
+    border-bottom: 1px solid hsl(var(--border));
+    padding: 0.75rem 1rem;
+    display: flex;
+    align-items: center;
+    font-family: var(--font-family);
+  }
+  
+  /* Sidebar styles */
+  .sidebar {
+    background-color: hsl(var(--card));
+    border-right: 1px solid hsl(var(--border));
+    font-family: var(--font-family);
+  }
+  
+  /* Utility for transitions */
+  .transition-colors {
+    transition-property: color, background-color, border-color;
+    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    transition-duration: 150ms;
+  }
+  
+  .transition-all {
+    transition-property: all;
+    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+    transition-duration: 150ms;
+  } 

package/lib/tailwindConfig.d.ts

@@ -0,0 +1,42 @@
+export declare const themeConfig: {
+    colors: {
+        primary: import("./components/ThemeProvider/types").ColorRamp;
+        secondary: import("./components/ThemeProvider/types").ColorRamp;
+        accent: import("./components/ThemeProvider/types").ColorRamp;
+        success: import("./components/ThemeProvider/types").ColorRamp;
+        warning: import("./components/ThemeProvider/types").ColorRamp;
+        error: import("./components/ThemeProvider/types").ColorRamp;
+        neutral: import("./components/ThemeProvider/types").ColorRamp;
+        background: {
+            light: string;
+            dark: string;
+        };
+    };
+    textColor: {
+        primary: string;
+        secondary: string;
+        tertiary: string;
+    };
+    borderRadius: {
+        sm: string;
+        DEFAULT: string;
+        md: string;
+        lg: string;
+        xl: string;
+        '2xl': string;
+        full: string;
+    };
+    fontFamily: {
+        sans: string[];
+        serif: string[];
+        mono: string[];
+    };
+    boxShadow: {
+        sm: string;
+        DEFAULT: string;
+        md: string;
+        lg: string;
+        xl: string;
+    };
+};
+//# sourceMappingURL=tailwindConfig.d.ts.map

package/lib/tailwindConfig.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tailwindConfig.d.ts","sourceRoot":"","sources":["../src/tailwindConfig.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmBvB,CAAC"}

package/lib/tailwindConfig.js

@@ -0,0 +1,23 @@
+import {themes}from'./components/ThemeProvider/themes/index.js';// Get active theme - can be replaced with dynamic theme selection from your app state
+const activeTheme = themes.spotify;
+// Default spacing and theme from Tailwind
+const themeConfig = {
+  colors: {
+    primary: activeTheme.colors.primary,
+    secondary: activeTheme.colors.secondary,
+    accent: activeTheme.colors.accent,
+    success: activeTheme.colors.success,
+    warning: activeTheme.colors.warning,
+    error: activeTheme.colors.error,
+    neutral: activeTheme.colors.neutral,
+    background: activeTheme.colors.background
+  },
+  textColor: {
+    primary: activeTheme.colors.text.light.primary,
+    secondary: activeTheme.colors.text.light.secondary,
+    tertiary: activeTheme.colors.text.light.tertiary
+  },
+  borderRadius: activeTheme.borderRadius,
+  fontFamily: activeTheme.fontFamily,
+  boxShadow: activeTheme.boxShadow
+};export{themeConfig};//# sourceMappingURL=tailwindConfig.js.map

package/lib/tailwindConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tailwindConfig.js","sources":["../src/tailwindConfig.ts"],"sourcesContent":[null],"names":[],"mappings":"gEAEA;AACA,MAAM,WAAW,GAAG,MAAM,CAAC,OAAO;AAClC;AAEa,MAAA,WAAW,GAAG;AACvB,EAAA,MAAA,EAAM;AACF,IAAA,OAAA,EAAA,WAAS,CAAA,MAAY,CAAA,OAAc;AACnC,IAAA,SAAA,EAAA,WAAW,CAAA,MAAY,CAAA,SAAgB;AACvC,IAAA,MAAA,EAAA,WAAQ,CAAA,MAAY,CAAA,MAAa;AACjC,IAAA,OAAA,EAAA,WAAS,CAAA,MAAY,CAAA,OAAc;AACnC,IAAA,OAAA,EAAA,WAAS,CAAA,MAAY,CAAA,OAAc;AACnC,IAAA,KAAA,EAAA,WAAO,CAAA,MAAY,CAAA,KAAY;AAC/B,IAAA,OAAA,EAAA,WAAS,CAAA,MAAY,CAAA,OAAc;AACnC,IAAA,UAAA,EAAA,WAAY,CAAA,MAAY,CAAA;AAC3B,GAAA;AACD,EAAA,SAAA,EAAS;WACE,EAAA,kBAAc,CAAA,IAAO,CAAI,KAAM,CAAA,OAAQ;aACrC,EAAA,kBAAc,CAAA,IAAO,CAAI,KAAM,CAAA,SAAU;YAC1C,EAAA,kBAAc,CAAA,IAAO,CAAI,KAAM,CAAA;AAC1C,GAAA;cACW,EAAA,WAAa,CAAA,YAAa;YAC5B,EAAA,WAAa,CAAA,UAAW;WACzB,EAAA,WAAa,CAAA;"}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@admin-layout/tailwind-design-pro",
-    "version": "10.0.9-alpha.4",
+    "version": "10.0.9-alpha.42",
     "description": "Sample core for higher packages to depend on",
     "license": "ISC",
     "author": "CDMBase LLC",
@@ -22,7 +22,7 @@
     },
     "dependencies": {
         "@admin-layout/assets": "10.0.9-alpha.4",
-        "@admin-layout/client": "10.0.9-alpha.4",
+        "@admin-layout/client": "10.0.9-alpha.42",
         "@types/react-copy-to-clipboard": "^4.3.0",
         "base-64": "^0.1.0",
         "identicon.js": "^2.3.1",
@@ -37,7 +37,7 @@
         "use-merge-value": "^1.0.2"
     },
     "devDependencies": {
-        "@adminide-stack/extension-api": "^10.3.1-alpha.11",
+        "@adminide-stack/extension-api": "^10.5.1-alpha.7",
         "@tailwindcss/aspect-ratio": "^0.4.2",
         "@tailwindcss/forms": "^0.5.4",
         "@tailwindcss/typography": "^0.5.9",
@@ -58,7 +58,7 @@
             }
         }
     },
-    "gitHead": "6d3f67b63bdf37a197375c0e78e0d650088f7c40",
+    "gitHead": "b09941b42df7f01e61709f28c23626ecbbc2c105",
     "typescript": {
         "definition": "lib/index.d.ts"
     }

package/lib/components/Layout/GlobalFooter/Copyright.js

@@ -1,8 +0,0 @@
-import {jsxs}from'react/jsx-runtime';const Copyright = ({
-  title
-}) => jsxs("div", {
-  style: {
-    color: '#555353'
-  },
-  children: ["Copyright \u00A9 ", new Date().getFullYear(), " ", title, " All rights reserved."]
-});export{Copyright as default};//# sourceMappingURL=Copyright.js.map

package/lib/components/Layout/GlobalFooter/Copyright.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Copyright.js","sources":["../../../../src/components/Layout/GlobalFooter/Copyright.tsx"],"sourcesContent":[null],"names":[],"mappings":"qCAEA,MAAM,SAAS,GAAG,CAAC;AAMnB,EAAA;;;;;;"}

package/lib/components/Layout/GlobalFooter/Footer.js

@@ -1,22 +0,0 @@
-import {jsxs,jsx}from'react/jsx-runtime';import {Link}from'@remix-run/react';import Copyright from'./Copyright.js';const GlobalFooter = ({
-  settings,
-  active
-}) => {
-  const {
-    title
-  } = settings;
-  if (!active) return null;
-  return jsxs("footer", {
-    className: "py-6 text-center",
-    children: [jsx("div", {
-      className: "my-8",
-      children: jsx(Link, {
-        to: "#",
-        className: "text-gray-600 hover:text-gray-800 transition-colors",
-        children: "Privacy Policy"
-      })
-    }), jsx(Copyright, {
-      title: title
-    })]
-  });
-};export{GlobalFooter};//# sourceMappingURL=Footer.js.map

package/lib/components/Layout/GlobalFooter/Footer.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Footer.js","sources":["../../../../src/components/Layout/GlobalFooter/Footer.tsx"],"sourcesContent":[null],"names":[],"mappings":"mHAIa,MAAA,YAAY,GAAG,CAAC;AACzB,EAAA,QAAM;AAEN,EAAA;AAAa,CAAA,KAAA;AAEb,EAAA,MAAA;AAUJ,IAAE;;;;;;;;;;;;;;;;"}