@cdx-ui/components 0.3.5 → 0.3.7

package/lib/module/components/chart/format.js

@@ -0,0 +1,84 @@
+"use strict";
+
+import { formatNumber } from '@cdx-ui/formatters';
+function namedValue(value) {
+  return value.label.length > 0 ? `${value.label} ${value.formattedValue}` : value.formattedValue;
+}
+function categoryText(category) {
+  return `${category.label} ${category.values.map(namedValue).join(', ')}`;
+}
+export const defaultChartLocaleText = {
+  noData: 'No data',
+  noValue: 'No value',
+  defaultSeriesLabel: 'Value',
+  waterfallIncrease: 'Increase',
+  waterfallDecrease: 'Decrease',
+  trend: ({
+    direction,
+    formattedDelta,
+    comparisonLabel
+  }) => {
+    const from = comparisonLabel.length > 0 ? ` from ${comparisonLabel}` : '';
+    return direction === 'none' ? `no change${from}` : `${direction} ${formattedDelta}${from}`;
+  },
+  barChartSummary: categories => categories.length === 0 ? 'Bar chart. No data.' : `Bar chart. ${categories.map(categoryText).join('; ')}.`,
+  lineChartSummary: latest => latest === null ? 'Line chart. No data.' : `Line chart. ${categoryText(latest)}.`,
+  pieChartSummary: slices => slices.length === 0 ? 'Pie chart. No data.' : `Pie chart. ${slices.map(namedValue).join(', ')}.`
+};
+
+/** Consumer strings over the English defaults. `undefined` entries keep the default. */
+export function resolveChartLocaleText(localeText) {
+  if (localeText === undefined) {
+    return defaultChartLocaleText;
+  }
+  const overrides = Object.entries(localeText).filter(([, value]) => value !== undefined);
+  return {
+    ...defaultChartLocaleText,
+    ...Object.fromEntries(overrides)
+  };
+}
+
+/** Up to two fraction digits, without trailing zeros: `3`, `2.5`, `1,234.56`. */
+export function formatChartNumber(value, locale) {
+  if (value === null || !Number.isFinite(value)) {
+    return '';
+  }
+  const hundredths = Math.round(Math.abs(value) * 100);
+  const decimalPlaces = hundredths % 100 === 0 ? 0 : hundredths % 10 === 0 ? 1 : 2;
+  return formatNumber(value, {
+    locale,
+    decimalPlaces
+  });
+}
+const percentFormatters = new Map();
+
+/** A 0–1 share as a whole percent for `locale`: `0.46` → `46%`. */
+export function formatChartPercent(share, locale) {
+  if (!Number.isFinite(share)) {
+    return '';
+  }
+  // Without a locale, match the `@cdx-ui/formatters` default that numbers use, not the device locale.
+  if (locale === undefined) {
+    return `${formatNumber(Math.round(share * 100), {
+      decimalPlaces: 0
+    })}%`;
+  }
+  let formatter = percentFormatters.get(locale);
+  if (formatter === undefined) {
+    formatter = new Intl.NumberFormat(locale, {
+      style: 'percent',
+      maximumFractionDigits: 0
+    });
+    percentFormatters.set(locale, formatter);
+  }
+  return formatter.format(share);
+}
+export function defaultChartValueFormatter(locale) {
+  return value => formatChartNumber(value, locale);
+}
+
+/** Series formatter, then axis formatter, then the `locale` default. */
+export function resolveValueFormatter(series, axis, locale) {
+  return series?.valueFormatter ?? axis?.valueFormatter ?? defaultChartValueFormatter(locale);
+}
+//# sourceMappingURL=format.js.map

package/lib/module/components/chart/format.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["formatNumber","namedValue","value","label","length","formattedValue","categoryText","category","values","map","join","defaultChartLocaleText","noData","noValue","defaultSeriesLabel","waterfallIncrease","waterfallDecrease","trend","direction","formattedDelta","comparisonLabel","from","barChartSummary","categories","lineChartSummary","latest","pieChartSummary","slices","resolveChartLocaleText","localeText","undefined","overrides","Object","entries","filter","fromEntries","formatChartNumber","locale","Number","isFinite","hundredths","Math","round","abs","decimalPlaces","percentFormatters","Map","formatChartPercent","share","formatter","get","Intl","NumberFormat","style","maximumFractionDigits","set","format","defaultChartValueFormatter","resolveValueFormatter","series","axis","valueFormatter"],"sourceRoot":"../../../../src","sources":["components/chart/format.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/components/chart/hiddenSvgProps.js

@@ -0,0 +1,20 @@
+"use strict";
+
+import { Platform } from 'react-native';
+
+/**
+ * Hides a decorative `Svg` from assistive technology. On web, react-native-svg renders a raw
+ * `<svg>` without react-native-web's prop filtering, so RN-only accessibility props would reach
+ * the DOM as unknown attributes and log React warnings.
+ */
+export const HIDDEN_SVG_PROPS = Platform.select({
+  web: {
+    'aria-hidden': true
+  },
+  default: {
+    accessible: false,
+    accessibilityElementsHidden: true,
+    importantForAccessibility: 'no-hide-descendants'
+  }
+});
+//# sourceMappingURL=hiddenSvgProps.js.map

package/lib/module/components/chart/hiddenSvgProps.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Platform","HIDDEN_SVG_PROPS","select","web","default","accessible","accessibilityElementsHidden","importantForAccessibility"],"sourceRoot":"../../../../src","sources":["components/chart/hiddenSvgProps.ts"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,cAAc;;AAEvC;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,gBAAgB,GAAGD,QAAQ,CAACE,MAAM,CAAC;EAC9CC,GAAG,EAAE;IAAE,aAAa,EAAE;EAAK,CAAC;EAC5BC,OAAO,EAAE;IACPC,UAAU,EAAE,KAAK;IACjBC,2BAA2B,EAAE,IAAI;IACjCC,yBAAyB,EAAE;EAC7B;AACF,CAAU,CAAC","ignoreList":[]}

package/lib/module/components/chart/index.js

@@ -0,0 +1,2 @@
+"use strict";
+//# sourceMappingURL=index.js.map

package/lib/module/components/chart/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../../src","sources":["components/chart/index.ts"],"mappings":"","ignoreList":[]}

package/lib/module/components/chart/motion.js

@@ -0,0 +1,89 @@
+"use strict";
+
+import { useEffect } from 'react';
+import { Easing, useReducedMotion, useSharedValue, withTiming } from 'react-native-reanimated';
+import { useCombinedAnimationDisabledState } from '../../animation';
+export const CHART_MOTION_DURATION = 600;
+const CHART_MOTION_EASING = Easing.out(Easing.cubic);
+/** Off for `'disable-all'`, an ancestor or global `disable-all`, and Reduce Motion. */
+export function useChartMotionEnabled(animation) {
+  const disabled = useCombinedAnimationDisabledState(animation);
+  const reducedMotion = useReducedMotion();
+  return !disabled && !reducedMotion;
+}
+
+/**
+ * Non-finite entries mark gaps: they snap to the target instead of tweening.
+ * Vectors of different lengths cannot be paired, so the target wins outright.
+ */
+export function lerpVector(from, to, t) {
+  'worklet';
+
+  const out = [];
+  const paired = from.length === to.length;
+  for (let index = 0; index < to.length; index += 1) {
+    const end = to[index];
+    const start = paired ? from[index] : end;
+    out.push(Number.isFinite(start) && Number.isFinite(end) ? start + (end - start) * t : end);
+  }
+  return out;
+}
+function parseSignature(signature) {
+  return signature.length === 0 ? [] : signature.split(',').map(Number);
+}
+
+/**
+ * Tweens a numeric geometry vector on the UI thread. Mounts at `initial` and runs to
+ * `target`; later targets start from wherever the previous tween currently is. When the
+ * vector changes length (points or slices added/removed) the entry replays from `initial`.
+ */
+export function useChartMorph(target, initial, enabled) {
+  const from = useSharedValue(enabled ? [...initial] : [...target]);
+  const to = useSharedValue([...target]);
+  const progress = useSharedValue(enabled ? 0 : 1);
+  const signature = target.join(',');
+  const initialSignature = initial.join(',');
+  useEffect(() => {
+    const next = parseSignature(signature);
+    if (!enabled) {
+      from.set(next);
+      to.set(next);
+      progress.set(1);
+      return;
+    }
+    const current = lerpVector(from.get(), to.get(), progress.get());
+    from.set(current.length === next.length ? current : parseSignature(initialSignature));
+    to.set(next);
+    progress.set(0);
+    progress.set(withTiming(1, {
+      duration: CHART_MOTION_DURATION,
+      easing: CHART_MOTION_EASING
+    }));
+  }, [signature, initialSignature, enabled, from, to, progress]);
+  return {
+    from,
+    to,
+    progress
+  };
+}
+
+/**
+ * 0 → 1 on mount and whenever `replayKey` changes. Labels sit on animated geometry, so they
+ * stay hidden until the morph is mostly done, then fade in at the final position.
+ */
+export function useChartEntrance(enabled, replayKey = '') {
+  const progress = useSharedValue(enabled ? 0 : 1);
+  useEffect(() => {
+    if (!enabled) {
+      progress.set(1);
+      return;
+    }
+    progress.set(0);
+    progress.set(withTiming(1, {
+      duration: CHART_MOTION_DURATION,
+      easing: CHART_MOTION_EASING
+    }));
+  }, [enabled, replayKey, progress]);
+  return progress;
+}
+//# sourceMappingURL=motion.js.map

package/lib/module/components/chart/motion.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","Easing","useReducedMotion","useSharedValue","withTiming","useCombinedAnimationDisabledState","CHART_MOTION_DURATION","CHART_MOTION_EASING","out","cubic","useChartMotionEnabled","animation","disabled","reducedMotion","lerpVector","from","to","t","paired","length","index","end","start","push","Number","isFinite","parseSignature","signature","split","map","useChartMorph","target","initial","enabled","progress","join","initialSignature","next","set","current","get","duration","easing","useChartEntrance","replayKey"],"sourceRoot":"../../../../src","sources":["components/chart/motion.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/components/chart/palette.js

@@ -0,0 +1,168 @@
+"use strict";
+
+import { useId } from 'react';
+import { Defs, LinearGradient, Stop } from 'react-native-svg';
+import { useCSSVariable, useResolveClassNames } from 'uniwind';
+
+/** Light-theme chart tokens, used when Uniwind has no CSS context (Jest). */
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const CHART_FALLBACKS = {
+  simple: '#5b91de',
+  simpleSecondary: '#162e49',
+  simpleTertiary: '#3b6399',
+  categorical: ['#155dfc', '#f54900', '#009689', '#e60076', '#9810fa', '#525252'],
+  danger: '#c10007',
+  warning: '#ffb900',
+  success: '#00a63e',
+  info: '#0069a8'
+};
+function toColor(value, fallback) {
+  if (typeof value === 'string' && value.length > 0) {
+    return value;
+  }
+  return fallback;
+}
+export function useChartSimpleColor() {
+  const value = useCSSVariable('--color-chart-simple-primary');
+  return toColor(value, CHART_FALLBACKS.simple);
+}
+
+/**
+ * A Forge color token by name: `simple-*` and `categorical-*` resolve
+ * `--color-chart-<name>`, severity names resolve `--color-surface-<name>-strong`.
+ * Overrides take a name, not a CSS color, so FI themes and dark mode recolor every chart.
+ */
+
+const warnedChartColors = new Set();
+export function resolveChartColor(color, paints) {
+  if (color === undefined) return undefined;
+  const paint = paints[color];
+  if (paint === undefined && __DEV__ && !warnedChartColors.has(color)) {
+    warnedChartColors.add(color);
+    console.warn(`[Chart] Unknown color "${String(color)}". Pass a ChartColor token name, not a CSS ` + 'color; the default series color is used instead.');
+  }
+  return paint;
+}
+export function useChartColorPaints() {
+  const simple = useChartSimpleColor();
+  const secondary = toColor(useCSSVariable('--color-chart-simple-secondary'), CHART_FALLBACKS.simpleSecondary);
+  const tertiary = toColor(useCSSVariable('--color-chart-simple-tertiary'), CHART_FALLBACKS.simpleTertiary);
+  const danger = toColor(useCSSVariable('--color-surface-danger-strong'), CHART_FALLBACKS.danger);
+  const warning = toColor(useCSSVariable('--color-surface-warning-strong'), CHART_FALLBACKS.warning);
+  const success = toColor(useCSSVariable('--color-surface-success-strong'), CHART_FALLBACKS.success);
+  const info = toColor(useCSSVariable('--color-surface-info-strong'), CHART_FALLBACKS.info);
+  const palette = useChartPalette();
+  return {
+    danger,
+    warning,
+    success,
+    info,
+    'simple-primary': simple,
+    'simple-secondary': secondary,
+    'simple-tertiary': tertiary,
+    'categorical-1': palette[0] ?? CHART_FALLBACKS.categorical[0],
+    'categorical-2': palette[1] ?? CHART_FALLBACKS.categorical[1],
+    'categorical-3': palette[2] ?? CHART_FALLBACKS.categorical[2],
+    'categorical-4': palette[3] ?? CHART_FALLBACKS.categorical[3],
+    'categorical-5': palette[4] ?? CHART_FALLBACKS.categorical[4],
+    'categorical-6': palette[5] ?? CHART_FALLBACKS.categorical[5]
+  };
+}
+
+/**
+ * SVG text cannot take `className`, so typography tokens are resolved here.
+ * `useResolveClassNames` converts rem to px with the consumer's rem base; web
+ * may return rem strings, which fall back to the light-theme pixel size.
+ */
+function toPx(value, fallbackPx) {
+  if (typeof value === 'number') {
+    return Number.isFinite(value) ? value : fallbackPx;
+  }
+  if (typeof value !== 'string') return fallbackPx;
+  const trimmed = value.trim();
+  if (!/^-?\d*\.?\d+(px)?$/.test(trimmed)) return fallbackPx;
+  return parseFloat(trimmed);
+}
+export function useChartChrome() {
+  const grid = useCSSVariable('--color-stroke-secondary');
+  const label = useCSSVariable('--color-content-primary');
+  const surface = useCSSVariable('--color-surface-primary');
+  const fontFamily = useCSSVariable('--font-body');
+  const labelText = useResolveClassNames('text-xs');
+  const captionText = useResolveClassNames('text-2xs');
+  return {
+    grid: toColor(grid, '#e9e9e9'),
+    label: toColor(label, '#1b1c1d'),
+    surface: toColor(surface, '#ffffff'),
+    fontFamily: toColor(fontFamily, 'Inter'),
+    labelSize: toPx(labelText.fontSize, 12),
+    captionSize: toPx(captionText.fontSize, 10)
+  };
+}
+
+/**
+ * Resolved `categorical-1`…`6` paints, in slot order. Pie slices and charts past
+ * three series cycle them.
+ */
+export function useChartPalette() {
+  const slot1 = useCSSVariable('--color-chart-categorical-1');
+  const slot2 = useCSSVariable('--color-chart-categorical-2');
+  const slot3 = useCSSVariable('--color-chart-categorical-3');
+  const slot4 = useCSSVariable('--color-chart-categorical-4');
+  const slot5 = useCSSVariable('--color-chart-categorical-5');
+  const slot6 = useCSSVariable('--color-chart-categorical-6');
+  return [toColor(slot1, CHART_FALLBACKS.categorical[0]), toColor(slot2, CHART_FALLBACKS.categorical[1]), toColor(slot3, CHART_FALLBACKS.categorical[2]), toColor(slot4, CHART_FALLBACKS.categorical[3]), toColor(slot5, CHART_FALLBACKS.categorical[4]), toColor(slot6, CHART_FALLBACKS.categorical[5])];
+}
+
+/**
+ * `auto` keeps up to three series in the FI brand family and moves the whole chart to
+ * `categorical-1`…`6` past that, so one chart never mixes the two families.
+ * `categorical` always uses them.
+ */
+
+/**
+ * Bars alternate light, dark, mid so adjacent bars don't read as a ramp. Lines step
+ * primary → tertiary → secondary so a two-line chart pairs neighboring brand steps.
+ */
+const SIMPLE_SERIES = {
+  bar: ['simple-primary', 'simple-secondary', 'simple-tertiary'],
+  line: ['simple-primary', 'simple-tertiary', 'simple-secondary']
+};
+const CATEGORICAL_SERIES = ['categorical-1', 'categorical-2', 'categorical-3', 'categorical-4', 'categorical-5', 'categorical-6'];
+
+/** Default color for a series. A series `color` still wins. */
+export function chartSeriesColor(seriesIndex, seriesCount, palette, kind) {
+  const simple = SIMPLE_SERIES[kind];
+  const ramp = palette === 'auto' && seriesCount <= simple.length ? simple : CATEGORICAL_SERIES;
+  return ramp[seriesIndex % ramp.length] ?? 'simple-primary';
+}
+export function useChartGradientId(prefix) {
+  return `${prefix}-${useId().replace(/[^a-zA-Z0-9_-]/g, '')}`;
+}
+export function chartFillUrl(idPrefix, index) {
+  return `url(#${idPrefix}-${String(index)})`;
+}
+export function ChartLinearFills({
+  idPrefix,
+  colors,
+  x2,
+  y2
+}) {
+  return /*#__PURE__*/_jsx(Defs, {
+    children: colors.map((color, index) => /*#__PURE__*/_jsxs(LinearGradient, {
+      id: `${idPrefix}-${String(index)}`,
+      x1: "0%",
+      y1: "0%",
+      x2: x2,
+      y2: y2,
+      children: [/*#__PURE__*/_jsx(Stop, {
+        offset: "0%",
+        stopColor: color
+      }), /*#__PURE__*/_jsx(Stop, {
+        offset: "100%",
+        stopColor: color
+      })]
+    }, `${idPrefix}-${String(index)}`))
+  });
+}
+//# sourceMappingURL=palette.js.map

package/lib/module/components/chart/palette.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useId","Defs","LinearGradient","Stop","useCSSVariable","useResolveClassNames","jsx","_jsx","jsxs","_jsxs","CHART_FALLBACKS","simple","simpleSecondary","simpleTertiary","categorical","danger","warning","success","info","toColor","value","fallback","length","useChartSimpleColor","warnedChartColors","Set","resolveChartColor","color","paints","undefined","paint","__DEV__","has","add","console","warn","String","useChartColorPaints","secondary","tertiary","palette","useChartPalette","toPx","fallbackPx","Number","isFinite","trimmed","trim","test","parseFloat","useChartChrome","grid","label","surface","fontFamily","labelText","captionText","labelSize","fontSize","captionSize","slot1","slot2","slot3","slot4","slot5","slot6","SIMPLE_SERIES","bar","line","CATEGORICAL_SERIES","chartSeriesColor","seriesIndex","seriesCount","kind","ramp","useChartGradientId","prefix","replace","chartFillUrl","idPrefix","index","ChartLinearFills","colors","x2","y2","children","map","id","x1","y1","offset","stopColor"],"sourceRoot":"../../../../src","sources":["components/chart/palette.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/chart/size.js

@@ -0,0 +1,29 @@
+"use strict";
+
+/** Plot boxes. Heights match the spacing scale (`size-40`…`size-64`). */
+export const CHART_DIMENSIONS = {
+  sm: {
+    width: 256,
+    height: 160
+  },
+  md: {
+    width: 308,
+    height: 192
+  },
+  lg: {
+    width: 360,
+    height: 224
+  },
+  xl: {
+    width: 410,
+    height: 256
+  }
+};
+export function resolveChartBox(size, width, height) {
+  const preset = CHART_DIMENSIONS[size ?? 'lg'];
+  return {
+    width: width ?? preset.width,
+    height: height ?? preset.height
+  };
+}
+//# sourceMappingURL=size.js.map

package/lib/module/components/chart/size.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["CHART_DIMENSIONS","sm","width","height","md","lg","xl","resolveChartBox","size","preset"],"sourceRoot":"../../../../src","sources":["components/chart/size.ts"],"mappings":";;AAEA;AACA,OAAO,MAAMA,gBAAgB,GAAG;EAC9BC,EAAE,EAAE;IAAEC,KAAK,EAAE,GAAG;IAAEC,MAAM,EAAE;EAAI,CAAC;EAC/BC,EAAE,EAAE;IAAEF,KAAK,EAAE,GAAG;IAAEC,MAAM,EAAE;EAAI,CAAC;EAC/BE,EAAE,EAAE;IAAEH,KAAK,EAAE,GAAG;IAAEC,MAAM,EAAE;EAAI,CAAC;EAC/BG,EAAE,EAAE;IAAEJ,KAAK,EAAE,GAAG;IAAEC,MAAM,EAAE;EAAI;AAChC,CAA2F;AAE3F,OAAO,SAASI,eAAeA,CAC7BC,IAA2B,EAC3BN,KAAc,EACdC,MAAe,EACsC;EACrD,MAAMM,MAAM,GAAGT,gBAAgB,CAACQ,IAAI,IAAI,IAAI,CAAC;EAC7C,OAAO;IACLN,KAAK,EAAEA,KAAK,IAAIO,MAAM,CAACP,KAAK;IAC5BC,MAAM,EAAEA,MAAM,IAAIM,MAAM,CAACN;EAC3B,CAAC;AACH","ignoreList":[]}

package/lib/module/components/chart/ticks.js

@@ -0,0 +1,55 @@
+"use strict";
+
+/** Rounds away float drift at the step's precision, so steps below 0.01 stay distinct. */
+function roundToStep(value, step) {
+  const decimals = Math.min(20, Math.max(2, -Math.floor(Math.log10(step)) + 1));
+  const rounded = Number(value.toFixed(decimals));
+  return Object.is(rounded, -0) ? 0 : rounded;
+}
+function niceNumber(span, round) {
+  if (span <= 0 || !Number.isFinite(span)) {
+    return 1;
+  }
+  const exponent = Math.floor(Math.log10(span));
+  const fraction = span / 10 ** exponent;
+  let niceFraction;
+  if (round) {
+    if (fraction < 1.5) {
+      niceFraction = 1;
+    } else if (fraction < 3) {
+      niceFraction = 2;
+    } else if (fraction < 7) {
+      niceFraction = 5;
+    } else {
+      niceFraction = 10;
+    }
+  } else if (fraction <= 1) {
+    niceFraction = 1;
+  } else if (fraction <= 2) {
+    niceFraction = 2;
+  } else if (fraction <= 5) {
+    niceFraction = 5;
+  } else {
+    niceFraction = 10;
+  }
+  return niceFraction * 10 ** exponent;
+}
+
+/** Evenly spaced, readable ticks that cover `min`–`max` in about `count` steps. */
+export function niceTicks(min, max, count) {
+  if (!Number.isFinite(min) || !Number.isFinite(max)) {
+    return [];
+  }
+  const tickCount = Math.max(2, count);
+  const span = niceNumber(max - min, false);
+  const step = niceNumber(span / (tickCount - 1), true);
+  const niceMin = Math.floor(min / step) * step;
+  const niceMax = Math.ceil(max / step) * step;
+  const ticks = [];
+  const last = niceMax + step / 2;
+  for (let value = niceMin; value <= last; value += step) {
+    ticks.push(roundToStep(value, step));
+  }
+  return ticks;
+}
+//# sourceMappingURL=ticks.js.map

package/lib/module/components/chart/ticks.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["roundToStep","value","step","decimals","Math","min","max","floor","log10","rounded","Number","toFixed","Object","is","niceNumber","span","round","isFinite","exponent","fraction","niceFraction","niceTicks","count","tickCount","niceMin","niceMax","ceil","ticks","last","push"],"sourceRoot":"../../../../src","sources":["components/chart/ticks.ts"],"mappings":"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","ignoreList":[]}

package/lib/module/components/chart/types.js

@@ -0,0 +1,4 @@
+"use strict";
+
+export {};
+//# sourceMappingURL=types.js.map

package/lib/module/components/chart/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sourceRoot":"../../../../src","sources":["components/chart/types.ts"],"mappings":"","ignoreList":[]}

package/lib/module/components/chart/useChartHostWidth.js

@@ -0,0 +1,23 @@
+"use strict";
+
+import { useState } from 'react';
+import { composeEventHandlers } from '@cdx-ui/utils';
+
+/** Runs the chart's own handler first, then the consumer's. */
+export function composeChartLayout(own, consumer) {
+  return composeEventHandlers(own, consumer);
+}
+
+/**
+ * Measured width of the chart root (`0` before the first layout) and the `onLayout` to put on
+ * it. The consumer's `onLayout` still fires.
+ */
+export function useChartHostWidth(onLayout) {
+  const [width, setWidth] = useState(0);
+  const handleLayout = composeChartLayout(event => {
+    const next = event.nativeEvent.layout.width;
+    setWidth(prev => prev === next ? prev : next);
+  }, onLayout);
+  return [width, handleLayout];
+}
+//# sourceMappingURL=useChartHostWidth.js.map

package/lib/module/components/chart/useChartHostWidth.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useState","composeEventHandlers","composeChartLayout","own","consumer","useChartHostWidth","onLayout","width","setWidth","handleLayout","event","next","nativeEvent","layout","prev"],"sourceRoot":"../../../../src","sources":["components/chart/useChartHostWidth.ts"],"mappings":";;AAAA,SAASA,QAAQ,QAAQ,OAAO;AAEhC,SAASC,oBAAoB,QAAQ,eAAe;;AAEpD;AACA,OAAO,SAASC,kBAAkBA,CAChCC,GAAuC,EACvCC,QAAiE,EAC7B;EACpC,OAAOH,oBAAoB,CAAoBE,GAAG,EAAEC,QAAQ,CAAC;AAC/D;;AAEA;AACA;AACA;AACA;AACA,OAAO,SAASC,iBAAiBA,CAC/BC,QAAiE,EACV;EACvD,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGR,QAAQ,CAAC,CAAC,CAAC;EACrC,MAAMS,YAAY,GAAGP,kBAAkB,CAAEQ,KAAK,IAAK;IACjD,MAAMC,IAAI,GAAGD,KAAK,CAACE,WAAW,CAACC,MAAM,CAACN,KAAK;IAC3CC,QAAQ,CAAEM,IAAI,IAAMA,IAAI,KAAKH,IAAI,GAAGG,IAAI,GAAGH,IAAK,CAAC;EACnD,CAAC,EAAEL,QAAQ,CAAC;EACZ,OAAO,CAACC,KAAK,EAAEE,YAAY,CAAC;AAC9B","ignoreList":[]}

package/lib/module/components/index.js

@@ -48,6 +48,9 @@ export * from './Accordion';
 export * from './Menu';
 export * from './ProgressBar';
 export * from './ProgressCircle';
+export * from './PieChart';
+export * from './BarChart';
+export * from './LineChart';
 export * from './Skeleton';
 export * from './ProgressSegmented';
 export * from './Radio';
@@ -55,8 +58,10 @@ export * from './ScopedTheme';
 export * from './ScrollShadow';
 export * from './Select';
 export * from './Slider';
+export * from './Stepper';
 export * from './VirtualizedList';
 export * from './Switch';
+export * from './SystemAlert';
 export * from './Tabs';
 export * from './Table';
 export * from './Textarea';
@@ -68,6 +73,7 @@ export { HStack, VStack } from './Stack';
 export * from './Heading';
 export * from './Text';
 export * from './Icon';
+export * from './CountryFlag';
 export * from './IconButton';
 export * from './QuickActionButton';
 //# sourceMappingURL=index.js.map

package/lib/module/components/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["ColorSwatch","HStack","VStack"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,OAAO;AACrB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,aAAa;AAC3B,cAAc,cAAc;AAC5B,cAAc,eAAe;AAC7B,cAAc,eAAe;AAC7B,SAASA,WAAW,QAA6D,eAAe;AAChG,cAAc,qBAAqB;AACnC,cAAc,iBAAiB;AAC/B,cAAc,aAAa;AAC3B,cAAc,YAAY;AAC1B,cAAc,iBAAiB;AAC/B,cAAc,iBAAiB;AAC/B,cAAc,cAAc;AAC5B,cAAc,mBAAmB;AACjC,cAAc,eAAe;AAC7B,cAAc,iBAAiB;AAC/B,cAAc,gBAAgB;AAC9B,cAAc,kBAAkB;AAChC,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,oBAAoB;AAClC,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,cAAc,gBAAgB;AAC9B,cAAc,uBAAuB;AACrC,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,mBAAmB;AACjC,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,aAAa;AAC3B,cAAc,QAAQ;AACtB,cAAc,eAAe;AAC7B,cAAc,kBAAkB;AAChC,cAAc,YAAY;AAC1B,cAAc,qBAAqB;AACnC,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,mBAAmB;AAMjC,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,gBAAgB;AAC9B,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,SAASC,MAAM,EAAEC,MAAM,QAAQ,SAAS;AACxC,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,cAAc;AAC5B,cAAc,qBAAqB","ignoreList":[]}
+{"version":3,"names":["ColorSwatch","HStack","VStack"],"sourceRoot":"../../../src","sources":["components/index.ts"],"mappings":";;AAAA,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,OAAO;AACrB,cAAc,eAAe;AAC7B,cAAc,UAAU;AACxB,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,aAAa;AAC3B,cAAc,cAAc;AAC5B,cAAc,eAAe;AAC7B,cAAc,eAAe;AAC7B,SAASA,WAAW,QAA6D,eAAe;AAChG,cAAc,qBAAqB;AACnC,cAAc,iBAAiB;AAC/B,cAAc,aAAa;AAC3B,cAAc,YAAY;AAC1B,cAAc,iBAAiB;AAC/B,cAAc,iBAAiB;AAC/B,cAAc,cAAc;AAC5B,cAAc,mBAAmB;AACjC,cAAc,eAAe;AAC7B,cAAc,iBAAiB;AAC/B,cAAc,gBAAgB;AAC9B,cAAc,kBAAkB;AAChC,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,SAAS;AACvB,cAAc,QAAQ;AACtB,cAAc,oBAAoB;AAClC,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,cAAc,gBAAgB;AAC9B,cAAc,uBAAuB;AACrC,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,mBAAmB;AACjC,cAAc,QAAQ;AACtB,cAAc,YAAY;AAC1B,cAAc,aAAa;AAC3B,cAAc,QAAQ;AACtB,cAAc,eAAe;AAC7B,cAAc,kBAAkB;AAChC,cAAc,YAAY;AAC1B,cAAc,YAAY;AAC1B,cAAc,aAAa;AAC3B,cAAc,YAAY;AAC1B,cAAc,qBAAqB;AACnC,cAAc,SAAS;AACvB,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,cAAc,UAAU;AACxB,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,mBAAmB;AAMjC,cAAc,UAAU;AACxB,cAAc,eAAe;AAC7B,cAAc,QAAQ;AACtB,cAAc,SAAS;AACvB,cAAc,YAAY;AAC1B,cAAc,QAAQ;AACtB,cAAc,gBAAgB;AAC9B,cAAc,SAAS;AACvB,cAAc,WAAW;AACzB,SAASC,MAAM,EAAEC,MAAM,QAAQ,SAAS;AACxC,cAAc,WAAW;AACzB,cAAc,QAAQ;AACtB,cAAc,QAAQ;AACtB,cAAc,eAAe;AAC7B,cAAc,cAAc;AAC5B,cAAc,qBAAqB","ignoreList":[]}

package/lib/module/figma/Accordion.figma.js

@@ -5,11 +5,11 @@
 // component=Accordion
 import figma from 'figma';
 const instance = figma.selectedInstance;
-const fullBleed = instance.getEnum('disableGutters', {
+const fullBleed = instance.getEnum('fullBleed', {
   true: true,
   false: undefined
 });
-const defaultValue = instance.getEnum('isExpanded', {
+const defaultValue = instance.getEnum('isOpen', {
   true: 'item-1',
   false: undefined
 });

package/lib/module/figma/Accordion.figma.js.map

@@ -1 +1 @@
-{"version":3,"names":["figma","instance","selectedInstance","fullBleed","getEnum","true","false","undefined","defaultValue","isDisabled","showSeparator","getBoolean","showLeadingSlot","defaultValueProp","helpers","react","renderProp","fullBleedProp","disabledProp","showSeparatorProp","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Accordion.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,SAAS,GAAGF,QAAQ,CAACG,OAAO,CAAC,gBAAgB,EAAE;EACnDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,YAAY,GAAGP,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAClDC,IAAI,EAAE,QAAQ;EACdC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAME,UAAU,GAAGR,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMG,aAAa,GAAGT,QAAQ,CAACU,UAAU,CAAC,eAAe,CAAC;AAC1D,MAAMC,eAAe,GAAGX,QAAQ,CAACU,UAAU,CAAC,mBAAmB,CAAC;AAEhE,MAAME,gBAAgB,GAAGb,KAAK,CAACc,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,cAAc,EAAER,YAAY,CAAC;AACrF,MAAMS,aAAa,GAAGjB,KAAK,CAACc,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEb,SAAS,CAAC;AAC5E,MAAMe,YAAY,GAAGlB,KAAK,CAACc,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,UAAU,EAAEP,UAAU,CAAC;AAC3E,MAAMU,iBAAiB,GAAGnB,KAAK,CAACc,OAAO,CAACC,KAAK,CAACC,UAAU,CACtD,eAAe,EACfN,aAAa,GAAGH,SAAS,GAAG,KAC9B,CAAC;AAED,eAAe;EACba,EAAE,EAAE,gBAAgB;EACpBC,OAAO,EAAE,CACP,4DAA4D,EAC5D,yCAAyC,CAC1C;EACDC,OAAO,EAAEtB,KAAK,CAACuB,IAAI;AACrB,sCAAsCV,gBAAgB;AACtD,kCAAkCI,aAAa,GAAGC,YAAY,GAAGC,iBAAiB;AAClF;AACA,QAAQP,eAAe,GAAGZ,KAAK,CAACuB,IAAI,sEAAsE,GAAG,IAAI;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"names":["figma","instance","selectedInstance","fullBleed","getEnum","true","false","undefined","defaultValue","isDisabled","showSeparator","getBoolean","showLeadingSlot","defaultValueProp","helpers","react","renderProp","fullBleedProp","disabledProp","showSeparatorProp","id","imports","example","code"],"sourceRoot":"../../../src","sources":["figma/Accordion.figma.ts"],"mappings":";;AAAA;AACA;AACA;AACA,OAAOA,KAAK,MAAM,OAAO;AAEzB,MAAMC,QAAQ,GAAGD,KAAK,CAACE,gBAAgB;AAEvC,MAAMC,SAAS,GAAGF,QAAQ,CAACG,OAAO,CAAC,WAAW,EAAE;EAC9CC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMC,YAAY,GAAGP,QAAQ,CAACG,OAAO,CAAC,QAAQ,EAAE;EAC9CC,IAAI,EAAE,QAAQ;EACdC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAME,UAAU,GAAGR,QAAQ,CAACG,OAAO,CAAC,YAAY,EAAE;EAChDC,IAAI,EAAE,IAAI;EACVC,KAAK,EAAEC;AACT,CAAC,CAAC;AACF,MAAMG,aAAa,GAAGT,QAAQ,CAACU,UAAU,CAAC,eAAe,CAAC;AAC1D,MAAMC,eAAe,GAAGX,QAAQ,CAACU,UAAU,CAAC,mBAAmB,CAAC;AAEhE,MAAME,gBAAgB,GAAGb,KAAK,CAACc,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,cAAc,EAAER,YAAY,CAAC;AACrF,MAAMS,aAAa,GAAGjB,KAAK,CAACc,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,WAAW,EAAEb,SAAS,CAAC;AAC5E,MAAMe,YAAY,GAAGlB,KAAK,CAACc,OAAO,CAACC,KAAK,CAACC,UAAU,CAAC,UAAU,EAAEP,UAAU,CAAC;AAC3E,MAAMU,iBAAiB,GAAGnB,KAAK,CAACc,OAAO,CAACC,KAAK,CAACC,UAAU,CACtD,eAAe,EACfN,aAAa,GAAGH,SAAS,GAAG,KAC9B,CAAC;AAED,eAAe;EACba,EAAE,EAAE,gBAAgB;EACpBC,OAAO,EAAE,CACP,4DAA4D,EAC5D,yCAAyC,CAC1C;EACDC,OAAO,EAAEtB,KAAK,CAACuB,IAAI;AACrB,sCAAsCV,gBAAgB;AACtD,kCAAkCI,aAAa,GAAGC,YAAY,GAAGC,iBAAiB;AAClF;AACA,QAAQP,eAAe,GAAGZ,KAAK,CAACuB,IAAI,sEAAsE,GAAG,IAAI;AACjH;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/module/figma/Alert.figma.js

@@ -11,11 +11,11 @@ const severity = instance.getEnum('severity', {
   success: 'success',
   info: 'info'
 });
-const showHeadline = instance.getBoolean('Show Headline?');
-const headlineInstance = instance.findInstance('Alert.Headline');
-const headlineSnippet = showHeadline && headlineInstance?.type === 'INSTANCE' ? headlineInstance.executeTemplate().example : null;
-const messageInstance = instance.findInstance('Alert.Message');
-const messageSnippet = messageInstance?.type === 'INSTANCE' ? messageInstance.executeTemplate().example : null;
+const showTitle = instance.getBoolean('Show Title?');
+const titleInstance = instance.findInstance('Alert.Title');
+const titleSnippet = showTitle && titleInstance?.type === 'INSTANCE' ? titleInstance.executeTemplate().example : null;
+const descriptionInstance = instance.findInstance('Alert.Description');
+const descriptionSnippet = descriptionInstance?.type === 'INSTANCE' ? descriptionInstance.executeTemplate().example : null;
 const showTrailingSlot = instance.getBoolean('Show TrailingSlot?');
 const trailingSlot = instance.getSlot('Alert.TrailingSlot');
 const trailingChildren = showTrailingSlot && trailingSlot ? figma.helpers.react.renderChildren(trailingSlot) : null;
@@ -25,8 +25,8 @@ export default {
   example: figma.code`
 <Alert severity="${severity}">
   <Alert.Icon />
-  ${headlineSnippet}
-  ${messageSnippet}
+  ${titleSnippet}
+  ${descriptionSnippet}
   ${trailingChildren ? figma.code`
   <Alert.Actions>
     ${trailingChildren}