@dexma/ui-components 8.0.40 → 8.0.42

package/README.md

@@ -49,7 +49,42 @@ import { Theme, Button } from '@dexma/ui-components';
 </Theme>;
 ```
 
-You can find all the configuration in the theme file [theme.js](https://github.com/dexma/ui-components/blob/master/src/styles/theme.js)
+You can find all the configuration in the theme file [theme.ts](https://github.com/dexma/ui-components/blob/master/src/lib/utils/theme.ts)
+
+## Typography
+
+The platform font is **Montserrat**, self-hosted by this package — there is no Google Fonts (or any
+other CDN) request at runtime.
+
+Every app **must register the font faces once, at its entry point** (one line per webpack/Vite entry):
+
+```typescript
+import '@dexma/ui-components/fonts.css';
+```
+
+Without this import the UI silently renders the fallback system stack — everything works, but nothing
+is Montserrat. `GlobalStyle` applies the font; `fonts.css` provides it. You need both.
+
+The shipped subsets are `latin`, `latin-ext` (pl_PL) and `cyrillic` (bg_BG), each behind a
+`unicode-range` so browsers only download what the locale needs. `zh_CN` is not covered by Montserrat
+and intentionally falls through to the system CJK faces in the stack.
+
+Never write the font stack as a literal in an app. Where a style genuinely cannot inherit the page
+font (shadow-DOM `::part()` rules, canvas/SVG text, server-rendered images), use the exported token:
+
+```typescript
+import { typography } from '@dexma/ui-components';
+
+const Styled = styled.div`
+    font-family: ${typography.fontFamily};
+`;
+```
+
+The binaries come from `@fontsource-variable/montserrat` (SIL OFL 1.1) at build time via
+`scripts/buildFontConfig.mjs` — that script's header documents the full checklist for changing the
+platform font. Repositories that cannot consume this npm package (dexcell, grader-demo, is3frontend,
+anomaly-detection-dash-ui, detect-reports-generator) must self-host the **same version** of the font
+as this package's `@fontsource-variable/montserrat` devDependency, so rendering stays consistent.
 
 ## Installation
 

package/dist/fonts/LICENSE

@@ -0,0 +1,93 @@
+Copyright 2011 The Montserrat Project Authors (https://github.com/JulietaUla/Montserrat) Montserrat-Italic[wght].ttf: Copyright 2011 The Montserrat Project Authors (https://github.com/JulietaUla/Montserrat)
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.

package/dist/fonts.css

@@ -0,0 +1,29 @@
+/* montserrat-latin-wght-normal */
+@font-face {
+    font-family: 'Montserrat';
+    font-style: normal;
+    font-display: swap;
+    font-weight: 100 900;
+    src: url(./fonts/montserrat-latin-wght-normal.woff2) format('woff2-variations');
+    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
+}
+
+/* montserrat-latin-ext-wght-normal */
+@font-face {
+    font-family: 'Montserrat';
+    font-style: normal;
+    font-display: swap;
+    font-weight: 100 900;
+    src: url(./fonts/montserrat-latin-ext-wght-normal.woff2) format('woff2-variations');
+    unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
+}
+
+/* montserrat-cyrillic-wght-normal */
+@font-face {
+    font-family: 'Montserrat';
+    font-style: normal;
+    font-display: swap;
+    font-weight: 100 900;
+    src: url(./fonts/montserrat-cyrillic-wght-normal.woff2) format('woff2-variations');
+    unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
+}

package/dist/lib/components/ConfigProvider/ConfigProvider.d.ts

@@ -0,0 +1,16 @@
+import { ComponentProps } from 'react';
+import { ConfigProvider as ConfigProviderAntd } from 'antd';
+export type ConfigProviderProps = ComponentProps<typeof ConfigProviderAntd>;
+/**
+ * antd's ConfigProvider with the platform type stack injected.
+ *
+ * antd emits its own `font-family` on `.ant-*` class roots from `token.fontFamily` (default: a
+ * system stack), so antd-backed components do not inherit the family from `body`. Without this,
+ * every Table / Select / DatePicker would keep the old font while the rest of the app renders
+ * Montserrat. antd merges tokens into nested providers, so mounting this once at an app root also
+ * covers the per-component providers inside the library.
+ *
+ * A caller-supplied `theme.token.fontFamily` still wins.
+ */
+export declare const ConfigProvider: ({ theme, children, ...props }: ConfigProviderProps) => import("react/jsx-runtime").JSX.Element;
+export default ConfigProvider;

package/dist/lib/components/ConfigProvider/index.d.ts

@@ -0,0 +1 @@
+export * from './ConfigProvider';

package/dist/lib/components/Typography/Typography.d.ts

@@ -0,0 +1,17 @@
+import { ElementType, HTMLAttributes, ReactNode } from 'react';
+import { TypographyVariant, TypographyWeight } from '../../styles/Typography/StyledTypography';
+export type TypographyProps = {
+    /** `h1`–`h6` use the heading scale; `small`–`xlarge` use the paragraph scale. */
+    variant?: TypographyVariant;
+    weight?: TypographyWeight;
+    color?: string;
+    /** Rendered element. Set this for semantics — `variant` only controls type styles. */
+    as?: ElementType;
+    children?: ReactNode;
+} & HTMLAttributes<HTMLElement>;
+/**
+ * The text primitive for new screens: sizes and weights always come from the theme tokens.
+ * Use this instead of an ad-hoc `styled.span` with font-size/font-weight literals.
+ */
+export declare const Typography: ({ variant, weight, color, as, children, ...props }: TypographyProps) => import("react/jsx-runtime").JSX.Element;
+export default Typography;

package/dist/lib/components/Typography/index.d.ts

@@ -0,0 +1 @@
+export * from './Typography';

package/dist/lib/components/index.d.ts

@@ -36,6 +36,7 @@ export * from './Table';
 export * from './Theme';
 export * from './Toaster';
 export * from './Tooltip';
+export * from './Typography';
 export * from './Switch';
 export * from './SwitchPeriodComparative';
 export * from './Select';
@@ -44,6 +45,6 @@ export * from './Tree';
 export * from './Upload';
 export * from './TreeSelect';
 export * from './Breadcrumb';
-export { ConfigProvider } from 'antd';
+export * from './ConfigProvider';
 export { DataIdProvider } from './DataId/DataIdProvider';
 export { withDataId } from './DataId/withDataId';

package/dist/lib/index.d.ts

@@ -1,4 +1,22 @@
 import { GlobalStyle, IsolatedGlobalStyle, UIComponentsStyle } from './utils/global';
 import { color as colors } from './utils/theme';
 export * from './components';
+/**
+ * Typography tokens, exposed the same way `colors` is.
+ *
+ * Most UI inherits the family from `GlobalStyle` — reach for this only where inheritance cannot
+ * apply (shadow-DOM `::part()` styles, canvas/SVG text, server-rendered images). Never redeclare
+ * the stack as a literal in an app; this export is its single source of truth.
+ */
+export declare const typography: {
+    fontFamily: string;
+    fontSize: string;
+    fontWeight: {
+        light: number;
+        normal: number;
+        medium: number;
+        semiBold: number;
+        bold: number;
+    };
+};
 export { GlobalStyle, IsolatedGlobalStyle, UIComponentsStyle, colors };

package/dist/lib/styles/Typography/StyledTypography.d.ts

@@ -0,0 +1,10 @@
+import { Theme } from '../../utils/theme';
+export type TypographyVariant = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' | 'small' | 'medium' | 'large' | 'xlarge';
+export type TypographyWeight = 'light' | 'normal' | 'medium' | 'semiBold' | 'bold';
+declare const StyledTypography: import('styled-components/dist/types').IStyledComponentBase<"web", import('styled-components/dist/types').Substitute<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+    $variant: TypographyVariant;
+    $weight: TypographyWeight;
+    $color: string;
+    theme: Theme;
+}>> & string;
+export { StyledTypography };

package/dist/lib/utils/theme.d.ts

@@ -90,10 +90,16 @@ export declare const fontColor: string;
 export declare const fontColorActive: string;
 export declare const fontWeightLight = 300;
 export declare const fontWeightNormal = 400;
+export declare const fontWeightMedium = 500;
 export declare const fontWeightSemiBold = 600;
 export declare const fontWeightBold = 700;
-export declare const fontFamily = "\"Montserrat\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Helvetica, Arial, sans-serif";
-export declare const fontImportUrl = "https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap";
+/**
+ * The single definition of the platform type stack — never redeclare it in an app.
+ * Montserrat is self-hosted by this package; consumers register the faces with
+ * `import '@dexma/ui-components/fonts.css'`. The CJK entries matter: Montserrat has no
+ * CJK glyphs, so zh_CN falls through to a proper system face instead of the generic default.
+ */
+export declare const fontFamily = "\"Montserrat\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", \"PingFang SC\", \"Hiragino Sans GB\", \"Microsoft YaHei\", Helvetica, Arial, sans-serif, \"Apple Color Emoji\", \"Segoe UI Emoji\", \"Segoe UI Symbol\"";
 export declare const pxToRem: (px: number) => number;
 export declare const iconSize = "1rem";
 export declare const iconColor: string;