@xleddyl/443-components-native 0.0.0-stage → 0.0.0

package/lib/module/components/core/Touchable.js

@@ -0,0 +1,51 @@
+"use strict";
+
+import { Pressable } from 'react-native';
+import Animated from 'react-native-reanimated';
+import { usePressFeedback } from "../../hooks/usePressFeedback.js";
+import { triggerHaptic } from "../../theme/settings.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const AnimatedPressable = Animated.createAnimatedComponent(Pressable);
+export const Touchable = ({
+  feedback = 'scale',
+  pressScale,
+  haptic = false,
+  style,
+  onPressIn,
+  onPressOut,
+  onPress,
+  disabled,
+  accessibilityState,
+  ...props
+}) => {
+  const {
+    animatedStyle,
+    pressIn,
+    pressOut
+  } = usePressFeedback(feedback, pressScale, !!disabled);
+  const handlePressIn = event => {
+    pressIn();
+    onPressIn?.(event);
+  };
+  const handlePressOut = event => {
+    pressOut();
+    onPressOut?.(event);
+  };
+  const handlePress = event => {
+    triggerHaptic(haptic);
+    onPress?.(event);
+  };
+  return /*#__PURE__*/_jsx(AnimatedPressable, {
+    accessibilityState: {
+      disabled: !!disabled,
+      ...accessibilityState
+    },
+    ...props,
+    disabled: disabled,
+    onPressIn: handlePressIn,
+    onPressOut: handlePressOut,
+    onPress: onPress ? handlePress : undefined,
+    style: [style, animatedStyle]
+  });
+};
+//# sourceMappingURL=Touchable.js.map

package/lib/module/components/core/Touchable.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["Pressable","Animated","usePressFeedback","triggerHaptic","jsx","_jsx","AnimatedPressable","createAnimatedComponent","Touchable","feedback","pressScale","haptic","style","onPressIn","onPressOut","onPress","disabled","accessibilityState","props","animatedStyle","pressIn","pressOut","handlePressIn","event","handlePressOut","handlePress","undefined"],"sourceRoot":"../../../../src","sources":["components/core/Touchable.tsx"],"mappings":";;AACA,SAASA,SAAS,QAAc,cAAc;AAE9C,OAAOC,QAAQ,MAAM,yBAAyB;AAC9C,SAASC,gBAAgB,QAAQ,iCAA8B;AAE/D,SAASC,aAAa,QAAQ,yBAAsB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAGpD,MAAMC,iBAAiB,GAAGL,QAAQ,CAACM,uBAAuB,CAACP,SAAS,CAAC;AAWrE,OAAO,MAAMQ,SAAS,GAAGA,CAAC;EACvBC,QAAQ,GAAG,OAAO;EAClBC,UAAU;EACVC,MAAM,GAAG,KAAK;EACdC,KAAK;EACLC,SAAS;EACTC,UAAU;EACVC,OAAO;EACPC,QAAQ;EACRC,kBAAkB;EAClB,GAAGC;AACU,CAAC,KAAK;EACnB,MAAM;IAAEC,aAAa;IAAEC,OAAO;IAAEC;EAAS,CAAC,GAAGnB,gBAAgB,CAACO,QAAQ,EAAEC,UAAU,EAAE,CAAC,CAACM,QAAQ,CAAC;EAE/F,MAAMM,aAAa,GAAIC,KAA4B,IAAK;IACrDH,OAAO,CAAC,CAAC;IACTP,SAAS,GAAGU,KAAK,CAAC;EACrB,CAAC;EAED,MAAMC,cAAc,GAAID,KAA4B,IAAK;IACtDF,QAAQ,CAAC,CAAC;IACVP,UAAU,GAAGS,KAAK,CAAC;EACtB,CAAC;EAED,MAAME,WAAW,GAAIF,KAA4B,IAAK;IACnDpB,aAAa,CAACQ,MAAM,CAAC;IACrBI,OAAO,GAAGQ,KAAK,CAAC;EACnB,CAAC;EAED,oBACGlB,IAAA,CAACC,iBAAiB;IACfW,kBAAkB,EAAE;MAAED,QAAQ,EAAE,CAAC,CAACA,QAAQ;MAAE,GAAGC;IAAmB,CAAE;IAAA,GAChEC,KAAK;IACTF,QAAQ,EAAEA,QAAS;IACnBH,SAAS,EAAES,aAAc;IACzBR,UAAU,EAAEU,cAAe;IAC3BT,OAAO,EAAEA,OAAO,GAAGU,WAAW,GAAGC,SAAU;IAC3Cd,KAAK,EAAE,CAACA,KAAK,EAAEO,aAAa;EAAE,CAChC,CAAC;AAER,CAAC","ignoreList":[]}

package/lib/module/components/core/buttonColors.js

@@ -0,0 +1,33 @@
+"use strict";
+
+import { toneColors } from "../../theme/tones.js";
+export const buttonColors = (theme, variant, tone) => {
+  const colors = toneColors(theme, tone);
+  switch (variant) {
+    case 'solid':
+      return {
+        background: colors.solid,
+        border: colors.solid,
+        content: colors.on
+      };
+    case 'soft':
+      return {
+        background: colors.soft,
+        border: colors.soft,
+        content: colors.text
+      };
+    case 'outline':
+      return {
+        background: 'transparent',
+        border: tone === 'neutral' ? theme.colors.borderStrong : colors.solid,
+        content: colors.text
+      };
+    case 'ghost':
+      return {
+        background: 'transparent',
+        border: 'transparent',
+        content: colors.text
+      };
+  }
+};
+//# sourceMappingURL=buttonColors.js.map

package/lib/module/components/core/buttonColors.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["toneColors","buttonColors","theme","variant","tone","colors","background","solid","border","content","on","soft","text","borderStrong"],"sourceRoot":"../../../../src","sources":["components/core/buttonColors.ts"],"mappings":";;AAAA,SAASA,UAAU,QAAQ,sBAAmB;AAW9C,OAAO,MAAMC,YAAY,GAAGA,CACzBC,KAAgB,EAChBC,OAAsB,EACtBC,IAAU,KACM;EAChB,MAAMC,MAAM,GAAGL,UAAU,CAACE,KAAK,EAAEE,IAAI,CAAC;EACtC,QAAQD,OAAO;IACZ,KAAK,OAAO;MACT,OAAO;QAAEG,UAAU,EAAED,MAAM,CAACE,KAAK;QAAEC,MAAM,EAAEH,MAAM,CAACE,KAAK;QAAEE,OAAO,EAAEJ,MAAM,CAACK;MAAG,CAAC;IAChF,KAAK,MAAM;MACR,OAAO;QAAEJ,UAAU,EAAED,MAAM,CAACM,IAAI;QAAEH,MAAM,EAAEH,MAAM,CAACM,IAAI;QAAEF,OAAO,EAAEJ,MAAM,CAACO;MAAK,CAAC;IAChF,KAAK,SAAS;MACX,OAAO;QACJN,UAAU,EAAE,aAAa;QACzBE,MAAM,EAAEJ,IAAI,KAAK,SAAS,GAAGF,KAAK,CAACG,MAAM,CAACQ,YAAY,GAAGR,MAAM,CAACE,KAAK;QACrEE,OAAO,EAAEJ,MAAM,CAACO;MACnB,CAAC;IACJ,KAAK,OAAO;MACT,OAAO;QAAEN,UAAU,EAAE,aAAa;QAAEE,MAAM,EAAE,aAAa;QAAEC,OAAO,EAAEJ,MAAM,CAACO;MAAK,CAAC;EACvF;AACH,CAAC","ignoreList":[]}

package/lib/module/components/core/field.js

@@ -0,0 +1,41 @@
+"use strict";
+
+import { useId } from 'react';
+import { disabledOpacity } from "../../utils/styles.js";
+export const fieldErrorMessage = error => typeof error === 'string' && error.length > 0 ? error : undefined;
+export const useFieldIds = () => {
+  const id = useId();
+  return {
+    labelId: `${id}-label`,
+    messageId: `${id}-message`
+  };
+};
+export const inputState = ({
+  disabled = false,
+  invalid = false,
+  focused = false
+}) => {
+  if (disabled) {
+    return 'disabled';
+  }
+  if (invalid) {
+    return 'invalid';
+  }
+  return focused ? 'focused' : 'idle';
+};
+export const inputHeight = (theme, size) => theme.components.textField?.height?.[size] ?? theme.sizes.control[size];
+export const inputRadius = theme => theme.components.textField?.radius ?? theme.radius.md;
+export const inputBorderColor = (theme, state) => {
+  if (state === 'invalid') {
+    return theme.colors.danger;
+  }
+  return state === 'focused' ? theme.colors.focus : theme.colors.border;
+};
+export const inputSurface = (theme, state) => ({
+  borderWidth: theme.components.textField?.borderWidth ?? theme.sizes.borderWidth,
+  borderRadius: inputRadius(theme),
+  borderColor: inputBorderColor(theme, state),
+  backgroundColor: state === 'disabled' ? theme.colors.surfaceSunken : theme.components.textField?.background ?? theme.colors.surface,
+  opacity: disabledOpacity(theme, state === 'disabled')
+});
+//# sourceMappingURL=field.js.map

package/lib/module/components/core/field.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useId","disabledOpacity","fieldErrorMessage","error","length","undefined","useFieldIds","id","labelId","messageId","inputState","disabled","invalid","focused","inputHeight","theme","size","components","textField","height","sizes","control","inputRadius","radius","md","inputBorderColor","state","colors","danger","focus","border","inputSurface","borderWidth","borderRadius","borderColor","backgroundColor","surfaceSunken","background","surface","opacity"],"sourceRoot":"../../../../src","sources":["components/core/field.ts"],"mappings":";;AAAA,SAASA,KAAK,QAAQ,OAAO;AAE7B,SAASC,eAAe,QAAQ,uBAAoB;AAIpD,OAAO,MAAMC,iBAAiB,GAAIC,KAAmC,IAClE,OAAOA,KAAK,KAAK,QAAQ,IAAIA,KAAK,CAACC,MAAM,GAAG,CAAC,GAAGD,KAAK,GAAGE,SAAS;AAEpE,OAAO,MAAMC,WAAW,GAAGA,CAAA,KAAM;EAC9B,MAAMC,EAAE,GAAGP,KAAK,CAAC,CAAC;EAClB,OAAO;IAAEQ,OAAO,EAAE,GAAGD,EAAE,QAAQ;IAAEE,SAAS,EAAE,GAAGF,EAAE;EAAW,CAAC;AAChE,CAAC;AAED,OAAO,MAAMG,UAAU,GAAGA,CAAC;EACxBC,QAAQ,GAAG,KAAK;EAChBC,OAAO,GAAG,KAAK;EACfC,OAAO,GAAG;AAKb,CAAC,KAAiB;EACf,IAAIF,QAAQ,EAAE;IACX,OAAO,UAAU;EACpB;EACA,IAAIC,OAAO,EAAE;IACV,OAAO,SAAS;EACnB;EACA,OAAOC,OAAO,GAAG,SAAS,GAAG,MAAM;AACtC,CAAC;AAED,OAAO,MAAMC,WAAW,GAAGA,CAACC,KAAgB,EAAEC,IAAiB,KAC5DD,KAAK,CAACE,UAAU,CAACC,SAAS,EAAEC,MAAM,GAAGH,IAAI,CAAC,IAAID,KAAK,CAACK,KAAK,CAACC,OAAO,CAACL,IAAI,CAAC;AAE1E,OAAO,MAAMM,WAAW,GAAIP,KAAgB,IACzCA,KAAK,CAACE,UAAU,CAACC,SAAS,EAAEK,MAAM,IAAIR,KAAK,CAACQ,MAAM,CAACC,EAAE;AAExD,OAAO,MAAMC,gBAAgB,GAAGA,CAACV,KAAgB,EAAEW,KAAiB,KAAK;EACtE,IAAIA,KAAK,KAAK,SAAS,EAAE;IACtB,OAAOX,KAAK,CAACY,MAAM,CAACC,MAAM;EAC7B;EACA,OAAOF,KAAK,KAAK,SAAS,GAAGX,KAAK,CAACY,MAAM,CAACE,KAAK,GAAGd,KAAK,CAACY,MAAM,CAACG,MAAM;AACxE,CAAC;AAED,OAAO,MAAMC,YAAY,GAAGA,CAAChB,KAAgB,EAAEW,KAAiB,MAAM;EACnEM,WAAW,EAAEjB,KAAK,CAACE,UAAU,CAACC,SAAS,EAAEc,WAAW,IAAIjB,KAAK,CAACK,KAAK,CAACY,WAAW;EAC/EC,YAAY,EAAEX,WAAW,CAACP,KAAK,CAAC;EAChCmB,WAAW,EAAET,gBAAgB,CAACV,KAAK,EAAEW,KAAK,CAAC;EAC3CS,eAAe,EACZT,KAAK,KAAK,UAAU,GACfX,KAAK,CAACY,MAAM,CAACS,aAAa,GACzBrB,KAAK,CAACE,UAAU,CAACC,SAAS,EAAEmB,UAAU,IAAItB,KAAK,CAACY,MAAM,CAACW,OAAQ;EACxEC,OAAO,EAAEtC,eAAe,CAACc,KAAK,EAAEW,KAAK,KAAK,UAAU;AACvD,CAAC,CAAC","ignoreList":[]}

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

@@ -0,0 +1,14 @@
+"use strict";
+
+export { Button } from "./Button.js";
+export { buttonColors } from "./buttonColors.js";
+export { DefaultIcon, hasDefaultGlyph } from "./DefaultIcon.js";
+export { Icon, renderIcon, renderIconGlyph, resolveIconSize } from "./Icon.js";
+export { IconButton } from "./IconButton.js";
+export { Screen } from "./Screen.js";
+export { Spinner } from "./Spinner.js";
+export { Stack } from "./Stack.js";
+export { Text, textToneColor } from "./Text.js";
+export { TextField } from "./TextField.js";
+export { Touchable } from "./Touchable.js";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"names":["Button","buttonColors","DefaultIcon","hasDefaultGlyph","Icon","renderIcon","renderIconGlyph","resolveIconSize","IconButton","Screen","Spinner","Stack","Text","textToneColor","TextField","Touchable"],"sourceRoot":"../../../../src","sources":["components/core/index.ts"],"mappings":";;AAAA,SAASA,MAAM,QAAQ,aAAU;AAEjC,SAASC,YAAY,QAAQ,mBAAgB;AAE7C,SAASC,WAAW,EAAEC,eAAe,QAAQ,kBAAe;AAC5D,SAASC,IAAI,EAAEC,UAAU,EAAEC,eAAe,EAAEC,eAAe,QAAQ,WAAQ;AAE3E,SAASC,UAAU,QAAQ,iBAAc;AAEzC,SAASC,MAAM,QAAQ,aAAU;AAEjC,SAASC,OAAO,QAAQ,cAAW;AAEnC,SAASC,KAAK,QAAQ,YAAS;AAE/B,SAASC,IAAI,EAAEC,aAAa,QAAQ,WAAQ;AAE5C,SAASC,SAAS,QAAQ,gBAAa;AAEvC,SAASC,SAAS,QAAQ,gBAAa","ignoreList":[]}

package/lib/module/components/display/Avatar.js

@@ -0,0 +1,78 @@
+"use strict";
+
+import { useState } from 'react';
+import { Image, View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { toneColors } from "../../theme/tones.js";
+import { Text } from "../core/Text.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const defaultSizes = {
+  xs: 24,
+  sm: 32,
+  md: 40,
+  lg: 56,
+  xl: 80
+};
+const avatarTones = ['primary', 'success', 'warning', 'info', 'danger', 'secondary'];
+export const avatarDimension = (theme, size) => typeof size === 'number' ? size : theme.components.avatar?.sizes?.[size] ?? defaultSizes[size];
+export const initialsFor = name => name.trim().split(/\s+/).filter(Boolean).slice(0, 2).map(part => part.charAt(0).toUpperCase()).join('');
+const toneForName = name => {
+  const hash = Array.from(name).reduce((sum, char) => sum + char.charCodeAt(0), 0);
+  return avatarTones[hash % avatarTones.length] ?? 'primary';
+};
+export const Avatar = ({
+  ref,
+  source,
+  name,
+  fallback,
+  size = 'md',
+  tone,
+  accessibilityLabel,
+  style,
+  styles
+}) => {
+  const sourceKey = source === undefined ? '' : JSON.stringify(source);
+  const [failedKey, setFailedKey] = useState(null);
+  const showImage = source !== undefined && failedKey !== sourceKey;
+  const resolvedTone = tone ?? (name ? toneForName(name) : 'neutral');
+  const initials = name ? initialsFor(name) : '';
+  return /*#__PURE__*/_jsx(View, {
+    ref: ref,
+    accessible: true,
+    accessibilityRole: "image",
+    accessibilityLabel: accessibilityLabel ?? name,
+    style: [stylesheet.container(size, resolvedTone), style, styles?.container],
+    children: showImage ? /*#__PURE__*/_jsx(Image, {
+      source: source,
+      onError: () => setFailedKey(sourceKey),
+      resizeMode: "cover",
+      style: [stylesheet.image, styles?.image]
+    }) : initials ? /*#__PURE__*/_jsx(Text, {
+      variant: "label",
+      weight: "semibold",
+      style: [stylesheet.initials(size, resolvedTone), styles?.initials],
+      children: initials
+    }) : fallback
+  });
+};
+const stylesheet = StyleSheet.create(theme => ({
+  container: (size, tone) => ({
+    width: avatarDimension(theme, size),
+    height: avatarDimension(theme, size),
+    borderRadius: theme.radius.full,
+    alignItems: 'center',
+    justifyContent: 'center',
+    overflow: 'hidden',
+    backgroundColor: toneColors(theme, tone).soft
+  }),
+  image: {
+    width: '100%',
+    height: '100%'
+  },
+  initials: (size, tone) => ({
+    color: toneColors(theme, tone).text,
+    fontSize: Math.round(avatarDimension(theme, size) * 0.38),
+    lineHeight: Math.round(avatarDimension(theme, size) * 0.5)
+  })
+}));
+//# sourceMappingURL=Avatar.js.map

package/lib/module/components/display/Avatar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useState","Image","View","StyleSheet","toneColors","Text","jsx","_jsx","defaultSizes","xs","sm","md","lg","xl","avatarTones","avatarDimension","theme","size","components","avatar","sizes","initialsFor","name","trim","split","filter","Boolean","slice","map","part","charAt","toUpperCase","join","toneForName","hash","Array","from","reduce","sum","char","charCodeAt","length","Avatar","ref","source","fallback","tone","accessibilityLabel","style","styles","sourceKey","undefined","JSON","stringify","failedKey","setFailedKey","showImage","resolvedTone","initials","accessible","accessibilityRole","stylesheet","container","children","onError","resizeMode","image","variant","weight","create","width","height","borderRadius","radius","full","alignItems","justifyContent","overflow","backgroundColor","soft","color","text","fontSize","Math","round","lineHeight"],"sourceRoot":"../../../../src","sources":["components/display/Avatar.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/display/AvatarGroup.js

@@ -0,0 +1,55 @@
+"use strict";
+
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { Avatar, avatarDimension } from "./Avatar.js";
+import { Text } from "../core/Text.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const AvatarGroup = ({
+  ref,
+  items,
+  max = 4,
+  size = 'md',
+  overlap = 0.3,
+  style
+}) => {
+  const visible = items.slice(0, max);
+  const hidden = items.length - visible.length;
+  return /*#__PURE__*/_jsxs(View, {
+    ref: ref,
+    accessible: true,
+    accessibilityLabel: items.map(item => item.name).filter(Boolean).join(', '),
+    style: [stylesheet.container, style],
+    children: [visible.map((item, index) => /*#__PURE__*/_jsx(View, {
+      style: stylesheet.item(size, index === 0, overlap),
+      children: /*#__PURE__*/_jsx(Avatar, {
+        ...item,
+        size: size
+      })
+    }, item.name ?? index)), hidden > 0 ? /*#__PURE__*/_jsx(View, {
+      style: stylesheet.item(size, false, overlap),
+      children: /*#__PURE__*/_jsx(Avatar, {
+        size: size,
+        tone: "neutral",
+        fallback: /*#__PURE__*/_jsx(Text, {
+          variant: "caption",
+          weight: "semibold",
+          children: `+${hidden}`
+        })
+      })
+    }) : null]
+  });
+};
+const stylesheet = StyleSheet.create(theme => ({
+  container: {
+    flexDirection: 'row',
+    alignSelf: 'flex-start'
+  },
+  item: (size, first, overlap) => ({
+    marginLeft: first ? 0 : -avatarDimension(theme, size) * overlap,
+    borderRadius: theme.radius.full,
+    borderWidth: theme.sizes.borderWidth * 2,
+    borderColor: theme.colors.background
+  })
+}));
+//# sourceMappingURL=AvatarGroup.js.map

package/lib/module/components/display/AvatarGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","StyleSheet","Avatar","avatarDimension","Text","jsx","_jsx","jsxs","_jsxs","AvatarGroup","ref","items","max","size","overlap","style","visible","slice","hidden","length","accessible","accessibilityLabel","map","item","name","filter","Boolean","join","stylesheet","container","children","index","tone","fallback","variant","weight","create","theme","flexDirection","alignSelf","first","marginLeft","borderRadius","radius","full","borderWidth","sizes","borderColor","colors","background"],"sourceRoot":"../../../../src","sources":["components/display/AvatarGroup.tsx"],"mappings":";;AACA,SAASA,IAAI,QAAQ,cAAc;AAEnC,SAASC,UAAU,QAAQ,wBAAwB;AACnD,SAASC,MAAM,EAAEC,eAAe,QAAQ,aAAU;AAElD,SAASC,IAAI,QAAQ,iBAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAWnC,OAAO,MAAMC,WAAW,GAAGA,CAAC;EACzBC,GAAG;EACHC,KAAK;EACLC,GAAG,GAAG,CAAC;EACPC,IAAI,GAAG,IAAI;EACXC,OAAO,GAAG,GAAG;EACbC;AACe,CAAC,KAAK;EACrB,MAAMC,OAAO,GAAGL,KAAK,CAACM,KAAK,CAAC,CAAC,EAAEL,GAAG,CAAC;EACnC,MAAMM,MAAM,GAAGP,KAAK,CAACQ,MAAM,GAAGH,OAAO,CAACG,MAAM;EAE5C,oBACGX,KAAA,CAACR,IAAI;IACFU,GAAG,EAAEA,GAAI;IACTU,UAAU;IACVC,kBAAkB,EAAEV,KAAK,CACrBW,GAAG,CAAEC,IAAI,IAAKA,IAAI,CAACC,IAAI,CAAC,CACxBC,MAAM,CAACC,OAAO,CAAC,CACfC,IAAI,CAAC,IAAI,CAAE;IACfZ,KAAK,EAAE,CAACa,UAAU,CAACC,SAAS,EAAEd,KAAK,CAAE;IAAAe,QAAA,GAEpCd,OAAO,CAACM,GAAG,CAAC,CAACC,IAAI,EAAEQ,KAAK,kBACtBzB,IAAA,CAACN,IAAI;MAA0Be,KAAK,EAAEa,UAAU,CAACL,IAAI,CAACV,IAAI,EAAEkB,KAAK,KAAK,CAAC,EAAEjB,OAAO,CAAE;MAAAgB,QAAA,eAC/ExB,IAAA,CAACJ,MAAM;QAAA,GAAKqB,IAAI;QAAEV,IAAI,EAAEA;MAAK,CAAE;IAAC,GADxBU,IAAI,CAACC,IAAI,IAAIO,KAElB,CACR,CAAC,EACDb,MAAM,GAAG,CAAC,gBACRZ,IAAA,CAACN,IAAI;MAACe,KAAK,EAAEa,UAAU,CAACL,IAAI,CAACV,IAAI,EAAE,KAAK,EAAEC,OAAO,CAAE;MAAAgB,QAAA,eAChDxB,IAAA,CAACJ,MAAM;QACJW,IAAI,EAAEA,IAAK;QACXmB,IAAI,EAAC,SAAS;QACdC,QAAQ,eACL3B,IAAA,CAACF,IAAI;UAAC8B,OAAO,EAAC,SAAS;UAACC,MAAM,EAAC,UAAU;UAAAL,QAAA,EACrC,IAAIZ,MAAM;QAAE,CACV;MACR,CACH;IAAC,CACC,CAAC,GACN,IAAI;EAAA,CACL,CAAC;AAEb,CAAC;AAED,MAAMU,UAAU,GAAG3B,UAAU,CAACmC,MAAM,CAAEC,KAAK,KAAM;EAC9CR,SAAS,EAAE;IACRS,aAAa,EAAE,KAAK;IACpBC,SAAS,EAAE;EACd,CAAC;EACDhB,IAAI,EAAEA,CAACV,IAA6B,EAAE2B,KAAc,EAAE1B,OAAe,MAAM;IACxE2B,UAAU,EAAED,KAAK,GAAG,CAAC,GAAG,CAACrC,eAAe,CAACkC,KAAK,EAAExB,IAAI,CAAC,GAAGC,OAAO;IAC/D4B,YAAY,EAAEL,KAAK,CAACM,MAAM,CAACC,IAAI;IAC/BC,WAAW,EAAER,KAAK,CAACS,KAAK,CAACD,WAAW,GAAG,CAAC;IACxCE,WAAW,EAAEV,KAAK,CAACW,MAAM,CAACC;EAC7B,CAAC;AACJ,CAAC,CAAC,CAAC","ignoreList":[]}

package/lib/module/components/display/Badge.js

@@ -0,0 +1,77 @@
+"use strict";
+
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { toneColors } from "../../theme/tones.js";
+import { countLabel } from "../../utils/math.js";
+import { Text } from "../core/Text.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+const badgeHeight = (theme, size) => theme.components.badge?.height?.[size] ?? theme.sizes.icon[size] + 4;
+const dotSize = (theme, size) => Math.round(theme.sizes.icon[size] / 2);
+export const Badge = ({
+  ref,
+  children,
+  count,
+  max = 99,
+  showZero = false,
+  dot = false,
+  tone = 'primary',
+  variant = 'solid',
+  size = 'md',
+  accessibilityLabel,
+  style,
+  styles
+}) => {
+  const content = count !== undefined ? countLabel(count, max) : children;
+  if (dot) {
+    return /*#__PURE__*/_jsx(View, {
+      ref: ref,
+      accessible: true,
+      accessibilityLabel: accessibilityLabel,
+      style: [stylesheet.dot(size, tone), style, styles?.container]
+    });
+  }
+  if (count === 0 && !showZero && !children) {
+    return null;
+  }
+  if (content === undefined) {
+    return null;
+  }
+  return /*#__PURE__*/_jsx(View, {
+    ref: ref,
+    accessible: true,
+    accessibilityLabel: accessibilityLabel ?? content,
+    style: [stylesheet.container(size, tone, variant), style, styles?.container],
+    children: /*#__PURE__*/_jsx(Text, {
+      variant: "caption",
+      weight: "semibold",
+      numberOfLines: 1,
+      style: [stylesheet.label(size, tone, variant), styles?.label],
+      children: content
+    })
+  });
+};
+const stylesheet = StyleSheet.create(theme => ({
+  container: (size, tone, variant) => ({
+    alignSelf: 'flex-start',
+    alignItems: 'center',
+    justifyContent: 'center',
+    minWidth: badgeHeight(theme, size),
+    height: badgeHeight(theme, size),
+    paddingHorizontal: theme.space(0.75),
+    borderRadius: theme.components.badge?.radius ?? theme.radius.full,
+    backgroundColor: variant === 'solid' ? toneColors(theme, tone).solid : toneColors(theme, tone).soft
+  }),
+  dot: (size, tone) => ({
+    width: dotSize(theme, size),
+    height: dotSize(theme, size),
+    borderRadius: theme.radius.full,
+    backgroundColor: toneColors(theme, tone).solid
+  }),
+  label: (size, tone, variant) => ({
+    color: variant === 'solid' ? toneColors(theme, tone).on : toneColors(theme, tone).text,
+    fontSize: size === 'sm' ? theme.typography.variants.caption.fontSize - 1 : theme.typography.variants.caption.fontSize,
+    lineHeight: badgeHeight(theme, size) - 2
+  })
+}));
+//# sourceMappingURL=Badge.js.map

package/lib/module/components/display/Badge.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","StyleSheet","toneColors","countLabel","Text","jsx","_jsx","badgeHeight","theme","size","components","badge","height","sizes","icon","dotSize","Math","round","Badge","ref","children","count","max","showZero","dot","tone","variant","accessibilityLabel","style","styles","content","undefined","accessible","stylesheet","container","weight","numberOfLines","label","create","alignSelf","alignItems","justifyContent","minWidth","paddingHorizontal","space","borderRadius","radius","full","backgroundColor","solid","soft","width","color","on","text","fontSize","typography","variants","caption","lineHeight"],"sourceRoot":"../../../../src","sources":["components/display/Badge.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/display/Banner.js

@@ -0,0 +1,91 @@
+"use strict";
+
+import { View } from 'react-native';
+import { StyleSheet, useUnistyles } from 'react-native-unistyles';
+import { toneColors } from "../../theme/tones.js";
+import { statusIcon } from "../../utils/statusIcon.js";
+import { IconButton } from "../core/IconButton.js";
+import { renderIcon } from "../core/Icon.js";
+import { Text } from "../core/Text.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const Banner = ({
+  ref,
+  tone = 'info',
+  title,
+  message,
+  children,
+  icon,
+  action,
+  onDismiss,
+  dismissLabel = 'Dismiss',
+  style,
+  styles
+}) => {
+  const {
+    theme
+  } = useUnistyles();
+  const colors = toneColors(theme, tone);
+  return /*#__PURE__*/_jsxs(View, {
+    ref: ref,
+    accessibilityRole: "alert",
+    accessibilityLiveRegion: "polite",
+    style: [stylesheet.container(tone), style, styles?.container],
+    children: [/*#__PURE__*/_jsx(View, {
+      style: [stylesheet.icon, styles?.icon],
+      children: renderIcon(icon ?? statusIcon(tone) ?? 'info', {
+        size: 'md',
+        color: colors.text
+      })
+    }), /*#__PURE__*/_jsxs(View, {
+      style: [stylesheet.content, styles?.content],
+      children: [title ? /*#__PURE__*/_jsx(Text, {
+        variant: "label",
+        weight: "semibold",
+        style: [stylesheet.title(tone), styles?.title],
+        children: title
+      }) : null, message ? /*#__PURE__*/_jsx(Text, {
+        variant: "caption",
+        tone: "default",
+        style: styles?.message,
+        children: message
+      }) : null, children, action ? /*#__PURE__*/_jsx(View, {
+        style: [stylesheet.action, styles?.action],
+        children: action
+      }) : null]
+    }), onDismiss ? /*#__PURE__*/_jsx(IconButton, {
+      icon: "close",
+      size: "sm",
+      tone: tone,
+      accessibilityLabel: dismissLabel,
+      onPress: onDismiss,
+      style: styles?.dismiss
+    }) : null]
+  });
+};
+const stylesheet = StyleSheet.create(theme => ({
+  container: tone => ({
+    flexDirection: 'row',
+    alignItems: 'flex-start',
+    gap: theme.space(1.25),
+    padding: theme.space(1.5),
+    borderRadius: theme.radius.md,
+    borderWidth: theme.sizes.borderWidth,
+    borderColor: toneColors(theme, tone).text,
+    backgroundColor: toneColors(theme, tone).soft
+  }),
+  icon: {
+    paddingTop: 1
+  },
+  content: {
+    flex: 1,
+    gap: theme.space(0.5)
+  },
+  title: tone => ({
+    color: toneColors(theme, tone).text
+  }),
+  action: {
+    alignSelf: 'flex-start',
+    marginTop: theme.space(0.5)
+  }
+}));
+//# sourceMappingURL=Banner.js.map

package/lib/module/components/display/Banner.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","StyleSheet","useUnistyles","toneColors","statusIcon","IconButton","renderIcon","Text","jsx","_jsx","jsxs","_jsxs","Banner","ref","tone","title","message","children","icon","action","onDismiss","dismissLabel","style","styles","theme","colors","accessibilityRole","accessibilityLiveRegion","stylesheet","container","size","color","text","content","variant","weight","accessibilityLabel","onPress","dismiss","create","flexDirection","alignItems","gap","space","padding","borderRadius","radius","md","borderWidth","sizes","borderColor","backgroundColor","soft","paddingTop","flex","alignSelf","marginTop"],"sourceRoot":"../../../../src","sources":["components/display/Banner.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/display/Card.js

@@ -0,0 +1,84 @@
+"use strict";
+
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { disabledOpacity, nativeShadow } from "../../utils/styles.js";
+import { Touchable } from "../core/Touchable.js";
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+const elevatedShadow = theme => ({
+  opacity: theme.dark ? 0.4 : 0.08,
+  radius: 8,
+  offsetY: 2
+});
+const flatShadow = {
+  opacity: 0,
+  radius: 0,
+  offsetY: 0,
+  elevation: 0
+};
+const cardPadding = theme => theme.components.card?.padding ?? theme.space(2);
+export const Card = ({
+  ref,
+  children,
+  header,
+  footer,
+  variant = 'elevated',
+  padded = true,
+  onPress,
+  disabled = false,
+  accessibilityLabel,
+  accessibilityHint,
+  style,
+  styles
+}) => {
+  const body = /*#__PURE__*/_jsxs(_Fragment, {
+    children: [header ? /*#__PURE__*/_jsx(View, {
+      style: [stylesheet.section(padded), styles?.header],
+      children: header
+    }) : null, /*#__PURE__*/_jsx(View, {
+      style: [stylesheet.content(padded), styles?.content],
+      children: children
+    }), footer ? /*#__PURE__*/_jsx(View, {
+      style: [stylesheet.section(padded), styles?.footer],
+      children: footer
+    }) : null]
+  });
+  if (onPress) {
+    return /*#__PURE__*/_jsx(Touchable, {
+      ref: ref,
+      accessibilityRole: "button",
+      accessibilityLabel: accessibilityLabel,
+      accessibilityHint: accessibilityHint,
+      disabled: disabled,
+      onPress: onPress,
+      pressScale: 0.985,
+      style: [stylesheet.container(variant, disabled), style, styles?.container],
+      children: body
+    });
+  }
+  return /*#__PURE__*/_jsx(View, {
+    ref: ref,
+    accessibilityLabel: accessibilityLabel,
+    style: [stylesheet.container(variant, disabled), style, styles?.container],
+    children: body
+  });
+};
+const stylesheet = StyleSheet.create(theme => ({
+  container: (variant, disabled) => ({
+    borderRadius: theme.components.card?.radius ?? theme.radius.lg,
+    backgroundColor: variant === 'filled' ? theme.colors.surfaceSunken : theme.colors.surfaceRaised,
+    borderWidth: variant === 'outline' ? theme.sizes.borderWidth : 0,
+    borderColor: theme.colors.border,
+    ...nativeShadow(theme, variant === 'elevated' ? elevatedShadow(theme) : flatShadow),
+    opacity: disabledOpacity(theme, disabled)
+  }),
+  section: padded => ({
+    paddingHorizontal: padded ? cardPadding(theme) : 0,
+    paddingVertical: padded ? cardPadding(theme) / 2 : 0
+  }),
+  content: padded => ({
+    padding: padded ? cardPadding(theme) : 0,
+    gap: theme.space(1)
+  })
+}));
+//# sourceMappingURL=Card.js.map

package/lib/module/components/display/Card.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","StyleSheet","disabledOpacity","nativeShadow","Touchable","jsx","_jsx","Fragment","_Fragment","jsxs","_jsxs","elevatedShadow","theme","opacity","dark","radius","offsetY","flatShadow","elevation","cardPadding","components","card","padding","space","Card","ref","children","header","footer","variant","padded","onPress","disabled","accessibilityLabel","accessibilityHint","style","styles","body","stylesheet","section","content","accessibilityRole","pressScale","container","create","borderRadius","lg","backgroundColor","colors","surfaceSunken","surfaceRaised","borderWidth","sizes","borderColor","border","paddingHorizontal","paddingVertical","gap"],"sourceRoot":"../../../../src","sources":["components/display/Card.tsx"],"mappings":";;AACA,SAASA,IAAI,QAAQ,cAAc;AAEnC,SAASC,UAAU,QAAQ,wBAAwB;AAEnD,SAASC,eAAe,EAAEC,YAAY,QAAQ,uBAAoB;AAElE,SAASC,SAAS,QAAQ,sBAAmB;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,QAAA,IAAAC,SAAA,EAAAC,IAAA,IAAAC,KAAA;AAgC7C,MAAMC,cAAc,GAAIC,KAAgB,KAAM;EAC3CC,OAAO,EAAED,KAAK,CAACE,IAAI,GAAG,GAAG,GAAG,IAAI;EAChCC,MAAM,EAAE,CAAC;EACTC,OAAO,EAAE;AACZ,CAAC,CAAC;AAEF,MAAMC,UAAU,GAAG;EAAEJ,OAAO,EAAE,CAAC;EAAEE,MAAM,EAAE,CAAC;EAAEC,OAAO,EAAE,CAAC;EAAEE,SAAS,EAAE;AAAE,CAAC;AAEtE,MAAMC,WAAW,GAAIP,KAAgB,IAAKA,KAAK,CAACQ,UAAU,CAACC,IAAI,EAAEC,OAAO,IAAIV,KAAK,CAACW,KAAK,CAAC,CAAC,CAAC;AAE1F,OAAO,MAAMC,IAAI,GAAGA,CAAC;EAClBC,GAAG;EACHC,QAAQ;EACRC,MAAM;EACNC,MAAM;EACNC,OAAO,GAAG,UAAU;EACpBC,MAAM,GAAG,IAAI;EACbC,OAAO;EACPC,QAAQ,GAAG,KAAK;EAChBC,kBAAkB;EAClBC,iBAAiB;EACjBC,KAAK;EACLC;AACQ,CAAC,KAAK;EACd,MAAMC,IAAI,gBACP3B,KAAA,CAAAF,SAAA;IAAAkB,QAAA,GACIC,MAAM,gBACJrB,IAAA,CAACN,IAAI;MAACmC,KAAK,EAAE,CAACG,UAAU,CAACC,OAAO,CAACT,MAAM,CAAC,EAAEM,MAAM,EAAET,MAAM,CAAE;MAAAD,QAAA,EAAEC;IAAM,CAAO,CAAC,GACzE,IAAI,eACRrB,IAAA,CAACN,IAAI;MAACmC,KAAK,EAAE,CAACG,UAAU,CAACE,OAAO,CAACV,MAAM,CAAC,EAAEM,MAAM,EAAEI,OAAO,CAAE;MAAAd,QAAA,EAAEA;IAAQ,CAAO,CAAC,EAC5EE,MAAM,gBACJtB,IAAA,CAACN,IAAI;MAACmC,KAAK,EAAE,CAACG,UAAU,CAACC,OAAO,CAACT,MAAM,CAAC,EAAEM,MAAM,EAAER,MAAM,CAAE;MAAAF,QAAA,EAAEE;IAAM,CAAO,CAAC,GACzE,IAAI;EAAA,CACT,CACJ;EAED,IAAIG,OAAO,EAAE;IACV,oBACGzB,IAAA,CAACF,SAAS;MACPqB,GAAG,EAAEA,GAAI;MACTgB,iBAAiB,EAAC,QAAQ;MAC1BR,kBAAkB,EAAEA,kBAAmB;MACvCC,iBAAiB,EAAEA,iBAAkB;MACrCF,QAAQ,EAAEA,QAAS;MACnBD,OAAO,EAAEA,OAAQ;MACjBW,UAAU,EAAE,KAAM;MAClBP,KAAK,EAAE,CAACG,UAAU,CAACK,SAAS,CAACd,OAAO,EAAEG,QAAQ,CAAC,EAAEG,KAAK,EAAEC,MAAM,EAAEO,SAAS,CAAE;MAAAjB,QAAA,EAE1EW;IAAI,CACG,CAAC;EAElB;EAEA,oBACG/B,IAAA,CAACN,IAAI;IACFyB,GAAG,EAAEA,GAAI;IACTQ,kBAAkB,EAAEA,kBAAmB;IACvCE,KAAK,EAAE,CAACG,UAAU,CAACK,SAAS,CAACd,OAAO,EAAEG,QAAQ,CAAC,EAAEG,KAAK,EAAEC,MAAM,EAAEO,SAAS,CAAE;IAAAjB,QAAA,EAE1EW;EAAI,CACF,CAAC;AAEb,CAAC;AAED,MAAMC,UAAU,GAAGrC,UAAU,CAAC2C,MAAM,CAAEhC,KAAK,KAAM;EAC9C+B,SAAS,EAAEA,CAACd,OAAoB,EAAEG,QAAiB,MAAM;IACtDa,YAAY,EAAEjC,KAAK,CAACQ,UAAU,CAACC,IAAI,EAAEN,MAAM,IAAIH,KAAK,CAACG,MAAM,CAAC+B,EAAE;IAC9DC,eAAe,EACZlB,OAAO,KAAK,QAAQ,GAAGjB,KAAK,CAACoC,MAAM,CAACC,aAAa,GAAGrC,KAAK,CAACoC,MAAM,CAACE,aAAa;IACjFC,WAAW,EAAEtB,OAAO,KAAK,SAAS,GAAGjB,KAAK,CAACwC,KAAK,CAACD,WAAW,GAAG,CAAC;IAChEE,WAAW,EAAEzC,KAAK,CAACoC,MAAM,CAACM,MAAM;IAChC,GAAGnD,YAAY,CAACS,KAAK,EAAEiB,OAAO,KAAK,UAAU,GAAGlB,cAAc,CAACC,KAAK,CAAC,GAAGK,UAAU,CAAC;IACnFJ,OAAO,EAAEX,eAAe,CAACU,KAAK,EAAEoB,QAAQ;EAC3C,CAAC,CAAC;EACFO,OAAO,EAAGT,MAAe,KAAM;IAC5ByB,iBAAiB,EAAEzB,MAAM,GAAGX,WAAW,CAACP,KAAK,CAAC,GAAG,CAAC;IAClD4C,eAAe,EAAE1B,MAAM,GAAGX,WAAW,CAACP,KAAK,CAAC,GAAG,CAAC,GAAG;EACtD,CAAC,CAAC;EACF4B,OAAO,EAAGV,MAAe,KAAM;IAC5BR,OAAO,EAAEQ,MAAM,GAAGX,WAAW,CAACP,KAAK,CAAC,GAAG,CAAC;IACxC6C,GAAG,EAAE7C,KAAK,CAACW,KAAK,CAAC,CAAC;EACrB,CAAC;AACJ,CAAC,CAAC,CAAC","ignoreList":[]}