@aglyn/shared-ui-theme 1.0.0-beta.143

package/src/lib/components/theme-css-var-provider.d.ts

@@ -0,0 +1,44 @@
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import { CssVarsProvider as MuiCssVarsProvider } from '@mui/material/styles';
+import type { ComponentProps } from 'react';
+import { createResponsiveCssVarTheme } from '../util/create-responsive-theme';
+export interface ThemeCssVarProviderProps extends Omit<ComponentProps<typeof MuiCssVarsProvider>, 'theme'> {
+    theme?: {
+        light: Parameters<typeof createResponsiveCssVarTheme>[0];
+        dark: Parameters<typeof createResponsiveCssVarTheme>[1];
+    };
+}
+/**
+ * Next app middleware for material-ui theme provider component
+ *
+ * Theme provider middleware component, automatically
+ * removes the SSR style document node (e.g.#jss - server - side)
+ *
+ * @template T
+ * @param {Props} props
+ * @returns {IThemeCssVarProvider<T>}
+ */
+export declare function ThemeCssVarProvider<T>(props: ThemeCssVarProviderProps): import("react").JSX.Element;
+export declare namespace ThemeCssVarProvider {
+    var displayName: string;
+    var aglyn: boolean;
+}
+export default ThemeCssVarProvider;
+export declare function withThemeCssVarProvider<P>(WrappedComponent: JSX.ComponentType<P>, options?: ThemeCssVarProviderProps & {
+    disableCssBaseline?: boolean;
+}): import("react").ForwardRefExoticComponent<import("react").PropsWithoutRef<P> & import("react").RefAttributes<any>>;

package/src/lib/components/theme-css-var-provider.js

@@ -0,0 +1,79 @@
+import { _ as _extends } from "@swc/helpers/_/_extends";
+import { _ as _object_without_properties_loose } from "@swc/helpers/_/_object_without_properties_loose";
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * @license
+ * Copyright 2026 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */ import { getDisplayName } from "@aglyn/shared-util-tools";
+import { hoistNonReactStatics } from "@aglyn/shared-util-vendor";
+import { CssBaseline } from "@mui/material";
+import { CssVarsProvider as MuiCssVarsProvider } from "@mui/material/styles";
+import { forwardRef, useMemo } from "react";
+import { createResponsiveCssVarTheme } from "../util/create-responsive-theme.js";
+/**
+ * Next app middleware for material-ui theme provider component
+ *
+ * Theme provider middleware component, automatically
+ * removes the SSR style document node (e.g.#jss - server - side)
+ *
+ * @template T
+ * @param {Props} props
+ * @returns {IThemeCssVarProvider<T>}
+ */ export function ThemeCssVarProvider(props) {
+    const { theme, children } = props, rest = _object_without_properties_loose(props, [
+        "theme",
+        "children"
+    ]);
+    const _theme = useMemo(()=>{
+        return createResponsiveCssVarTheme(theme.light, theme.dark);
+    }, [
+        theme
+    ]);
+    return /*#__PURE__*/ _jsx(MuiCssVarsProvider, _extends({
+        theme: _theme,
+        defaultMode: "system"
+    }, rest, {
+        children: children
+    }));
+}
+ThemeCssVarProvider.displayName = 'ThemeCssVarProvider';
+ThemeCssVarProvider.aglyn = true;
+export default ThemeCssVarProvider;
+export function withThemeCssVarProvider(WrappedComponent, options) {
+    const _ref = options || {}, { disableCssBaseline } = _ref, opts = _object_without_properties_loose(_ref, [
+        "disableCssBaseline"
+    ]);
+    const WithThemeCssVarProvider = /*#__PURE__*/ forwardRef((props, ref)=>{
+        const {} = props, rest = _extends({}, props);
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        const WrappedAny = WrappedComponent;
+        return /*#__PURE__*/ _jsx(ThemeCssVarProvider, _extends({}, opts, {
+            children: disableCssBaseline ? /*#__PURE__*/ _jsx(WrappedAny, _extends({
+                ref: ref
+            }, rest)) : /*#__PURE__*/ _jsx(CssBaseline, {
+                enableColorScheme: true,
+                children: /*#__PURE__*/ _jsx(WrappedAny, _extends({
+                    ref: ref
+                }, rest))
+            })
+        }));
+    });
+    const displayName = getDisplayName(WrappedComponent);
+    WithThemeCssVarProvider.displayName = `WithThemeCssVarProvider(${displayName})`;
+    hoistNonReactStatics(WithThemeCssVarProvider, WrappedComponent);
+    return WithThemeCssVarProvider;
+}
+
+//# sourceMappingURL=theme-css-var-provider.js.map

package/src/lib/components/theme-css-var-provider.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../../../../../libs/shared/ui/theme/src/lib/components/theme-css-var-provider.tsx"],"sourcesContent":["/**\n * @license\n * Copyright 2026 Aglyn LLC\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *   http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { getDisplayName } from '@aglyn/shared-util-tools'\nimport { hoistNonReactStatics } from '@aglyn/shared-util-vendor'\nimport { CssBaseline } from '@mui/material'\nimport { CssVarsProvider as MuiCssVarsProvider } from '@mui/material/styles'\nimport type { ComponentProps } from 'react'\nimport { type ComponentType, forwardRef, useMemo } from 'react'\nimport { createResponsiveCssVarTheme } from '../util/create-responsive-theme'\n\nexport interface ThemeCssVarProviderProps\n  extends Omit<ComponentProps<typeof MuiCssVarsProvider>, 'theme'> {\n  theme?: {\n    light: Parameters<typeof createResponsiveCssVarTheme>[0]\n    dark: Parameters<typeof createResponsiveCssVarTheme>[1]\n  }\n}\n\n/**\n * Next app middleware for material-ui theme provider component\n *\n * Theme provider middleware component, automatically\n * removes the SSR style document node (e.g.#jss - server - side)\n *\n * @template T\n * @param {Props} props\n * @returns {IThemeCssVarProvider<T>}\n */\nexport function ThemeCssVarProvider<T>(props: ThemeCssVarProviderProps) {\n  const { theme, children, ...rest } = props\n\n  const _theme = useMemo(() => {\n    return createResponsiveCssVarTheme(theme.light, theme.dark)\n  }, [theme])\n\n  return (\n    <MuiCssVarsProvider theme={_theme} defaultMode=\"system\" {...rest}>\n      {children}\n    </MuiCssVarsProvider>\n  )\n}\nThemeCssVarProvider.displayName = 'ThemeCssVarProvider'\nThemeCssVarProvider.aglyn = true\n\nexport default ThemeCssVarProvider\n\nexport function withThemeCssVarProvider<P>(\n  WrappedComponent: JSX.ComponentType<P>,\n  options?: ThemeCssVarProviderProps & { disableCssBaseline?: boolean },\n) {\n  const { disableCssBaseline, ...opts } = options || {}\n\n  const WithThemeCssVarProvider = forwardRef<any, P>((props, ref) => {\n    const { ...rest } = props\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    const WrappedAny = WrappedComponent as ComponentType<any>\n    return (\n      <ThemeCssVarProvider {...opts}>\n        {disableCssBaseline ? (\n          <WrappedAny ref={ref} {...rest} />\n        ) : (\n          <CssBaseline enableColorScheme>\n            <WrappedAny ref={ref} {...rest} />\n          </CssBaseline>\n        )}\n      </ThemeCssVarProvider>\n    )\n  })\n  const displayName = getDisplayName(WrappedComponent)\n  WithThemeCssVarProvider.displayName = `WithThemeCssVarProvider(${displayName})`\n  hoistNonReactStatics(WithThemeCssVarProvider, WrappedComponent)\n\n  return WithThemeCssVarProvider\n}\n"],"names":["getDisplayName","hoistNonReactStatics","CssBaseline","CssVarsProvider","MuiCssVarsProvider","forwardRef","useMemo","createResponsiveCssVarTheme","ThemeCssVarProvider","props","theme","children","rest","_theme","light","dark","defaultMode","displayName","aglyn","withThemeCssVarProvider","WrappedComponent","options","disableCssBaseline","opts","WithThemeCssVarProvider","ref","WrappedAny","enableColorScheme"],"mappings":";;;AAAA;;;;;;;;;;;;;;;CAeC,GAED,SAASA,cAAc,QAAQ,2BAA0B;AACzD,SAASC,oBAAoB,QAAQ,4BAA2B;AAChE,SAASC,WAAW,QAAQ,gBAAe;AAC3C,SAASC,mBAAmBC,kBAAkB,QAAQ,uBAAsB;AAE5E,SAA6BC,UAAU,EAAEC,OAAO,QAAQ,QAAO;AAC/D,SAASC,2BAA2B,QAAQ,qCAAiC;AAU7E;;;;;;;;;CASC,GACD,OAAO,SAASC,oBAAuBC,KAA+B;IACpE,MAAM,EAAEC,KAAK,EAAEC,QAAQ,EAAW,GAAGF,OAATG,wCAASH;;;;IAErC,MAAMI,SAASP,QAAQ;QACrB,OAAOC,4BAA4BG,MAAMI,KAAK,EAAEJ,MAAMK,IAAI;IAC5D,GAAG;QAACL;KAAM;IAEV,qBACE,KAACN;QAAmBM,OAAOG;QAAQG,aAAY;OAAaJ;kBACzDD;;AAGP;AACAH,oBAAoBS,WAAW,GAAG;AAClCT,oBAAoBU,KAAK,GAAG;AAE5B,eAAeV,oBAAmB;AAElC,OAAO,SAASW,wBACdC,gBAAsC,EACtCC,OAAqE;IAErE,MAAwCA,OAAAA,WAAW,CAAC,GAA9C,EAAEC,kBAAkB,EAAW,GAAGD,MAATE,wCAASF;;;IAExC,MAAMG,wCAA0BnB,WAAmB,CAACI,OAAOgB;QACzD,MAAM,EAAW,GAAGhB,OAATG,oBAASH;QACpB,8DAA8D;QAC9D,MAAMiB,aAAaN;QACnB,qBACE,KAACZ,kCAAwBe;sBACtBD,mCACC,KAACI;gBAAWD,KAAKA;eAASb,uBAE1B,KAACV;gBAAYyB,iBAAiB;0BAC5B,cAAA,KAACD;oBAAWD,KAAKA;mBAASb;;;IAKpC;IACA,MAAMK,cAAcjB,eAAeoB;IACnCI,wBAAwBP,WAAW,GAAG,CAAC,wBAAwB,EAAEA,YAAY,CAAC,CAAC;IAC/EhB,qBAAqBuB,yBAAyBJ;IAE9C,OAAOI;AACT"}

package/src/lib/console.theme.d.ts

@@ -0,0 +1,34 @@
+/**
+ * @license
+ * Copyright 2023 Aglyn LLC
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *   http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+import type { PaletteOptions, Theme, ThemeOptions } from '../vendor/mui';
+export type ColorVariant = 'light' | 'dark';
+export type BackgroundRecord = PaletteOptions['background'];
+export type OrdinalIdentifier<K extends string = ''> = 'primary' | 'secondary' | 'tertiary';
+export type OrdinalRecord<T extends OrdinalIdentifier = OrdinalIdentifier> = Pick<PaletteOptions, T>;
+export type PrimaryRecord = OrdinalRecord<'primary'>['primary'];
+export type SecondaryRecord = OrdinalRecord<'secondary'>['secondary'];
+export type TertiaryRecord = OrdinalRecord<'tertiary'>['tertiary'];
+export type ActionIdentifier = 'svgBackground' | 'svgFilled' | 'svgStroke';
+export type ActionRecord = Pick<PaletteOptions, ActionIdentifier>;
+export declare const consoleOptions: ThemeOptions;
+export declare const consoleOptionsDark: ThemeOptions;
+export declare const consoleThemeLight: Theme;
+export declare const consoleThemeDark: Theme;
+export declare const consoleThemeCssVar: Omit<Theme, "applyStyles"> & import("@mui/material").CssVarsTheme;
+export declare const getConsoleTheme: (mode?: "light" | "dark") => Theme;
+export declare const getConsoleMetaThemeColor: (mode?: "light" | "dark") => string;
+export default consoleThemeLight;