anu-verzum 2.2.3 → 2.2.4

package/dist/core/components/Component.d.ts

@@ -3,7 +3,6 @@ export declare abstract class Component<P extends Record<string, any> = Props, S
     props: P;
     state: S;
     context: Record<string, any>;
-    /** @internal Set by the reconciler. */
     __fiber?: any;
     static isAnuComponent: boolean;
     constructor(props: P, context?: Record<string, any>);

package/dist/core/components/Component.js

@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", {
 exports.Component = void 0;
 var _reconciler = require("../reconciler");
 class Component {
-  /** @internal Set by the reconciler. */
-
   static isAnuComponent = true;
   constructor(props, context) {
     this.props = props || {};

package/dist/core/components/Context.js

@@ -7,12 +7,8 @@ exports.createContext = void 0;
 var _utils = require("../../misc/utils");
 var _Component = require("./Component");
 const createContext = context => {
-  const providerContext = {
-    defaultContext: {
-      value: context
-    },
-    value: {},
-    subscribers: new Set()
+  const defaultContext = {
+    value: context
   };
   const getPureProps = props => {
     const pureProps = {};
@@ -26,17 +22,18 @@ const createContext = context => {
   class ContextProvider extends _Component.Component {
     constructor(props) {
       super(props);
-      providerContext.value = {
+      this.value = {
         ...getPureProps(props)
       };
+      this.subscribers = new Set();
     }
     componentDidUpdate() {
       const pureProps = getPureProps(this.props);
-      if (!(0, _utils.deepEqual)(providerContext.value, pureProps)) {
-        providerContext.value = {
+      if (!(0, _utils.deepEqual)(this.value, pureProps)) {
+        this.value = {
           ...pureProps
         };
-        providerContext.subscribers.forEach(consumer => consumer.setState());
+        this.subscribers.forEach(consumer => consumer.setState());
       }
     }
     render() {
@@ -52,23 +49,45 @@ const createContext = context => {
       }
     }
   }
+  const resolveProvider = consumer => {
+    let fiber = consumer.__fiber?.parent;
+    while (fiber) {
+      if (fiber.stateNode instanceof ContextProvider) {
+        return fiber.stateNode;
+      }
+      fiber = fiber.parent;
+    }
+    return null;
+  };
   class ContextConsumer extends _Component.Component {
-    componentDidMount() {
-      providerContext.subscribers.add(this);
+    provider = null;
+    subscribeTo(provider) {
+      if (this.provider === provider) {
+        return;
+      }
+      if (this.provider) {
+        this.provider.subscribers.delete(this);
+      }
+      this.provider = provider;
+      if (provider) {
+        provider.subscribers.add(this);
+      }
     }
     componentWillUnmount() {
-      providerContext.subscribers.delete(this);
+      if (this.provider) {
+        this.provider.subscribers.delete(this);
+        this.provider = null;
+      }
     }
     render() {
       const children = this.props.children;
-      const {
-        value,
-        defaultContext
-      } = providerContext;
       try {
         if (!children || children.length !== 1) {
           throw new Error('Context Component must have exactly one child element!');
         }
+        const provider = resolveProvider(this);
+        this.subscribeTo(provider);
+        const value = provider ? provider.value : defaultContext.value;
         const {
           type
         } = children[0];

package/dist/core/components/Intl.d.ts

@@ -3,6 +3,7 @@ export interface IntlProviderProps extends Props {
     locale: string | null;
     messages: Record<string, Record<string, string>>;
     defaultLocale?: string;
+    options?: FormatNumberOptions & AbbreviateNumberOptions;
 }
 export interface FormattedMessageProps extends Props {
     id: string;
@@ -21,12 +22,12 @@ export interface ParseNumberOptions {
     locale?: string;
 }
 declare const Intl: {
-    abbreviateNumber: (value: number, options?: AbbreviateNumberOptions) => string | number;
+    abbreviateNumber: (value: number | string | null | undefined, options?: FormatNumberOptions & AbbreviateNumberOptions) => string | number | null | undefined;
     formatNumber: (value: number, options?: FormatNumberOptions) => string;
     parseNumber: (text: string, options?: ParseNumberOptions) => number | null;
     FormattedMessage: ({ id, values, defaultMessage }: FormattedMessageProps) => AnuElement;
     formatMessage: (id: string, values?: Record<string, string | number>, defaultMessage?: string) => string;
-    Provider: ({ locale, messages, defaultLocale, children }: IntlProviderProps) => AnuElement | null;
+    Provider: ({ locale, messages, defaultLocale, options, children }: IntlProviderProps) => AnuElement | null;
 };
 export default Intl;
 export declare const __testing: {

package/dist/core/components/Intl.js

@@ -9,17 +9,44 @@ var _Context = require("./Context");
 const _Intl = (0, _Context.createContext)({});
 let __messagesContext = {
   locale: undefined,
-  messages: {}
+  messages: {},
+  options: {}
+};
+const ABBREVIATE_KEYS = ['units', 'decimalPlaces', 'decimalSign'];
+const pickNumberFormatOptions = options => {
+  const result = {};
+  Object.keys(options).forEach(key => {
+    if (key !== 'locale' && ABBREVIATE_KEYS.indexOf(key) === -1 && options[key] !== undefined) {
+      result[key] = options[key];
+    }
+  });
+  return result;
+};
+const computeAggregatedOptions = (locale, userOptions = {}) => {
+  const engineDefaults = {};
+  try {
+    Object.assign(engineDefaults, new globalThis.Intl.NumberFormat(locale || undefined).resolvedOptions());
+    delete engineDefaults.locale;
+  } catch (err) {
+    console.error(err);
+  }
+  const abbreviateOptions = {};
+  ABBREVIATE_KEYS.forEach(key => {
+    if (userOptions[key] !== undefined) {
+      abbreviateOptions[key] = userOptions[key];
+    }
+  });
+  return {
+    ...engineDefaults,
+    ...pickNumberFormatOptions(userOptions),
+    ...abbreviateOptions
+  };
 };
-
-// `Intl.NumberFormatOptions` here refers to the global ECMAScript Intl namespace
-// (type space), not the local `Intl` API object declared at the bottom of this
-// file — a `const` introduces only a value binding, so the type reference is safe.
-
 const IntlProvider = ({
   locale,
   messages,
   defaultLocale,
+  options,
   children
 }) => {
   let selectedMessage;
@@ -42,7 +69,8 @@ const IntlProvider = ({
         locale: locale,
         messages: {
           ...selectedMessage
-        }
+        },
+        options: computeAggregatedOptions(locale, options)
       };
       return (0, _elements.createElement)(_Intl.ContextProvider, {
         locale,
@@ -118,76 +146,89 @@ const formatMessage = (id, values, defaultMessage) => {
   }
   return textValue;
 };
-
-// Reduce any BCP 47 tag to its lowercase language subtag, e.g. 'hu-HU' / 'HU' → 'hu'.
-// Used for the exact dictionary-key lookups below (UNITS / DECIMAL_SIGN), which key
-// on the language only — so a Provider locale of 'hu', 'HU', or 'hu-HU' all resolve
-// to the same Hungarian entry. (formatNumber/parseNumber keep the full tag, since the
-// region subtag is meaningful to Intl.NumberFormat — e.g. en-US vs en-GB vs en-IN.)
 const getLanguageSubtag = locale => locale ? locale.toLowerCase().split('-')[0] : undefined;
+const resolveLocale = locale => locale || __messagesContext.locale || undefined;
+const getAggregatedNumberFormatOptions = () => pickNumberFormatOptions(__messagesContext.options || {});
+const getDecimalSeparator = (locale, numberingSystem) => {
+  try {
+    const parts = new globalThis.Intl.NumberFormat(resolveLocale(locale), numberingSystem ? {
+      numberingSystem
+    } : {}).formatToParts(1.1);
+    return parts.find(p => p.type === 'decimal')?.value ?? '.';
+  } catch {
+    return '.';
+  }
+};
 const abbreviateNumber = (value, options = {}) => {
-  const getByLocale = values => values[getLanguageSubtag(__messagesContext.locale) || 'default'] || values['default'];
+  let numericValue;
+  if (typeof value === 'string') {
+    const parsed = parseNumber(value, options.locale ? {
+      locale: options.locale
+    } : {});
+    if (parsed === null) {
+      return value;
+    }
+    numericValue = parsed;
+  } else if (typeof value === 'number' && !isNaN(value)) {
+    numericValue = value;
+  } else {
+    return value;
+  }
+  const merged = {
+    ...(__messagesContext.options || {}),
+    ...options
+  };
+  const decimalPlaces = merged.decimalPlaces ?? 2;
+  const customDecimalSign = merged.decimalSign;
+  const getByLocale = values => values[getLanguageSubtag(options.locale || __messagesContext.locale) || 'default'] || values['default'];
   const UNITS = {
     hu: ['E', 'm', 'M', 'b'],
     default: ['K', 'M', 'B', 'T']
   };
-  const DECIMAL_SIGN = {
-    hu: ',',
-    default: '.'
-  };
-  if (typeof value === 'number' && !isNaN(value)) {
-    const defaultAbbreviateNumberOptions = {
-      units: getByLocale(UNITS),
-      decimalPlaces: 2,
-      decimalSign: getByLocale(DECIMAL_SIGN)
-    };
-    const isNegative = value < 0;
-    const opts = {
-      ...defaultAbbreviateNumberOptions,
-      ...options
-    };
-    const {
-      units,
-      decimalPlaces,
-      decimalSign
-    } = opts;
-    const decPlaces = Math.pow(10, decimalPlaces);
-    let unit = '';
-    let result = Math.abs(value);
-    for (let i = units.length - 1; i >= 0; i--) {
-      const size = Math.pow(10, (i + 1) * 3);
-      if (size <= result) {
-        result = Math.round(result * decPlaces / size) / decPlaces;
-        if (result === 1000 && i < units.length - 1) {
-          result = 1;
-          i++;
-        }
-        unit = units[i];
-        break;
+  const units = merged.units ?? getByLocale(UNITS);
+  const isNegative = numericValue < 0;
+  const decPlaces = Math.pow(10, decimalPlaces);
+  let unit = '';
+  let result = Math.abs(numericValue);
+  for (let i = units.length - 1; i >= 0; i--) {
+    const size = Math.pow(10, (i + 1) * 3);
+    if (size <= result) {
+      result = Math.round(result * decPlaces / size) / decPlaces;
+      if (result === 1000 && i < units.length - 1) {
+        result = 1;
+        i++;
       }
+      unit = units[i];
+      break;
     }
-    let resultStr = `${result}`;
-    if (decimalSign) {
-      resultStr = resultStr.replace('.', decimalSign);
+  }
+  const numberFormatOptions = pickNumberFormatOptions(options);
+  let resultStr = formatNumber(result, {
+    maximumFractionDigits: decimalPlaces,
+    ...numberFormatOptions,
+    locale: options.locale
+  });
+  if (customDecimalSign) {
+    const localeDecimal = getDecimalSeparator(options.locale, numberFormatOptions.numberingSystem ?? __messagesContext.options.numberingSystem);
+    if (localeDecimal && localeDecimal !== customDecimalSign) {
+      resultStr = resultStr.split(localeDecimal).join(customDecimalSign);
     }
-    return `${isNegative ? '-' : ''}${resultStr}${unit}`;
   }
-  return value;
+  return `${isNegative ? '-' : ''}${resultStr}${unit}`;
 };
-
-// The local `Intl` object below shadows the global ECMAScript `Intl`, so number
-// formatting/parsing must reach the real `Intl.NumberFormat` via `globalThis.Intl`.
-const resolveLocale = locale => locale || __messagesContext.locale || undefined;
 const formatNumber = (value, options = {}) => {
   const {
-    locale,
-    ...numberFormatOptions
+    locale
   } = options;
   if (typeof value !== 'number' || isNaN(value)) {
     return String(value);
   }
+  const effective = {
+    ...getAggregatedNumberFormatOptions(),
+    ...pickNumberFormatOptions(options)
+  };
   try {
-    return new globalThis.Intl.NumberFormat(resolveLocale(locale), numberFormatOptions).format(value);
+    return new globalThis.Intl.NumberFormat(resolveLocale(locale), effective).format(value);
   } catch (err) {
     console.error(err);
     return String(value);
@@ -197,29 +238,26 @@ const parseNumber = (text, options = {}) => {
   if (typeof text !== 'string') {
     return null;
   }
+  const numberingSystem = options.numberingSystem ?? __messagesContext.options.numberingSystem;
   try {
-    // Discover the locale's grouping/decimal/minus marks from a known sample,
-    // then normalize the input back into a plain JS-parseable number string.
-    const parts = new globalThis.Intl.NumberFormat(resolveLocale(options.locale)).formatToParts(-12345.6);
+    const parts = new globalThis.Intl.NumberFormat(resolveLocale(options.locale), {
+      ...(numberingSystem ? {
+        numberingSystem
+      } : {}),
+      useGrouping: true
+    }).formatToParts(-12345.6);
     const groupSign = parts.find(p => p.type === 'group')?.value ?? '';
     const decimalSign = parts.find(p => p.type === 'decimal')?.value ?? '.';
     const minusSign = parts.find(p => p.type === 'minusSign')?.value ?? '-';
     let normalized = text.trim();
     const isNegative = normalized.indexOf('-') > -1 || !!minusSign && normalized.indexOf(minusSign) > -1;
-
-    // Drop grouping separators: the explicit locale group sign plus any
-    // whitespace (JS `\s` covers NBSP/NNBSP, which several locales group with).
     if (groupSign) {
       normalized = normalized.split(groupSign).join('');
     }
     normalized = normalized.replace(/\s/g, '');
-
-    // Convert the locale decimal sign to a dot.
     if (decimalSign && decimalSign !== '.') {
       normalized = normalized.split(decimalSign).join('.');
     }
-
-    // Keep only digits and the decimal dot; sign is reapplied from isNegative.
     normalized = normalized.replace(/[^0-9.]/g, '');
     if (normalized === '' || normalized === '.') {
       return null;
@@ -250,7 +288,8 @@ const __testing = exports.__testing = {
     }
     __messagesContext = {
       locale: undefined,
-      messages: {}
+      messages: {},
+      options: {}
     };
   }
 };

package/dist/core/domUtils.js

@@ -51,16 +51,10 @@ const updateDomProperties = (dom, prevProps, nextProps, isSvgElement = false) =>
       }
     } else {
       if (name === 'className' || name === 'htmlFor') {
-        // Both have working IDL aliases (el.className / el.htmlFor).
         el[name] = nextProps[name];
       } else if (name.includes('-') || name === 'role') {
         dom.setAttribute(name, nextProps[name]);
       } else if (dom.nodeType === 1 && /[A-Z]/.test(name)) {
-        // camelCase HTML attribute (inputMode, autoComplete, …): the
-        // DOM name is the lowercased key, except for the hyphenated
-        // cases captured in HTML_ATTRIBUTE_NAME_MAP. Setting these as
-        // IDL properties is unreliable (e.g. el.autoComplete is not a
-        // reflected property), so route them through setAttribute.
         dom.setAttribute(HTML_ATTRIBUTE_NAME_MAP[name] ?? name.toLowerCase(), nextProps[name]);
       } else {
         el[name] = nextProps[name];

package/dist/core/reconciler.js

@@ -160,6 +160,7 @@ const updateClassComponent = wipFiber => {
   instance.state = nextState;
   wipFiber.partialState = undefined;
   delete wipFiber.partialStateCallback;
+  wipFiber.stateNode.__fiber = wipFiber;
   const newChildElements = wipFiber.stateNode.render();
   reconcileChildrenArray(wipFiber, newChildElements);
 };

package/dist/index.d.ts

@@ -101,12 +101,12 @@ declare const Anu: {
         getAllUrlParamNames: () => string[];
     };
     Intl: {
-        abbreviateNumber: (value: number, options?: import(".").AbbreviateNumberOptions) => string | number;
+        abbreviateNumber: (value: number | string | null | undefined, options?: import(".").FormatNumberOptions & import(".").AbbreviateNumberOptions) => string | number | null | undefined;
         formatNumber: (value: number, options?: import(".").FormatNumberOptions) => string;
         parseNumber: (text: string, options?: import(".").ParseNumberOptions) => number | null;
         FormattedMessage: ({ id, values, defaultMessage }: import("./core/components/Intl").FormattedMessageProps) => AnuElement;
         formatMessage: (id: string, values?: Record<string, string | number>, defaultMessage?: string) => string;
-        Provider: ({ locale, messages, defaultLocale, children }: import("./core/components/Intl").IntlProviderProps) => AnuElement | null;
+        Provider: ({ locale, messages, defaultLocale, options, children }: import("./core/components/Intl").IntlProviderProps) => AnuElement | null;
     };
     Connector: {
         connect: <TState = any, TOwnProps extends Record<string, any> = Record<string, any>, TStateProps extends Record<string, any> = Record<string, any>, TDispatchProps extends Record<string, any> = Record<string, any>>(mapStateToProps?: ((state: TState, ownProps: TOwnProps) => TStateProps) | null, mapDispatchToProps?: ((dispatch: any, ownProps: TOwnProps) => TDispatchProps) | null) => (WrappedComponent: import("./core/elements").ComponentConstructor<TStateProps & TDispatchProps & TOwnProps>) => import("./core/elements").ComponentConstructor;

package/dist/testing/queries/byLabelText.js

@@ -15,9 +15,6 @@ const queryAllByLabelText = (container, label) => {
     }
     const forAttr = labelEl.getAttribute('for');
     if (forAttr) {
-      // The `for` attribute is already an element id, so resolve it with
-      // getElementById — no CSS.escape needed (jsdom omits the browser-only
-      // `CSS` global), and it handles any id characters. Scope to container.
       const doc = container.ownerDocument ?? document;
       const input = doc.getElementById(forAttr);
       if (input && container.contains(input)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "anu-verzum",
-  "version": "2.2.3",
+  "version": "2.2.4",
   "description": "A \"React-like\" UI library that supports JSX syntax, Redux-like state management, array-rendering, i18n, routing and many more.",
   "keywords": [
     "anu-verzum",