@oxy.so/bloom 6.3.0 → 7.0.0

package/src/sidebar/types.ts

@@ -1,6 +1,6 @@
-import type { ReactNode } from 'react';
+import type { ReactNode, Ref } from 'react';
 import type { BloomIconComponent } from '../icons/icon-component';
-import type { StyleProp, ViewStyle, ScrollViewProps } from 'react-native';
+import type { StyleProp, ViewStyle, ScrollViewProps, GestureResponderEvent, View } from 'react-native';
 
 /** A Remix-style icon: `width` / `height` / `fill`. */
 /** @deprecated Use `BloomIconComponent` from `@oxy.so/bloom/icons`; this is an alias of it. */
@@ -21,6 +21,8 @@ export interface SidebarAvatar {
 
 /** A navigation row. Rows without `href` / `onPress` are decoration only. */
 export interface SidebarNavItem {
+  className?: string;
+  style?: StyleProp<ViewStyle>;
   key: string;
   label: string;
   icon: SidebarIcon;
@@ -62,8 +64,24 @@ export interface SidebarModeSwitcherProps {
 }
 
 export interface SidebarItemProps {
-  icon: SidebarIcon;
+  icon?: SidebarIcon;
+  /** An avatar or other visual in place of the icon. Kept visible while collapsed. */
+  leading?: ReactNode;
   label: string;
+  /** Secondary information under the label. Hidden with the label on collapse. */
+  description?: string;
+  /** Accent selection is the default; neutral uses the sidebar's tertiary surface. */
+  selectedAppearance?: 'accent' | 'neutral';
+  className?: string;
+  labelClassName?: string;
+  descriptionClassName?: string;
+  ref?: Ref<View>;
+  disabled?: boolean;
+  nativeID?: string;
+  accessibilityLabel?: string;
+  'aria-expanded'?: boolean;
+  'aria-haspopup'?: 'menu' | 'dialog' | 'listbox' | 'tree' | 'grid';
+  'aria-describedby'?: string;
   /**
    * The row's size. Inside a `Sidebar` it is inherited from the panel — pass
    * it only for a row standing on its own.
@@ -81,9 +99,25 @@ export interface SidebarItemProps {
   selected?: boolean;
   /** Icon-only square matching the sidebar size (40px for md). */
   collapsed?: boolean;
-  onPress?: () => void;
+  onPress?: (event: GestureResponderEvent) => void;
   /** Secondary touch action. Also expose it through a keyboard-accessible menu. */
-  onLongPress?: () => void;
+  onLongPress?: (event: GestureResponderEvent) => void;
+  style?: StyleProp<ViewStyle>;
+  testID?: string;
+}
+
+/** A fixed header row whose search expands across the adjacent action slots. */
+export interface SidebarToolbarProps {
+  actions?: ReadonlyArray<ReactNode>;
+  search: {
+    value: string;
+    onValueChange: (value: string) => void;
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    accessibilityLabel?: string;
+    placeholder?: string;
+    closeLabel?: string;
+  };
   style?: StyleProp<ViewStyle>;
   testID?: string;
 }
@@ -151,6 +185,8 @@ export interface SidebarMenuItem {
 }
 
 export interface SidebarMenuGroup {
+  /** Optional controls below the group rows (for example, appearance settings). */
+  content?: ReactNode;
   id: string;
   /** Section label above the rows ("Company"). */
   label?: string;
@@ -243,6 +279,11 @@ export interface SidebarUserMenuProps {
 }
 
 export interface SidebarProps {
+  className?: string;
+  /** Replaces the account/logo header. The panel still owns its fixed chrome and scroll area. */
+  header?: ReactNode | ((state: { collapsed: boolean }) => ReactNode);
+  /** Expanded panel inset, also used to measure app-owned scroll content. Defaults to the size's inset. */
+  contentPadding?: number;
   /** Center the main navigation group in space above the persistent footer. */
   contentAlignment?: 'start' | 'center';
   /** App-owned destination content after the built-in rows/tree, inside the same

package/src/social-button/SocialButtonBase.tsx

@@ -23,7 +23,7 @@ export function socialButtonLabel(brandLabel: string, action: SocialButtonAction
 }
 
 /** A provider's real multi-colour mark. */
-function ColorLogo({
+export function ColorLogo({
   logo,
   size,
   inverted,

package/src/textarea/Textarea.tsx

@@ -1,6 +1,6 @@
 import { useBloomAppearance } from '../appearance';
 import React, { useRef, useState } from 'react';
-import { Platform, StyleSheet, TextInput, type TextStyle, View } from 'react-native';
+import { Platform, StyleSheet, TextInput, type TextStyle, type TextInputProps, View } from 'react-native';
 
 import { useTheme } from '../theme/use-theme';
 import { useInteractionState } from '../hooks/use-interaction-state';
@@ -23,6 +23,9 @@ import {
 
 import { useFieldMembership } from '../field/membership';
 import type { TextareaProps } from './types';
+import { styled } from 'react-native-css';
+import { StyledView } from '../styles/styled-primitives';
+const StyledTextInput: React.ComponentType<TextInputProps & {ref?: React.Ref<TextInput>}> = styled(TextInput, {className: 'style'});
 
 const IS_WEB = Platform.OS === 'web';
 
@@ -70,6 +73,10 @@ export function Textarea({
   tooltip = false,
   style,
   inputStyle,
+  className,
+  fieldClassName,
+  inputClassName,
+  fieldStyle,
   inputRef,
   accessibilityLabel,
   nativeID,
@@ -116,6 +123,7 @@ export function Textarea({
   const controlStyle = StyleSheet.flatten([
     {
       fontFamily: SANS_FONT_FAMILY,
+      ...(inputClassName ? {} : {
       fontSize: TEXT_FIELD_TEXT.fontSize,
       lineHeight: line,
       fontWeight: TEXT_FIELD_TEXT.fontWeight,
@@ -124,6 +132,7 @@ export function Textarea({
       paddingRight: TEXT_FIELD_INPUT_INSET,
       paddingTop: 0,
       paddingBottom: 0,
+      }),
       margin: 0,
       minWidth: 0,
       width: '100%',
@@ -148,16 +157,17 @@ export function Textarea({
   ]) as TextStyle;
 
   return (
-    <View style={[{ width: '100%' }, style]} testID={testID}>
+    <StyledView className={className} style={[{ width: '100%' }, style]} testID={testID}>
       {label ? (
         <TextFieldLabel required={field.required} tooltip={tooltip}>
           {label}
         </TextFieldLabel>
       ) : null}
 
-      <View
+      <StyledView
+        className={fieldClassName}
         style={[
-          {
+          fieldClassName ? null : {
             borderRadius: TEXT_FIELD_RADIUS,
             borderWidth: TEXT_FIELD_RING_WIDTH,
             paddingHorizontal: TEXT_FIELD_GEOMETRY[size].paddingHorizontal - TEXT_FIELD_RING_WIDTH,
@@ -165,6 +175,7 @@ export function Textarea({
             ...paint,
           },
           TEXT_FIELD_WEB_TRANSITION,
+          fieldStyle,
         ]}
         {...(IS_WEB
           ? ({
@@ -175,7 +186,8 @@ export function Textarea({
               onMouseLeave: onHoverOut,
             } as Record<string, unknown>)
           : {})}>
-        <TextInput
+        <StyledTextInput
+          className={inputClassName}
           {...rest}
           {...(IS_WEB && field.disabled ? ({ disabled: true } as Record<string, unknown>) : {})}
           ref={mergeRefs([innerRef, inputRef])}
@@ -207,10 +219,10 @@ export function Textarea({
           }}
           style={controlStyle}
         />
-      </View>
+      </StyledView>
 
       {hint || showCount ? (
-        <View
+        <StyledView
           style={{
             flexDirection: 'row',
             alignItems: 'flex-start',
@@ -236,8 +248,8 @@ export function Textarea({
               {maxLength ? `${count}/${maxLength}` : String(count)}
             </Text>
           ) : null}
-        </View>
+        </StyledView>
       ) : null}
-    </View>
+    </StyledView>
   );
 }

package/src/textarea/types.ts

@@ -1,4 +1,4 @@
-import type { TextInput, TextInputProps } from 'react-native';
+import type { TextInput, TextInputProps, StyleProp, ViewStyle } from 'react-native';
 
 import type { ViewStyleProp, TextStyleProp } from '../styles';
 import type { TextFieldSize } from '../text-field';
@@ -46,5 +46,10 @@ export type TextareaProps = Omit<
     tooltip?: boolean;
     /** Style for the `TextInput` itself (the outer `style` is the whole field). */
     inputStyle?: TextStyleProp['style'];
+    /** Opt-in recipes for borderless/autogrowing composed fields. */
+    className?: string;
+    fieldClassName?: string;
+    inputClassName?: string;
+    fieldStyle?: StyleProp<ViewStyle>;
     inputRef?: React.RefObject<TextInput | null> | React.ForwardedRef<TextInput>;
   };

package/src/theme/color-scope/seed-scope.ts

@@ -1,3 +1,4 @@
+import { COMPONENT_COLOR_ROLES } from '../../design-tokens/component-roles';
 import { generateRoleColors, type RoleColors, type SchemeVariant } from '../color-engine';
 import { buildPolicyTokens, isColourlessSeed } from '../color-policy';
 import { ACCENT_TEXT_ROLES, BORDER_ROLES, FILL_ROLES, TEXT_ROLES } from '../../design-tokens/color-roles';
@@ -17,6 +18,7 @@ import { ACCENT_TEXT_ROLES, BORDER_ROLES, FILL_ROLES, TEXT_ROLES } from '../../d
  * is unaffected and deliberately absent.
  */
 const SCOPED_ALIASES: Readonly<Record<string, string>> = {
+  ...COMPONENT_COLOR_ROLES,
   ...FILL_ROLES,
   ...TEXT_ROLES,
   ...ACCENT_TEXT_ROLES,

package/docs/dot-grid-meter.mdx

@@ -1,66 +0,0 @@
----
-title: DotGridMeter
-description: How many out of a total, when the total is small enough to count.
-order: 64
----
-
-# DotGridMeter
-
-A grid of dots, some filled. It answers *how many out of how many* for a total
-the eye can actually count.
-
-```tsx
-import { DotGridMeter } from '@oxy.so/bloom/dot-grid-meter';
-
-<DotGridMeter filled={34} total={50} columns={10} accessibilityLabel="Tokens used" />
-```
-
-## Which prop decides what
-
-| prop                       | decides                                       |
-| -------------------------- | ---------------------------------------------- |
-| `filled` / `total`          | the count and the ceiling                      |
-| `columns`                   | the grid width, which sets the row count        |
-| `dotSize` / `gap`           | the geometry                                   |
-| `filledColor` / `emptyColor`| the two states                                 |
-| `accessibilityLabel`        | what is being counted — see below              |
-
-## Use it when the total is countable
-
-Thirty-four of fifty tokens, seven of ten onboarding steps, twelve of twenty
-invites. The point is that a reader can verify the number by looking — that is
-what a dot grid gives you over a bar.
-
-Over a few hundred it stops being countable and becomes a texture. Past that a
-[`StatBar`](/docs/bloom/main/stat-bar) is the honest widget: it does not
-pretend the reader can count.
-
-## `columns` decides the shape
-
-Pick a value that makes the rows read as groups — 10 across for a total of 50
-gives five clean rows of ten, which is countable at a glance. An awkward number
-leaves a ragged last row and makes the total harder to read, not easier.
-
-## Both colours matter
-
-The empty dots carry the *total*, so they must be visible. An `emptyColor` too
-close to the background turns the widget into "34 dots" with no denominator,
-which is the one thing it exists to show.
-
-## State the numbers as well
-
-`34 / 50` in text beside the grid. The dots are the shape of the answer; the
-text is the answer.
-
-## Name what is being counted
-
-The grid announces itself as a `progressbar` carrying `aria-valuenow` /
-`aria-valuemin` / `aria-valuemax`, so a screen reader reads the numbers — but
-`progressbar` takes its name from the author alone. ARIA never computes one
-from an element's contents for this role, and the contents are dots in any
-case, so without `accessibilityLabel` the meter announces "34 of 50" against
-nothing. `StatBar` gets this for free from its required `label`; a bare grid has
-no such text.
-
-Omitting it warns once in development, dev-only and never throwing. An empty or
-whitespace-only string counts as missing.

package/lib/commonjs/dot-grid-meter/DotGridMeter.js

@@ -1,80 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.DotGridMeter = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactNative = require("react-native");
-var _useTheme = require("../theme/use-theme.js");
-var _useAccessibleNameWarning = require("../hooks/use-accessible-name-warning.js");
-var _jsxRuntime = require("react/jsx-runtime");
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-/**
- * A data-driven grid of small circular dots — the "diversity meter" visual. The
- * first `filled` dots use `filledColor`, the rest use `emptyColor`, laid out in
- * a flex-wrapped grid of `columns` per row. Pure `<View>` composition (no SVG),
- * so it renders identically on web and native.
- */
-const DotGridMeterComponent = ({
-  filled,
-  total,
-  columns = 10,
-  dotSize = 10,
-  gap = 6,
-  filledColor,
-  emptyColor,
-  accessibilityLabel,
-  style,
-  testID
-}) => {
-  const {
-    colors
-  } = (0, _useTheme.useTheme)();
-  (0, _useAccessibleNameWarning.useAccessibleNameWarning)('DotGridMeter', accessibilityLabel);
-  const onColor = filledColor ?? colors.success;
-  const offColor = emptyColor ?? colors.backgroundSecondary;
-  const safeTotal = Math.max(0, Math.floor(total));
-  const safeFilled = Math.min(safeTotal, Math.max(0, Math.floor(filled)));
-  // A row can hold at most `columns` dots; a grid narrower than one full row
-  // should still wrap tightly, so the container width follows the smaller count.
-  const perRow = Math.max(1, Math.floor(columns));
-  const rowWidth = Math.min(safeTotal, perRow);
-  const dots = (0, _react.useMemo)(() => Array.from({
-    length: safeTotal
-  }, (_, index) => index < safeFilled), [safeTotal, safeFilled]);
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-    style: [{
-      flexDirection: 'row',
-      flexWrap: 'wrap',
-      gap,
-      width: rowWidth * dotSize + Math.max(0, rowWidth - 1) * gap
-    }, style],
-    accessibilityRole: "progressbar"
-    // The FLAT `aria-value*` props: react-native-web drops the
-    // `accessibilityValue` object entirely, so the meter announced a
-    // progressbar carrying no value. React Native folds these back into
-    // `accessibilityValue`, so native is unchanged.
-    ,
-    "aria-valuemin": 0,
-    "aria-valuemax": safeTotal,
-    "aria-valuenow": safeFilled
-    // The NAME, which the value props above do not supply: `progressbar`
-    // takes its name from the author alone, so an unnamed one announces a
-    // number against nothing.
-    ,
-    accessibilityLabel: accessibilityLabel,
-    testID: testID,
-    children: dots.map((isFilled, index) => /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
-      style: {
-        width: dotSize,
-        height: dotSize,
-        borderRadius: dotSize / 2,
-        backgroundColor: isFilled ? onColor : offColor
-      }
-    }, index))
-  });
-};
-const DotGridMeter = exports.DotGridMeter = /*#__PURE__*/(0, _react.memo)(DotGridMeterComponent);
-DotGridMeter.displayName = 'DotGridMeter';
-//# sourceMappingURL=DotGridMeter.js.map

package/lib/commonjs/dot-grid-meter/DotGridMeter.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_react","_interopRequireWildcard","require","_reactNative","_useTheme","_useAccessibleNameWarning","_jsxRuntime","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DotGridMeterComponent","filled","total","columns","dotSize","gap","filledColor","emptyColor","accessibilityLabel","style","testID","colors","useTheme","useAccessibleNameWarning","onColor","success","offColor","backgroundSecondary","safeTotal","Math","max","floor","safeFilled","min","perRow","rowWidth","dots","useMemo","Array","from","length","_","index","jsx","View","flexDirection","flexWrap","width","accessibilityRole","children","map","isFilled","height","borderRadius","backgroundColor","DotGridMeter","exports","memo","displayName"],"sourceRoot":"../../../src","sources":["dot-grid-meter/DotGridMeter.tsx"],"mappings":"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","ignoreList":[]}

package/lib/commonjs/dot-grid-meter/index.js

@@ -1,13 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "DotGridMeter", {
-  enumerable: true,
-  get: function () {
-    return _DotGridMeter.DotGridMeter;
-  }
-});
-var _DotGridMeter = require("./DotGridMeter.js");
-//# sourceMappingURL=index.js.map

package/lib/commonjs/dot-grid-meter/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["_DotGridMeter","require"],"sourceRoot":"../../../src","sources":["dot-grid-meter/index.ts"],"mappings":";;;;;;;;;;;AAAA,IAAAA,aAAA,GAAAC,OAAA","ignoreList":[]}

package/lib/module/dot-grid-meter/DotGridMeter.js

@@ -1,75 +0,0 @@
-"use strict";
-
-import React, { memo, useMemo } from 'react';
-import { View } from 'react-native';
-import { useTheme } from "../theme/use-theme.js";
-import { useAccessibleNameWarning } from "../hooks/use-accessible-name-warning.js";
-import { jsx as _jsx } from "react/jsx-runtime";
-/**
- * A data-driven grid of small circular dots — the "diversity meter" visual. The
- * first `filled` dots use `filledColor`, the rest use `emptyColor`, laid out in
- * a flex-wrapped grid of `columns` per row. Pure `<View>` composition (no SVG),
- * so it renders identically on web and native.
- */
-const DotGridMeterComponent = ({
-  filled,
-  total,
-  columns = 10,
-  dotSize = 10,
-  gap = 6,
-  filledColor,
-  emptyColor,
-  accessibilityLabel,
-  style,
-  testID
-}) => {
-  const {
-    colors
-  } = useTheme();
-  useAccessibleNameWarning('DotGridMeter', accessibilityLabel);
-  const onColor = filledColor ?? colors.success;
-  const offColor = emptyColor ?? colors.backgroundSecondary;
-  const safeTotal = Math.max(0, Math.floor(total));
-  const safeFilled = Math.min(safeTotal, Math.max(0, Math.floor(filled)));
-  // A row can hold at most `columns` dots; a grid narrower than one full row
-  // should still wrap tightly, so the container width follows the smaller count.
-  const perRow = Math.max(1, Math.floor(columns));
-  const rowWidth = Math.min(safeTotal, perRow);
-  const dots = useMemo(() => Array.from({
-    length: safeTotal
-  }, (_, index) => index < safeFilled), [safeTotal, safeFilled]);
-  return /*#__PURE__*/_jsx(View, {
-    style: [{
-      flexDirection: 'row',
-      flexWrap: 'wrap',
-      gap,
-      width: rowWidth * dotSize + Math.max(0, rowWidth - 1) * gap
-    }, style],
-    accessibilityRole: "progressbar"
-    // The FLAT `aria-value*` props: react-native-web drops the
-    // `accessibilityValue` object entirely, so the meter announced a
-    // progressbar carrying no value. React Native folds these back into
-    // `accessibilityValue`, so native is unchanged.
-    ,
-    "aria-valuemin": 0,
-    "aria-valuemax": safeTotal,
-    "aria-valuenow": safeFilled
-    // The NAME, which the value props above do not supply: `progressbar`
-    // takes its name from the author alone, so an unnamed one announces a
-    // number against nothing.
-    ,
-    accessibilityLabel: accessibilityLabel,
-    testID: testID,
-    children: dots.map((isFilled, index) => /*#__PURE__*/_jsx(View, {
-      style: {
-        width: dotSize,
-        height: dotSize,
-        borderRadius: dotSize / 2,
-        backgroundColor: isFilled ? onColor : offColor
-      }
-    }, index))
-  });
-};
-export const DotGridMeter = /*#__PURE__*/memo(DotGridMeterComponent);
-DotGridMeter.displayName = 'DotGridMeter';
-//# sourceMappingURL=DotGridMeter.js.map

package/lib/module/dot-grid-meter/DotGridMeter.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["React","memo","useMemo","View","useTheme","useAccessibleNameWarning","jsx","_jsx","DotGridMeterComponent","filled","total","columns","dotSize","gap","filledColor","emptyColor","accessibilityLabel","style","testID","colors","onColor","success","offColor","backgroundSecondary","safeTotal","Math","max","floor","safeFilled","min","perRow","rowWidth","dots","Array","from","length","_","index","flexDirection","flexWrap","width","accessibilityRole","children","map","isFilled","height","borderRadius","backgroundColor","DotGridMeter","displayName"],"sourceRoot":"../../../src","sources":["dot-grid-meter/DotGridMeter.tsx"],"mappings":";;AAAA,OAAOA,KAAK,IAAIC,IAAI,EAAEC,OAAO,QAAQ,OAAO;AAC5C,SAASC,IAAI,QAAQ,cAAc;AAEnC,SAASC,QAAQ,QAAQ,uBAAoB;AAC7C,SAASC,wBAAwB,QAAQ,yCAAsC;AAAC,SAAAC,GAAA,IAAAC,IAAA;AAGhF;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,qBAAkD,GAAGA,CAAC;EAC1DC,MAAM;EACNC,KAAK;EACLC,OAAO,GAAG,EAAE;EACZC,OAAO,GAAG,EAAE;EACZC,GAAG,GAAG,CAAC;EACPC,WAAW;EACXC,UAAU;EACVC,kBAAkB;EAClBC,KAAK;EACLC;AACF,CAAC,KAAK;EACJ,MAAM;IAAEC;EAAO,CAAC,GAAGf,QAAQ,CAAC,CAAC;EAC7BC,wBAAwB,CAAC,cAAc,EAAEW,kBAAkB,CAAC;EAC5D,MAAMI,OAAO,GAAGN,WAAW,IAAIK,MAAM,CAACE,OAAO;EAC7C,MAAMC,QAAQ,GAAGP,UAAU,IAAII,MAAM,CAACI,mBAAmB;EAEzD,MAAMC,SAAS,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,KAAK,CAACjB,KAAK,CAAC,CAAC;EAChD,MAAMkB,UAAU,GAAGH,IAAI,CAACI,GAAG,CAACL,SAAS,EAAEC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,KAAK,CAAClB,MAAM,CAAC,CAAC,CAAC;EACvE;EACA;EACA,MAAMqB,MAAM,GAAGL,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,KAAK,CAAChB,OAAO,CAAC,CAAC;EAC/C,MAAMoB,QAAQ,GAAGN,IAAI,CAACI,GAAG,CAACL,SAAS,EAAEM,MAAM,CAAC;EAE5C,MAAME,IAAI,GAAG9B,OAAO,CAClB,MAAM+B,KAAK,CAACC,IAAI,CAAC;IAAEC,MAAM,EAAEX;EAAU,CAAC,EAAE,CAACY,CAAC,EAAEC,KAAK,KAAKA,KAAK,GAAGT,UAAU,CAAC,EACzE,CAACJ,SAAS,EAAEI,UAAU,CACxB,CAAC;EAED,oBACErB,IAAA,CAACJ,IAAI;IACHc,KAAK,EAAE,CACL;MACEqB,aAAa,EAAE,KAAK;MACpBC,QAAQ,EAAE,MAAM;MAChB1B,GAAG;MACH2B,KAAK,EAAET,QAAQ,GAAGnB,OAAO,GAAGa,IAAI,CAACC,GAAG,CAAC,CAAC,EAAEK,QAAQ,GAAG,CAAC,CAAC,GAAGlB;IAC1D,CAAC,EACDI,KAAK,CACL;IACFwB,iBAAiB,EAAC;IAClB;IACA;IACA;IACA;IAAA;IACA,iBAAe,CAAE;IACjB,iBAAejB,SAAU;IACzB,iBAAeI;IACf;IACA;IACA;IAAA;IACAZ,kBAAkB,EAAEA,kBAAmB;IACvCE,MAAM,EAAEA,MAAO;IAAAwB,QAAA,EAEdV,IAAI,CAACW,GAAG,CAAC,CAACC,QAAQ,EAAEP,KAAK,kBACxB9B,IAAA,CAACJ,IAAI;MAEHc,KAAK,EAAE;QACLuB,KAAK,EAAE5B,OAAO;QACdiC,MAAM,EAAEjC,OAAO;QACfkC,YAAY,EAAElC,OAAO,GAAG,CAAC;QACzBmC,eAAe,EAAEH,QAAQ,GAAGxB,OAAO,GAAGE;MACxC;IAAE,GANGe,KAON,CACF;EAAC,CACE,CAAC;AAEX,CAAC;AAED,OAAO,MAAMW,YAAY,gBAAG/C,IAAI,CAACO,qBAAqB,CAAC;AACvDwC,YAAY,CAACC,WAAW,GAAG,cAAc","ignoreList":[]}

package/lib/module/dot-grid-meter/index.js

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

package/lib/module/dot-grid-meter/index.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["DotGridMeter"],"sourceRoot":"../../../src","sources":["dot-grid-meter/index.ts"],"mappings":";;AAAA,SAASA,YAAY,QAAQ,mBAAgB","ignoreList":[]}

package/lib/typescript/commonjs/dot-grid-meter/DotGridMeter.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { DotGridMeterProps } from './types';
-export declare const DotGridMeter: React.NamedExoticComponent<DotGridMeterProps>;
-//# sourceMappingURL=DotGridMeter.d.ts.map

package/lib/typescript/commonjs/dot-grid-meter/DotGridMeter.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DotGridMeter.d.ts","sourceRoot":"","sources":["../../../../src/dot-grid-meter/DotGridMeter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAK7C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AA6EjD,eAAO,MAAM,YAAY,+CAA8B,CAAC"}

package/lib/typescript/commonjs/dot-grid-meter/index.d.ts

@@ -1,3 +0,0 @@
-export { DotGridMeter } from './DotGridMeter';
-export type { DotGridMeterProps } from './types';
-//# sourceMappingURL=index.d.ts.map

package/lib/typescript/commonjs/dot-grid-meter/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/dot-grid-meter/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC"}

package/lib/typescript/commonjs/dot-grid-meter/types.d.ts

@@ -1,48 +0,0 @@
-import type { StyleProp, ViewStyle } from 'react-native';
-export interface DotGridMeterProps {
-    /** Number of filled dots (clamped to `[0, total]`). */
-    filled: number;
-    /** Total number of dots in the grid. */
-    total: number;
-    /**
-     * Dots per row before wrapping.
-     * @default 10
-     */
-    columns?: number;
-    /**
-     * Diameter of each dot in px.
-     * @default 10
-     */
-    dotSize?: number;
-    /**
-     * Gap between dots in px (both axes).
-     * @default 6
-     */
-    gap?: number;
-    /**
-     * Color of a filled dot.
-     * @default theme.colors.success
-     */
-    filledColor?: string;
-    /**
-     * Color of an empty dot.
-     * @default theme.colors.backgroundSecondary
-     */
-    emptyColor?: string;
-    /**
-     * The meter's accessible NAME — what is being measured.
-     *
-     * `progressbar` takes its name from the author only: ARIA never computes one
-     * from an element's contents for this role, and the contents here are dots
-     * anyway. Without it the meter announces "13 of 30" against nothing.
-     * `StatBar` gets this from its required `label`; a bare grid of dots has no
-     * such text, so it has to be stated.
-     *
-     * Omitting it warns once in development; see `use-accessible-name-warning`.
-     */
-    accessibilityLabel?: string;
-    /** Container style override. */
-    style?: StyleProp<ViewStyle>;
-    testID?: string;
-}
-//# sourceMappingURL=types.d.ts.map

package/lib/typescript/commonjs/dot-grid-meter/types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/dot-grid-meter/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,MAAM,WAAW,iBAAiB;IAChC,uDAAuD;IACvD,MAAM,EAAE,MAAM,CAAC;IACf,wCAAwC;IACxC,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;;;;;;;OAUG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,gCAAgC;IAChC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}

package/lib/typescript/module/dot-grid-meter/DotGridMeter.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { DotGridMeterProps } from './types';
-export declare const DotGridMeter: React.NamedExoticComponent<DotGridMeterProps>;
-//# sourceMappingURL=DotGridMeter.d.ts.map

package/lib/typescript/module/dot-grid-meter/DotGridMeter.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"DotGridMeter.d.ts","sourceRoot":"","sources":["../../../../src/dot-grid-meter/DotGridMeter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAwB,MAAM,OAAO,CAAC;AAK7C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AA6EjD,eAAO,MAAM,YAAY,+CAA8B,CAAC"}

package/lib/typescript/module/dot-grid-meter/index.d.ts

@@ -1,3 +0,0 @@
-export { DotGridMeter } from './DotGridMeter';
-export type { DotGridMeterProps } from './types';
-//# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/dot-grid-meter/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/dot-grid-meter/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,YAAY,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC"}

package/lib/typescript/module/dot-grid-meter/types.d.ts

@@ -1,48 +0,0 @@
-import type { StyleProp, ViewStyle } from 'react-native';
-export interface DotGridMeterProps {
-    /** Number of filled dots (clamped to `[0, total]`). */
-    filled: number;
-    /** Total number of dots in the grid. */
-    total: number;
-    /**
-     * Dots per row before wrapping.
-     * @default 10
-     */
-    columns?: number;
-    /**
-     * Diameter of each dot in px.
-     * @default 10
-     */
-    dotSize?: number;
-    /**
-     * Gap between dots in px (both axes).
-     * @default 6
-     */
-    gap?: number;
-    /**
-     * Color of a filled dot.
-     * @default theme.colors.success
-     */
-    filledColor?: string;
-    /**
-     * Color of an empty dot.
-     * @default theme.colors.backgroundSecondary
-     */
-    emptyColor?: string;
-    /**
-     * The meter's accessible NAME — what is being measured.
-     *
-     * `progressbar` takes its name from the author only: ARIA never computes one
-     * from an element's contents for this role, and the contents here are dots
-     * anyway. Without it the meter announces "13 of 30" against nothing.
-     * `StatBar` gets this from its required `label`; a bare grid of dots has no
-     * such text, so it has to be stated.
-     *
-     * Omitting it warns once in development; see `use-accessible-name-warning`.
-     */
-    accessibilityLabel?: string;
-    /** Container style override. */
-    style?: StyleProp<ViewStyle>;
-    testID?: string;
-}
-//# sourceMappingURL=types.d.ts.map

package/lib/typescript/module/dot-grid-meter/types.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/dot-grid-meter/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAEzD,MAAM,WAAW,iBAAiB;IAChC,uDAAuD;IACvD,MAAM,EAAE,MAAM,CAAC;IACf,wCAAwC;IACxC,KAAK,EAAE,MAAM,CAAC;IACd;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;;;;;;;;OAUG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,gCAAgC;IAChC,KAAK,CAAC,EAAE,SAAS,CAAC,SAAS,CAAC,CAAC;IAC7B,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB"}