@ttoss/theme 2.0.1 → 2.1.0

package/dist/esm/themes/Oca/Oca.js

@@ -0,0 +1,273 @@
+/** Powered by @ttoss/config. https://ttoss.dev/docs/modules/packages/config/ */
+import { createTheme } from "../../chunk-SNDE7LRY.js";
+import { BrutalIcons, BruttalTheme } from "../../chunk-4E3W4EOZ.js";
+import { defaultTheme } from "../../chunk-ZYSSWTLH.js";
+
+// src/themes/Oca/OcaFonts.ts
+var OcaFonts = ["https://fonts.googleapis.com/css2?family=Outfit:wght@700&display=swap", "https://fonts.googleapis.com/css2?family=Source+Sans+Pro:wght@400;700&display=swap"];
+
+// src/themes/Oca/OcaTheme.ts
+var defaultBorders = defaultTheme.borders;
+var OcaTheme = createTheme({
+  colors: {
+    navigation: {
+      background: {
+        primary: {
+          default: "#FFFFFF"
+        },
+        muted: {
+          default: "#F3F4F6"
+        }
+      },
+      text: {
+        primary: {
+          default: "#111827"
+        },
+        secondary: {
+          default: "#465A69"
+        },
+        accent: {
+          default: "#03FF7A"
+        },
+        muted: {
+          default: "#6B7280"
+        }
+      },
+      border: {
+        primary: {
+          default: "#E5E7EB"
+        },
+        muted: {
+          default: "#9CA3AF"
+        }
+      }
+    },
+    input: {
+      border: {
+        muted: {
+          default: "#E5E7EB"
+        }
+      },
+      background: {
+        primary: {
+          default: "#FFFFFF"
+        },
+        secondary: {
+          default: "#465A69"
+        },
+        accent: {
+          default: "#03FF7A"
+        },
+        muted: {
+          default: "#F3F4F6",
+          active: "#F3F4F6",
+          disabled: "#9CA3AF"
+        },
+        negative: {
+          default: "red"
+        }
+      },
+      text: {
+        primary: {
+          default: "#111827"
+        },
+        accent: {
+          default: "#03FF7A"
+        },
+        secondary: {
+          default: "#465A69"
+        },
+        muted: {
+          default: "#6B7280",
+          active: "#6B7280"
+        },
+        negative: {
+          default: "red"
+        }
+      }
+    },
+    action: {
+      background: {
+        primary: {
+          default: "#111827",
+          active: "#111827"
+        },
+        secondary: {
+          default: "#465A69"
+        },
+        accent: {
+          default: "#03FF7A",
+          active: "#03FF7A"
+        },
+        caution: {
+          default: "orange"
+        },
+        muted: {
+          default: "#F3F4F6"
+        },
+        negative: {
+          default: "red"
+        }
+      },
+      text: {
+        primary: {
+          default: "#FFFFFF"
+        },
+        accent: {
+          default: "#000000"
+        },
+        secondary: {
+          default: "#FFFFFF"
+        },
+        muted: {
+          default: "#6B7280"
+        },
+        caution: {
+          default: "white"
+        },
+        negative: {
+          default: "white"
+        }
+      }
+    },
+    display: {
+      background: {
+        primary: {
+          default: "#FFFFFF"
+        },
+        secondary: {
+          default: "#FFFFFF"
+        },
+        muted: {
+          default: "#F3F4F6"
+        }
+      },
+      text: {
+        primary: {
+          default: "#111827"
+        },
+        secondary: {
+          default: "#465A69"
+        },
+        accent: {
+          default: "#03FF7A"
+        },
+        muted: {
+          default: "#6B7280",
+          active: "#6B7280"
+        },
+        negative: {
+          default: "red"
+        }
+      },
+      border: {
+        primary: {
+          default: "#111827"
+        },
+        secondary: {
+          default: "#465A69"
+        },
+        muted: {
+          default: "#E5E7EB",
+          active: "#E5E7EB"
+        },
+        negative: {
+          default: "red"
+        },
+        accent: {
+          default: "#03FF7A"
+        }
+      }
+    },
+    feedback: {
+      text: {
+        secondary: {
+          default: "#465A69"
+        }
+      },
+      border: {
+        primary: {
+          default: "#111827"
+        }
+      }
+    }
+  },
+  fonts: {
+    heading: '"Outfit", sans-serif',
+    body: '"Source Sans Pro", sans-serif',
+    mono: '"Inconsolata", sans-serif'
+  },
+  borders: {
+    none: defaultBorders.none,
+    xs: defaultBorders.xs,
+    sm: defaultBorders.sm,
+    md: "1px solid",
+    lg: defaultBorders.lg,
+    xl: defaultBorders.xl
+  },
+  /**
+   * Global styles
+   */
+  styles: {
+    root: {
+      /**
+       * select out of forms
+       */
+      ".react-select__control": {
+        color: "display.text.secondary.default",
+        backgroundColor: "display.background.primary.default",
+        borderColor: "display.border.muted.default",
+        borderRadius: "lg",
+        "&.react-select__control--is-disabled": {
+          border: "md",
+          backgroundColor: "input.background.muted.default",
+          borderColor: "display.border.muted.default"
+        }
+      }
+    }
+  },
+  /**
+   * Components
+   */
+  buttons: {
+    accent: {
+      borderRadius: "full"
+    },
+    primary: {
+      borderRadius: "full"
+    },
+    secondary: {
+      borderRadius: "full",
+      border: "none"
+    },
+    destructive: {
+      borderRadius: "full"
+    },
+    closeButton: {
+      borderRadius: "lg"
+    },
+    actionButton: {
+      default: {
+        border: "none",
+        ":is(:focus-within, :hover)": {
+          backgroundColor: "action.background.primary.default"
+        }
+      }
+    }
+  },
+  forms: {
+    input: {
+      borderRadius: "lg"
+    },
+    inputNumber: {
+      borderRadius: "lg"
+    },
+    select: {
+      borderRadius: "lg"
+    },
+    textarea: {
+      borderRadius: "lg"
+    }
+  }
+}, BruttalTheme);
+export { OcaFonts, BrutalIcons as OcaIcons, OcaTheme };

package/dist/themes/Bruttal/Bruttal.d.ts

@@ -1,13 +1,9 @@
-import { IconifyIcon } from '@ttoss/react-icons';
+export { B as BrutalIcons } from '../../BruttalIcons-f07qZPrW.js';
 import { Theme } from 'theme-ui';
-
-declare const BrutalIcons: Record<string, IconifyIcon | {
-    __esModule: true;
-    default: IconifyIcon;
-}>;
+import '@ttoss/react-icons';
 
 declare const BruttalFonts: string[];
 
 declare const BruttalTheme: Theme;
 
-export { BrutalIcons, BruttalFonts, BruttalTheme };
+export { BruttalFonts, BruttalTheme };

package/dist/themes/Oca/Oca.d.ts

@@ -0,0 +1,9 @@
+export { B as OcaIcons } from '../../BruttalIcons-f07qZPrW.js';
+import { Theme } from 'theme-ui';
+import '@ttoss/react-icons';
+
+declare const OcaFonts: string[];
+
+declare const OcaTheme: Theme;
+
+export { OcaFonts, OcaTheme };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ttoss/theme",
-  "version": "2.0.1",
+  "version": "2.1.0",
   "description": "Theme for packages.",
   "license": "MIT",
   "author": "ttoss",
@@ -21,6 +21,10 @@
     "./Bruttal": {
       "import": "./dist/esm/themes/Bruttal/Bruttal.js",
       "types": "./dist/themes/Bruttal/Bruttal.d.ts"
+    },
+    "./Oca": {
+      "import": "./dist/esm/themes/Oca/Oca.js",
+      "types": "./dist/themes/Oca/Oca.d.ts"
     }
   },
   "files": [
@@ -41,8 +45,8 @@
     "theme-ui": "^0.17.1",
     "tsup": "^8.3.5",
     "@ttoss/config": "^1.35.2",
-    "@ttoss/react-icons": "^0.4.9",
-    "@ttoss/test-utils": "^2.1.22"
+    "@ttoss/test-utils": "^2.1.22",
+    "@ttoss/react-icons": "^0.4.9"
   },
   "keywords": [],
   "publishConfig": {