@optimum-intelligence/opti-ui 0.2.0 → 0.4.0

package/dist/theme/ThemeProvider.d.ts

@@ -9,6 +9,7 @@ export declare function themeToStyle(theme: Theme | undefined): React.CSSPropert
 /** Builds a theme from a base, applying overrides on top. */
 export declare function createTheme(...themes: Theme[]): Theme;
 export interface ThemeProviderProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Ref to the provider's root element. */
     ref?: React.Ref<HTMLDivElement>;
     /** Token overrides applied to this subtree. */
     theme?: Theme;

package/dist/theme/ThemeProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.js","names":["React","PortalContainerContext","cx","ThemeTokenName","Theme","Partial","Record","ColorMode","themeToStyle","theme","CSSProperties","style","name","value","Object","entries","createTheme","themes","assign","ThemeProviderProps","HTMLAttributes","HTMLDivElement","ref","Ref","mode","ThemeProvider","t0","$","_c","children","className","props","container","setContainer","useState","t1","t2","t3","t4","t5","Symbol","for","t6","_c"],"sources":["../../src/theme/ThemeProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { PortalContainerContext } from '../utils/portal';\nimport { cx } from '../utils/cx';\n\n/** Token names without the `--oui-` prefix, e.g. `color-accent` or `radius-card`. */\nexport type ThemeTokenName =\n  | `color-${string}`\n  | `font-${string}`\n  | `radius-${string}`\n  | `shadow-${string}`\n  | `control-${string}`\n  | `duration-${string}`\n  | `ease${string}`\n  | `z-${string}`\n  | `focus-${string}`\n  | `${string}-radius`\n  | `${string}-height`;\n\n/** A partial set of token overrides. Values are any valid CSS value. */\nexport type Theme = Partial<Record<ThemeTokenName, string>>;\n\nexport type ColorMode = 'light' | 'dark';\n\n/** Converts a theme object into CSS custom properties for a `style` prop. */\nexport function themeToStyle(theme: Theme | undefined): React.CSSProperties {\n  const style: Record<string, string> = {};\n  if (!theme) return style;\n  for (const [name, value] of Object.entries(theme)) {\n    if (value != null && value !== '') style[`--oui-${name}`] = value;\n  }\n  return style as React.CSSProperties;\n}\n\n/** Builds a theme from a base, applying overrides on top. */\nexport function createTheme(...themes: Theme[]): Theme {\n  return Object.assign({}, ...themes);\n}\n\nexport interface ThemeProviderProps extends React.HTMLAttributes<HTMLDivElement> {\n  ref?: React.Ref<HTMLDivElement>;\n  /** Token overrides applied to this subtree. */\n  theme?: Theme;\n  /** Color mode for this subtree. */\n  mode?: ColorMode;\n}\n\n/**\n * Scopes a theme to its children. Popups opened inside are portalled into the\n * provider so they pick up the same tokens.\n */\nexport function ThemeProvider({ theme, mode, className, style, children, ref, ...props }: ThemeProviderProps) {\n  const [container, setContainer] = React.useState<HTMLDivElement | null>(null);\n  return (\n    <div\n      ref={ref}\n      className={cx('oui-theme', className)}\n      data-oui-theme={mode}\n      style={{ ...themeToStyle(theme), ...style }}\n      {...props}\n    >\n      <PortalContainerContext value={container}>{children}</PortalContainerContext>\n      <div className=\"oui-theme__portal\" ref={setContainer} />\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;AAwBA,SAAgBQ,aAAaC,OAA+C;CAC1E,MAAME,QAAgC,CAAC;CACvC,IAAI,CAACF,OAAO,OAAOE;CACnB,KAAK,MAAM,CAACC,MAAMC,UAAUC,OAAOC,QAAQN,KAAK,GAC9C,IAAII,SAAS,QAAQA,UAAU,IAAIF,MAAM,SAASC,UAAUC;CAE9D,OAAOF;AACT;;AAGA,SAAgBK,YAAY,GAAGC,QAAwB;CACrD,OAAOH,OAAOI,OAAO,CAAC,GAAG,GAAGD,MAAM;AACpC;;;;;AAcA,SAAOQ,cAAAC,IAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAN;CAAA,IAAAO;CAAA,IAAAT;CAAA,IAAAX;CAAA,IAAAF;CAAA,IAAAkB,EAAA,OAAAD,IAAA;EAAuB,CAAA,CAAAjB,OAAAe,MAAAM,WAAAnB,OAAAkB,UAAAP,KAAA,GAAAS,SAAAL;EAA8EC,EAAA,KAAAD;EAAAC,EAAA,KAAAE;EAAAF,EAAA,KAAAG;EAAAH,EAAA,KAAAH;EAAAG,EAAA,KAAAI;EAAAJ,EAAA,KAAAL;EAAAK,EAAA,KAAAhB;EAAAgB,EAAA,KAAAlB;CAAA,OAAA;EAAAoB,WAAAF,EAAA;EAAAG,YAAAH,EAAA;EAAAH,OAAAG,EAAA;EAAAI,QAAAJ,EAAA;EAAAL,MAAAK,EAAA;EAAAhB,QAAAgB,EAAA;EAAAlB,QAAAkB,EAAA;CAAA;CAC1G,MAAA,CAAAK,WAAAC,gBAAkCjC,MAAKkC,SAAiC,IAAI;CAAE,IAAAC;CAAA,IAAAR,EAAA,OAAAG,WAAA;EAI/DK,KAAAjC,GAAG,aAAa4B,SAAS;EAACH,EAAA,KAAAG;EAAAH,EAAA,KAAAQ;CAAA,OAAAA,KAAAR,EAAA;CAAA,IAAAS;CAAA,IAAAT,EAAA,QAAAlB,OAAA;EAEzB2B,KAAA5B,aAAaC,KAAK;EAACkB,EAAA,MAAAlB;EAAAkB,EAAA,MAAAS;CAAA,OAAAA,KAAAT,EAAA;CAAA,IAAAU;CAAA,IAAAV,EAAA,QAAAhB,SAAAgB,EAAA,QAAAS,IAAA;EAAxBC,KAAA;GAAA,GAAKD;GAAmB,GAAKzB;EAAM;EAACgB,EAAA,MAAAhB;EAAAgB,EAAA,MAAAS;EAAAT,EAAA,MAAAU;CAAA,OAAAA,KAAAV,EAAA;CAAA,IAAAW;CAAA,IAAAX,EAAA,QAAAE,YAAAF,EAAA,QAAAK,WAAA;EAG3CM,KAAA,oBAAC,wBAAD;GAA+BN,OAAAA;GAAYH;EAApB,CAAA;EAAsDF,EAAA,MAAAE;EAAAF,EAAA,MAAAK;EAAAL,EAAA,MAAAW;CAAA,OAAAA,KAAAX,EAAA;CAAA,IAAAY;CAAA,IAAAZ,EAAA,QAAAa,OAAAC,IAAA,2BAAA,GAAA;EAC7EF,KAAA,oBAAA,OAAA;GAAe,WAAA;GAAyBN,KAAAA;EAAY,CAAA;EAAIN,EAAA,MAAAY;CAAA,OAAAA,KAAAZ,EAAA;CAAA,IAAAe;CAAA,IAAAf,EAAA,QAAAH,QAAAG,EAAA,QAAAI,SAAAJ,EAAA,QAAAL,OAAAK,EAAA,QAAAQ,MAAAR,EAAA,QAAAU,MAAAV,EAAA,QAAAW,IAAA;EAR1DI,KAAA,qBAAA,OAAA;GACOpB;GACM,WAAAa;GACKX,kBAAAA;GACT,OAAAa;GAAoC,GACvCN;GALN,UAAA,CAOEO,IACAC,EACI;;EAAAZ,EAAA,MAAAH;EAAAG,EAAA,MAAAI;EAAAJ,EAAA,MAAAL;EAAAK,EAAA,MAAAQ;EAAAR,EAAA,MAAAU;EAAAV,EAAA,MAAAW;EAAAX,EAAA,MAAAe;CAAA,OAAAA,KAAAf,EAAA;CAAA,OATNe;AASM"}
+{"version":3,"file":"ThemeProvider.js","names":["React","PortalContainerContext","cx","ThemeTokenName","Theme","Partial","Record","ColorMode","themeToStyle","theme","CSSProperties","style","name","value","Object","entries","createTheme","themes","assign","ThemeProviderProps","HTMLAttributes","HTMLDivElement","ref","Ref","mode","ThemeProvider","t0","$","_c","children","className","props","container","setContainer","useState","t1","t2","t3","t4","t5","Symbol","for","t6","_c"],"sources":["../../src/theme/ThemeProvider.tsx"],"sourcesContent":["import * as React from 'react';\nimport { PortalContainerContext } from '../utils/portal';\nimport { cx } from '../utils/cx';\n\n/** Token names without the `--oui-` prefix, e.g. `color-accent` or `radius-card`. */\nexport type ThemeTokenName =\n  | `color-${string}`\n  | `font-${string}`\n  | `radius-${string}`\n  | `shadow-${string}`\n  | `control-${string}`\n  | `duration-${string}`\n  | `ease${string}`\n  | `z-${string}`\n  | `focus-${string}`\n  | `${string}-radius`\n  | `${string}-height`;\n\n/** A partial set of token overrides. Values are any valid CSS value. */\nexport type Theme = Partial<Record<ThemeTokenName, string>>;\n\nexport type ColorMode = 'light' | 'dark';\n\n/** Converts a theme object into CSS custom properties for a `style` prop. */\nexport function themeToStyle(theme: Theme | undefined): React.CSSProperties {\n  const style: Record<string, string> = {};\n  if (!theme) return style;\n  for (const [name, value] of Object.entries(theme)) {\n    if (value != null && value !== '') style[`--oui-${name}`] = value;\n  }\n  return style as React.CSSProperties;\n}\n\n/** Builds a theme from a base, applying overrides on top. */\nexport function createTheme(...themes: Theme[]): Theme {\n  return Object.assign({}, ...themes);\n}\n\nexport interface ThemeProviderProps extends React.HTMLAttributes<HTMLDivElement> {\n  /** Ref to the provider's root element. */\n  ref?: React.Ref<HTMLDivElement>;\n  /** Token overrides applied to this subtree. */\n  theme?: Theme;\n  /** Color mode for this subtree. */\n  mode?: ColorMode;\n}\n\n/**\n * Scopes a theme to its children. Popups opened inside are portalled into the\n * provider so they pick up the same tokens.\n */\nexport function ThemeProvider({ theme, mode, className, style, children, ref, ...props }: ThemeProviderProps) {\n  const [container, setContainer] = React.useState<HTMLDivElement | null>(null);\n  return (\n    <div\n      ref={ref}\n      className={cx('oui-theme', className)}\n      data-oui-theme={mode}\n      style={{ ...themeToStyle(theme), ...style }}\n      {...props}\n    >\n      <PortalContainerContext value={container}>{children}</PortalContainerContext>\n      <div className=\"oui-theme__portal\" ref={setContainer} />\n    </div>\n  );\n}\n"],"mappings":";;;;;;;;AAwBA,SAAgBQ,aAAaC,OAA+C;CAC1E,MAAME,QAAgC,CAAC;CACvC,IAAI,CAACF,OAAO,OAAOE;CACnB,KAAK,MAAM,CAACC,MAAMC,UAAUC,OAAOC,QAAQN,KAAK,GAC9C,IAAII,SAAS,QAAQA,UAAU,IAAIF,MAAM,SAASC,UAAUC;CAE9D,OAAOF;AACT;;AAGA,SAAgBK,YAAY,GAAGC,QAAwB;CACrD,OAAOH,OAAOI,OAAO,CAAC,GAAG,GAAGD,MAAM;AACpC;;;;;AAeA,SAAOQ,cAAAC,IAAA;CAAA,MAAAC,IAAAC,EAAA,EAAA;CAAA,IAAAC;CAAA,IAAAC;CAAA,IAAAN;CAAA,IAAAO;CAAA,IAAAT;CAAA,IAAAX;CAAA,IAAAF;CAAA,IAAAkB,EAAA,OAAAD,IAAA;EAAuB,CAAA,CAAAjB,OAAAe,MAAAM,WAAAnB,OAAAkB,UAAAP,KAAA,GAAAS,SAAAL;EAA8EC,EAAA,KAAAD;EAAAC,EAAA,KAAAE;EAAAF,EAAA,KAAAG;EAAAH,EAAA,KAAAH;EAAAG,EAAA,KAAAI;EAAAJ,EAAA,KAAAL;EAAAK,EAAA,KAAAhB;EAAAgB,EAAA,KAAAlB;CAAA,OAAA;EAAAoB,WAAAF,EAAA;EAAAG,YAAAH,EAAA;EAAAH,OAAAG,EAAA;EAAAI,QAAAJ,EAAA;EAAAL,MAAAK,EAAA;EAAAhB,QAAAgB,EAAA;EAAAlB,QAAAkB,EAAA;CAAA;CAC1G,MAAA,CAAAK,WAAAC,gBAAkCjC,MAAKkC,SAAiC,IAAI;CAAE,IAAAC;CAAA,IAAAR,EAAA,OAAAG,WAAA;EAI/DK,KAAAjC,GAAG,aAAa4B,SAAS;EAACH,EAAA,KAAAG;EAAAH,EAAA,KAAAQ;CAAA,OAAAA,KAAAR,EAAA;CAAA,IAAAS;CAAA,IAAAT,EAAA,QAAAlB,OAAA;EAEzB2B,KAAA5B,aAAaC,KAAK;EAACkB,EAAA,MAAAlB;EAAAkB,EAAA,MAAAS;CAAA,OAAAA,KAAAT,EAAA;CAAA,IAAAU;CAAA,IAAAV,EAAA,QAAAhB,SAAAgB,EAAA,QAAAS,IAAA;EAAxBC,KAAA;GAAA,GAAKD;GAAmB,GAAKzB;EAAM;EAACgB,EAAA,MAAAhB;EAAAgB,EAAA,MAAAS;EAAAT,EAAA,MAAAU;CAAA,OAAAA,KAAAV,EAAA;CAAA,IAAAW;CAAA,IAAAX,EAAA,QAAAE,YAAAF,EAAA,QAAAK,WAAA;EAG3CM,KAAA,oBAAC,wBAAD;GAA+BN,OAAAA;GAAYH;EAApB,CAAA;EAAsDF,EAAA,MAAAE;EAAAF,EAAA,MAAAK;EAAAL,EAAA,MAAAW;CAAA,OAAAA,KAAAX,EAAA;CAAA,IAAAY;CAAA,IAAAZ,EAAA,QAAAa,OAAAC,IAAA,2BAAA,GAAA;EAC7EF,KAAA,oBAAA,OAAA;GAAe,WAAA;GAAyBN,KAAAA;EAAY,CAAA;EAAIN,EAAA,MAAAY;CAAA,OAAAA,KAAAZ,EAAA;CAAA,IAAAe;CAAA,IAAAf,EAAA,QAAAH,QAAAG,EAAA,QAAAI,SAAAJ,EAAA,QAAAL,OAAAK,EAAA,QAAAQ,MAAAR,EAAA,QAAAU,MAAAV,EAAA,QAAAW,IAAA;EAR1DI,KAAA,qBAAA,OAAA;GACOpB;GACM,WAAAa;GACKX,kBAAAA;GACT,OAAAa;GAAoC,GACvCN;GALN,UAAA,CAOEO,IACAC,EACI;;EAAAZ,EAAA,MAAAH;EAAAG,EAAA,MAAAI;EAAAJ,EAAA,MAAAL;EAAAK,EAAA,MAAAQ;EAAAR,EAAA,MAAAU;EAAAV,EAAA,MAAAW;EAAAX,EAAA,MAAAe;CAAA,OAAAA,KAAAf,EAAA;CAAA,OATNe;AASM"}

package/dist/utils/portal.d.ts

@@ -5,4 +5,8 @@ import * as React from 'react';
  * inherit its tokens — this context carries the container element.
  */
 export declare const PortalContainerContext: React.Context<HTMLElement | null>;
+/**
+ * Returns the element popups should portal into: the nearest `ThemeProvider`, or
+ * `undefined` for the document body. Pass it as `container` when building a custom portalled popup.
+ */
 export declare function usePortalContainer(): HTMLElement | undefined;

package/dist/utils/portal.js

@@ -7,6 +7,10 @@ import * as React from "react";
 * inherit its tokens — this context carries the container element.
 */
 var PortalContainerContext = React.createContext(null);
+/**
+* Returns the element popups should portal into: the nearest `ThemeProvider`, or
+* `undefined` for the document body. Pass it as `container` when building a custom portalled popup.
+*/
 function usePortalContainer() {
 	return React.useContext(PortalContainerContext) ?? void 0;
 }

package/dist/utils/portal.js.map

@@ -1 +1 @@
-{"version":3,"file":"portal.js","names":["React","PortalContainerContext","createContext","HTMLElement","usePortalContainer","useContext","undefined"],"sources":["../../src/utils/portal.tsx"],"sourcesContent":["import * as React from 'react';\n\n/**\n * Popups (menus, selects, dialogs…) are portalled. When a ThemeProvider scopes\n * a theme to part of the page, popups must render inside that scope so they\n * inherit its tokens — this context carries the container element.\n */\nexport const PortalContainerContext = React.createContext<HTMLElement | null>(null);\n\nexport function usePortalContainer(): HTMLElement | undefined {\n  return React.useContext(PortalContainerContext) ?? undefined;\n}\n"],"mappings":";;;;;;;;AAOA,IAAaC,yBAAyBD,MAAME,cAAkC,IAAI;AAElF,SAAOE,qBAAA;CAAA,OACEJ,MAAKK,WAAYJ,sBAAmC,KAApDK,KAAAA;AAAqD"}
+{"version":3,"file":"portal.js","names":["React","PortalContainerContext","createContext","HTMLElement","usePortalContainer","useContext","undefined"],"sources":["../../src/utils/portal.tsx"],"sourcesContent":["import * as React from 'react';\n\n/**\n * Popups (menus, selects, dialogs…) are portalled. When a ThemeProvider scopes\n * a theme to part of the page, popups must render inside that scope so they\n * inherit its tokens — this context carries the container element.\n */\nexport const PortalContainerContext = React.createContext<HTMLElement | null>(null);\n\n/**\n * Returns the element popups should portal into: the nearest `ThemeProvider`, or\n * `undefined` for the document body. Pass it as `container` when building a custom portalled popup.\n */\nexport function usePortalContainer(): HTMLElement | undefined {\n  return React.useContext(PortalContainerContext) ?? undefined;\n}\n"],"mappings":";;;;;;;;AAOA,IAAaC,yBAAyBD,MAAME,cAAkC,IAAI;;;;;AAMlF,SAAOE,qBAAA;CAAA,OACEJ,MAAKK,WAAYJ,sBAAmC,KAApDK,KAAAA;AAAqD"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@optimum-intelligence/opti-ui",
-  "version": "0.2.0",
+  "version": "0.4.0",
   "description": "Optimum's customizable React component library, built on Base UI.",
   "license": "SEE LICENSE IN LICENSE",
   "author": "Optimum Intelligence",
@@ -31,7 +31,10 @@
       "import": "./dist/index.js"
     },
     "./styles.css": "./dist/opti-ui.css",
-    "./fonts.css": "./dist/fonts.css"
+    "./fonts.css": "./dist/fonts.css",
+    "./components.json": "./dist/components.json",
+    "./llms.txt": "./dist/llms.txt",
+    "./llms-full.txt": "./dist/llms-full.txt"
   },
   "sideEffects": [
     "**/*.css"
@@ -39,7 +42,8 @@
   "scripts": {
     "dev": "vite --host 127.0.0.1",
     "typecheck": "tsc --noEmit",
-    "build": "npm run typecheck && vite build && tsc -p tsconfig.build.json",
+    "build": "npm run typecheck && vite build && tsc -p tsconfig.build.json && npm run docs",
+    "docs": "node scripts/generate-docs.mjs",
     "build:showcase": "vite build --mode showcase",
     "test": "npm run build && node --test tests/",
     "prepack": "npm run build"