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

package/lib/module/components/forms/Calendar.js

@@ -0,0 +1,162 @@
+"use strict";
+
+import { useState } from 'react';
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { useControllableState, whenPresent } from "../../hooks/useControllableState.js";
+import { toneColors } from "../../theme/tones.js";
+import { Text } from "../core/Text.js";
+import { Touchable } from "../core/Touchable.js";
+import { addMonths, buildMonthGrid, formatDate, isDateOutOfRange, isSameDay, isSameMonth, startOfMonth, weekdayDates } from "./dateUtils.js";
+import { PeriodHeader } from "./PeriodHeader.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const daySize = theme => theme.components.calendar?.daySize ?? 40;
+export const Calendar = ({
+  ref,
+  value,
+  defaultValue = null,
+  onValueChange,
+  month,
+  defaultMonth,
+  onMonthChange,
+  minDate,
+  maxDate,
+  isDateDisabled,
+  locale,
+  weekStartsOn = 1,
+  showOutsideDays = false,
+  tone = 'primary',
+  previousMonthLabel = 'Previous month',
+  nextMonthLabel = 'Next month',
+  style,
+  styles
+}) => {
+  const [selected, setSelected] = useControllableState({
+    value,
+    defaultValue,
+    onChange: whenPresent(onValueChange)
+  });
+  const [visibleMonth, setVisibleMonth] = useControllableState({
+    value: month ? startOfMonth(month) : undefined,
+    defaultValue: startOfMonth(defaultMonth ?? selected ?? new Date()),
+    onChange: onMonthChange
+  });
+  const [today] = useState(() => new Date());
+  const grid = buildMonthGrid(visibleMonth, weekStartsOn);
+  const weekdays = weekdayDates(weekStartsOn);
+  const previousDisabled = !!minDate && startOfMonth(minDate).getTime() >= startOfMonth(visibleMonth).getTime();
+  const nextDisabled = !!maxDate && startOfMonth(maxDate).getTime() <= startOfMonth(visibleMonth).getTime();
+  return /*#__PURE__*/_jsxs(View, {
+    ref: ref,
+    style: [stylesheet.container, style, styles?.container],
+    children: [/*#__PURE__*/_jsx(PeriodHeader, {
+      previousLabel: previousMonthLabel,
+      nextLabel: nextMonthLabel,
+      previousDisabled: previousDisabled,
+      nextDisabled: nextDisabled,
+      onPrevious: () => setVisibleMonth(addMonths(visibleMonth, -1)),
+      onNext: () => setVisibleMonth(addMonths(visibleMonth, 1)),
+      style: [stylesheet.header, styles?.header],
+      titleStyle: styles?.title,
+      children: formatDate(visibleMonth, locale, {
+        month: 'long',
+        year: 'numeric'
+      })
+    }), /*#__PURE__*/_jsx(View, {
+      style: [stylesheet.weekRow, styles?.weekdays],
+      accessibilityElementsHidden: true,
+      importantForAccessibility: "no-hide-descendants",
+      children: weekdays.map(date => /*#__PURE__*/_jsx(View, {
+        style: stylesheet.cell,
+        children: /*#__PURE__*/_jsx(Text, {
+          variant: "caption",
+          tone: "muted",
+          weight: "medium",
+          style: [stylesheet.weekday, styles?.weekday],
+          children: formatDate(date, locale, {
+            weekday: 'short'
+          })
+        })
+      }, date.getDay()))
+    }), grid.map(week => /*#__PURE__*/_jsx(View, {
+      style: [stylesheet.weekRow, styles?.week],
+      children: week.map(({
+        date,
+        inMonth
+      }) => {
+        const hidden = !inMonth && !showOutsideDays;
+        const isSelected = !!selected && isSameDay(selected, date);
+        const isToday = isSameDay(today, date);
+        const disabled = isDateOutOfRange(date, minDate, maxDate) || !!isDateDisabled?.(date);
+        if (hidden) {
+          return /*#__PURE__*/_jsx(View, {
+            style: stylesheet.cell
+          }, date.getTime());
+        }
+        return /*#__PURE__*/_jsx(View, {
+          style: stylesheet.cell,
+          children: /*#__PURE__*/_jsx(Touchable, {
+            feedback: "opacity",
+            accessibilityRole: "button",
+            accessibilityLabel: formatDate(date, locale, {
+              dateStyle: 'full'
+            }),
+            accessibilityState: {
+              selected: isSelected,
+              disabled
+            },
+            disabled: disabled,
+            onPress: () => {
+              setSelected(date);
+              if (!isSameMonth(date, visibleMonth)) {
+                setVisibleMonth(startOfMonth(date));
+              }
+            },
+            style: [stylesheet.day(tone, isSelected, isToday), styles?.day],
+            children: /*#__PURE__*/_jsx(Text, {
+              variant: "label",
+              weight: isSelected ? 'semibold' : 'regular',
+              style: [stylesheet.dayLabel(tone, isSelected, isToday, inMonth), styles?.dayLabel],
+              children: date.getDate()
+            })
+          })
+        }, date.getTime());
+      })
+    }, week[0]?.date.getTime()))]
+  });
+};
+const stylesheet = StyleSheet.create(theme => ({
+  container: {
+    alignSelf: 'stretch',
+    gap: theme.space(0.5)
+  },
+  header: {
+    marginBottom: theme.space(0.5)
+  },
+  weekRow: {
+    flexDirection: 'row'
+  },
+  cell: {
+    flex: 1,
+    alignItems: 'center',
+    justifyContent: 'center',
+    minHeight: daySize(theme)
+  },
+  weekday: {
+    textTransform: 'capitalize'
+  },
+  day: (tone, selected, today) => ({
+    width: daySize(theme),
+    height: daySize(theme),
+    alignItems: 'center',
+    justifyContent: 'center',
+    borderRadius: theme.components.calendar?.radius ?? theme.radius.full,
+    backgroundColor: selected ? toneColors(theme, tone).solid : 'transparent',
+    borderWidth: today && !selected ? theme.sizes.borderWidth : 0,
+    borderColor: toneColors(theme, tone).solid
+  }),
+  dayLabel: (tone, selected, today, inMonth) => ({
+    color: selected ? toneColors(theme, tone).on : today ? toneColors(theme, tone).text : inMonth ? theme.colors.text : theme.colors.textDimmed
+  })
+}));
+//# sourceMappingURL=Calendar.js.map

package/lib/module/components/forms/Calendar.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useState","View","StyleSheet","useControllableState","whenPresent","toneColors","Text","Touchable","addMonths","buildMonthGrid","formatDate","isDateOutOfRange","isSameDay","isSameMonth","startOfMonth","weekdayDates","PeriodHeader","jsx","_jsx","jsxs","_jsxs","daySize","theme","components","calendar","Calendar","ref","value","defaultValue","onValueChange","month","defaultMonth","onMonthChange","minDate","maxDate","isDateDisabled","locale","weekStartsOn","showOutsideDays","tone","previousMonthLabel","nextMonthLabel","style","styles","selected","setSelected","onChange","visibleMonth","setVisibleMonth","undefined","Date","today","grid","weekdays","previousDisabled","getTime","nextDisabled","stylesheet","container","children","previousLabel","nextLabel","onPrevious","onNext","header","titleStyle","title","year","weekRow","accessibilityElementsHidden","importantForAccessibility","map","date","cell","variant","weight","weekday","getDay","week","inMonth","hidden","isSelected","isToday","disabled","feedback","accessibilityRole","accessibilityLabel","dateStyle","accessibilityState","onPress","day","dayLabel","getDate","create","alignSelf","gap","space","marginBottom","flexDirection","flex","alignItems","justifyContent","minHeight","textTransform","width","height","borderRadius","radius","full","backgroundColor","solid","borderWidth","sizes","borderColor","color","on","text","colors","textDimmed"],"sourceRoot":"../../../../src","sources":["components/forms/Calendar.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/forms/Checkbox.js

@@ -0,0 +1,131 @@
+"use strict";
+
+import { View } from 'react-native';
+import Animated, { useAnimatedStyle } from 'react-native-reanimated';
+import { StyleSheet, useUnistyles } from 'react-native-unistyles';
+import { useControllableState } from "../../hooks/useControllableState.js";
+import { useToggleProgress } from "../../hooks/useToggleProgress.js";
+import { toneColors } from "../../theme/tones.js";
+import { textLabel } from "../../utils/a11y.js";
+import { hitSlopFor } from "../../utils/hitSlop.js";
+import { absoluteFill } from "../../utils/styles.js";
+import { renderIcon } from "../core/Icon.js";
+import { Touchable } from "../core/Touchable.js";
+import { useCheckboxGroup } from "./checkboxGroupContext.js";
+import { ControlLabel } from "./ControlLabel.js";
+import { fieldAccessibility, useFieldControl } from "./fieldContext.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+const boxSize = (theme, size) => theme.components.checkbox?.size?.[size] ?? theme.sizes.icon[size] + 2;
+export const Checkbox = ({
+  ref,
+  checked,
+  defaultChecked = false,
+  onCheckedChange,
+  value,
+  label,
+  description,
+  accessibilityLabel,
+  disabled = false,
+  invalid = false,
+  size = 'md',
+  tone = 'primary',
+  style,
+  styles
+}) => {
+  const {
+    theme
+  } = useUnistyles();
+  const group = useCheckboxGroup();
+  const control = useFieldControl({
+    disabled: disabled || !!group?.disabled,
+    invalid
+  });
+  const [ownChecked, setOwnChecked] = useControllableState({
+    value: checked,
+    defaultValue: defaultChecked,
+    onChange: next => onCheckedChange?.(next === true)
+  });
+  const groupValue = group && value !== undefined ? group.values.includes(value) : undefined;
+  const state = groupValue ?? ownChecked;
+  const isActive = state !== false;
+  const progress = useToggleProgress(isActive, 'timing');
+  const dimension = boxSize(theme, size);
+  const indicatorStyle = useAnimatedStyle(() => ({
+    opacity: progress.value,
+    transform: [{
+      scale: 0.6 + 0.4 * progress.value
+    }]
+  }));
+  const toggle = () => {
+    const next = state !== true;
+    if (group && value !== undefined) {
+      group.toggle(value, next);
+      return;
+    }
+    setOwnChecked(next);
+  };
+  return /*#__PURE__*/_jsxs(Touchable, {
+    ref: ref,
+    feedback: "opacity",
+    haptic: "selection",
+    accessibilityRole: "checkbox",
+    accessibilityLabel: accessibilityLabel ?? textLabel(label),
+    accessibilityState: {
+      disabled: control.disabled,
+      checked: state === 'indeterminate' ? 'mixed' : state
+    },
+    ...fieldAccessibility(group ? null : control.field),
+    "aria-invalid": control.invalid,
+    disabled: control.disabled,
+    onPress: toggle,
+    hitSlop: hitSlopFor(dimension, dimension, theme.sizes.minTouchTarget),
+    style: [stylesheet.container, style, styles?.container],
+    children: [/*#__PURE__*/_jsx(View, {
+      style: [stylesheet.box(size, isActive, control.invalid, tone), styles?.box],
+      children: /*#__PURE__*/_jsx(Animated.View, {
+        style: [stylesheet.indicator(tone), indicatorStyle, styles?.indicator],
+        children: renderIcon(state === 'indeterminate' ? 'minus' : 'check', {
+          size: dimension - 6,
+          color: toneColors(theme, tone).on
+        })
+      })
+    }), /*#__PURE__*/_jsx(ControlLabel, {
+      label: label,
+      description: description,
+      style: styles?.content,
+      labelStyle: styles?.label,
+      descriptionStyle: styles?.description
+    })]
+  });
+};
+const borderColorFor = (theme, active, invalid, tone) => {
+  if (invalid) {
+    return theme.colors.danger;
+  }
+  return active ? toneColors(theme, tone).solid : theme.colors.borderStrong;
+};
+const stylesheet = StyleSheet.create(theme => ({
+  container: {
+    flexDirection: 'row',
+    alignItems: 'flex-start',
+    gap: theme.space(1.25)
+  },
+  box: (size, active, invalid, tone) => ({
+    width: boxSize(theme, size),
+    height: boxSize(theme, size),
+    borderRadius: theme.components.checkbox?.radius ?? theme.radius.xs,
+    borderWidth: theme.sizes.borderWidth * 1.5,
+    borderColor: borderColorFor(theme, active, invalid, tone),
+    backgroundColor: theme.colors.surface,
+    overflow: 'hidden',
+    alignItems: 'center',
+    justifyContent: 'center'
+  }),
+  indicator: tone => ({
+    ...absoluteFill,
+    alignItems: 'center',
+    justifyContent: 'center',
+    backgroundColor: toneColors(theme, tone).solid
+  })
+}));
+//# sourceMappingURL=Checkbox.js.map

package/lib/module/components/forms/Checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","Animated","useAnimatedStyle","StyleSheet","useUnistyles","useControllableState","useToggleProgress","toneColors","textLabel","hitSlopFor","absoluteFill","renderIcon","Touchable","useCheckboxGroup","ControlLabel","fieldAccessibility","useFieldControl","jsx","_jsx","jsxs","_jsxs","boxSize","theme","size","components","checkbox","sizes","icon","Checkbox","ref","checked","defaultChecked","onCheckedChange","value","label","description","accessibilityLabel","disabled","invalid","tone","style","styles","group","control","ownChecked","setOwnChecked","defaultValue","onChange","next","groupValue","undefined","values","includes","state","isActive","progress","dimension","indicatorStyle","opacity","transform","scale","toggle","feedback","haptic","accessibilityRole","accessibilityState","field","onPress","hitSlop","minTouchTarget","stylesheet","container","children","box","indicator","color","on","content","labelStyle","descriptionStyle","borderColorFor","active","colors","danger","solid","borderStrong","create","flexDirection","alignItems","gap","space","width","height","borderRadius","radius","xs","borderWidth","borderColor","backgroundColor","surface","overflow","justifyContent"],"sourceRoot":"../../../../src","sources":["components/forms/Checkbox.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/forms/CheckboxGroup.js

@@ -0,0 +1,59 @@
+"use strict";
+
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { useControllableState } from "../../hooks/useControllableState.js";
+import { groupLayout } from "./groupLayout.js";
+import { Checkbox } from "./Checkbox.js";
+import { CheckboxGroupContext } from "./checkboxGroupContext.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export const CheckboxGroup = ({
+  ref,
+  value,
+  defaultValue = [],
+  onValueChange,
+  options,
+  children,
+  orientation = 'vertical',
+  disabled = false,
+  size,
+  tone,
+  accessibilityLabel,
+  style
+}) => {
+  const [values, setValues] = useControllableState({
+    value,
+    defaultValue,
+    onChange: onValueChange
+  });
+  const toggle = (item, checked) => {
+    setValues(checked ? [...values, item] : values.filter(existing => existing !== item));
+  };
+  return /*#__PURE__*/_jsx(CheckboxGroupContext, {
+    value: {
+      values,
+      toggle,
+      disabled
+    },
+    children: /*#__PURE__*/_jsx(View, {
+      ref: ref,
+      role: "group",
+      accessibilityLabel: accessibilityLabel,
+      style: [stylesheet.container(orientation), style],
+      children: options ? options.map(option => /*#__PURE__*/_jsx(Checkbox, {
+        value: option.value,
+        label: option.label,
+        description: option.description,
+        disabled: option.disabled,
+        size: size,
+        tone: tone
+      }, option.value)) : children
+    })
+  });
+};
+const stylesheet = StyleSheet.create(theme => ({
+  container: orientation => ({
+    ...groupLayout(theme, orientation)
+  })
+}));
+//# sourceMappingURL=CheckboxGroup.js.map

package/lib/module/components/forms/CheckboxGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","StyleSheet","useControllableState","groupLayout","Checkbox","CheckboxGroupContext","jsx","_jsx","CheckboxGroup","ref","value","defaultValue","onValueChange","options","children","orientation","disabled","size","tone","accessibilityLabel","style","values","setValues","onChange","toggle","item","checked","filter","existing","role","stylesheet","container","map","option","label","description","create","theme"],"sourceRoot":"../../../../src","sources":["components/forms/CheckboxGroup.tsx"],"mappings":";;AACA,SAASA,IAAI,QAAQ,cAAc;AAEnC,SAASC,UAAU,QAAQ,wBAAwB;AACnD,SAASC,oBAAoB,QAAQ,qCAAkC;AAEvE,SAASC,WAAW,QAAQ,kBAAe;AAE3C,SAASC,QAAQ,QAAQ,eAAY;AACrC,SAASC,oBAAoB,QAAQ,2BAAwB;AAAA,SAAAC,GAAA,IAAAC,IAAA;AAwB7D,OAAO,MAAMC,aAAa,GAAGA,CAAC;EAC3BC,GAAG;EACHC,KAAK;EACLC,YAAY,GAAG,EAAE;EACjBC,aAAa;EACbC,OAAO;EACPC,QAAQ;EACRC,WAAW,GAAG,UAAU;EACxBC,QAAQ,GAAG,KAAK;EAChBC,IAAI;EACJC,IAAI;EACJC,kBAAkB;EAClBC;AACiB,CAAC,KAAK;EACvB,MAAM,CAACC,MAAM,EAAEC,SAAS,CAAC,GAAGpB,oBAAoB,CAAW;IACxDQ,KAAK;IACLC,YAAY;IACZY,QAAQ,EAAEX;EACb,CAAC,CAAC;EAEF,MAAMY,MAAM,GAAGA,CAACC,IAAY,EAAEC,OAAgB,KAAK;IAChDJ,SAAS,CAACI,OAAO,GAAG,CAAC,GAAGL,MAAM,EAAEI,IAAI,CAAC,GAAGJ,MAAM,CAACM,MAAM,CAAEC,QAAQ,IAAKA,QAAQ,KAAKH,IAAI,CAAC,CAAC;EAC1F,CAAC;EAED,oBACGlB,IAAA,CAACF,oBAAoB;IAACK,KAAK,EAAE;MAAEW,MAAM;MAAEG,MAAM;MAAER;IAAS,CAAE;IAAAF,QAAA,eACvDP,IAAA,CAACP,IAAI;MACFS,GAAG,EAAEA,GAAI;MACToB,IAAI,EAAC,OAAO;MACZV,kBAAkB,EAAEA,kBAAmB;MACvCC,KAAK,EAAE,CAACU,UAAU,CAACC,SAAS,CAAChB,WAAW,CAAC,EAAEK,KAAK,CAAE;MAAAN,QAAA,EAEjDD,OAAO,GACHA,OAAO,CAACmB,GAAG,CAAEC,MAAM,iBAChB1B,IAAA,CAACH,QAAQ;QAENM,KAAK,EAAEuB,MAAM,CAACvB,KAAM;QACpBwB,KAAK,EAAED,MAAM,CAACC,KAAM;QACpBC,WAAW,EAAEF,MAAM,CAACE,WAAY;QAChCnB,QAAQ,EAAEiB,MAAM,CAACjB,QAAS;QAC1BC,IAAI,EAAEA,IAAK;QACXC,IAAI,EAAEA;MAAK,GANNe,MAAM,CAACvB,KAOd,CACH,CAAC,GACFI;IAAQ,CACV;EAAC,CACY,CAAC;AAE7B,CAAC;AAED,MAAMgB,UAAU,GAAG7B,UAAU,CAACmC,MAAM,CAAEC,KAAK,KAAM;EAC9CN,SAAS,EAAGhB,WAA6B,KAAM;IAC5C,GAAGZ,WAAW,CAACkC,KAAK,EAAEtB,WAAW;EACpC,CAAC;AACJ,CAAC,CAAC,CAAC","ignoreList":[]}

package/lib/module/components/forms/ChipInput.js

@@ -0,0 +1,167 @@
+"use strict";
+
+import { useRef, useState } from 'react';
+import { Pressable, TextInput } from 'react-native';
+import { StyleSheet, useUnistyles } from 'react-native-unistyles';
+import { useControllableState } from "../../hooks/useControllableState.js";
+import { variantFont } from "../../utils/fonts.js";
+import { mergeRefs } from "../../utils/refs.js";
+import { inputHeight, inputState, inputSurface } from "../core/field.js";
+import { Chip } from "../display/Chip.js";
+import { fieldAccessibility, useFieldControl } from "./fieldContext.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const ChipInput = ({
+  ref,
+  value,
+  defaultValue = [],
+  onValueChange,
+  placeholder,
+  separators = [','],
+  allowDuplicates = false,
+  maxTokens,
+  validate,
+  tone = 'neutral',
+  size = 'md',
+  disabled = false,
+  invalid = false,
+  accessibilityLabel,
+  removeLabel,
+  style,
+  styles
+}) => {
+  const {
+    theme
+  } = useUnistyles();
+  const control = useFieldControl({
+    disabled,
+    invalid
+  });
+  const localRef = useRef(null);
+  const [draft, setDraft] = useState('');
+  const [focused, setFocused] = useState(false);
+  const [tokens, setTokens] = useControllableState({
+    value,
+    defaultValue,
+    onChange: onValueChange
+  });
+  const state = inputState({
+    ...control,
+    focused
+  });
+  const isFull = maxTokens !== undefined && tokens.length >= maxTokens;
+  const commit = raw => {
+    const token = raw.trim();
+    if (!token || isFull) {
+      return false;
+    }
+    if (validate && !validate(token)) {
+      return false;
+    }
+    if (!allowDuplicates && tokens.includes(token)) {
+      return false;
+    }
+    setTokens([...tokens, token]);
+    return true;
+  };
+  const handleChangeText = text => {
+    const separatorIndex = text.split('').findIndex(char => separators.includes(char));
+    if (separatorIndex === -1) {
+      setDraft(text);
+      return;
+    }
+    const parts = text.split(new RegExp(`[${separators.map(item => `\\${item}`).join('')}]`));
+    const remainder = parts.pop() ?? '';
+    const accepted = [];
+    parts.forEach(part => {
+      const token = part.trim();
+      const duplicate = !allowDuplicates && (tokens.includes(token) || accepted.includes(token));
+      const exceeds = maxTokens !== undefined && tokens.length + accepted.length >= maxTokens;
+      if (token && !duplicate && !exceeds && (!validate || validate(token))) {
+        accepted.push(token);
+      }
+    });
+    if (accepted.length > 0) {
+      setTokens([...tokens, ...accepted]);
+    }
+    setDraft(remainder);
+  };
+  const handleSubmit = () => {
+    if (commit(draft)) {
+      setDraft('');
+    }
+    localRef.current?.focus();
+  };
+  const handleKeyPress = event => {
+    if (event.nativeEvent.key === 'Backspace' && draft.length === 0 && tokens.length > 0) {
+      setTokens(tokens.slice(0, -1));
+    }
+  };
+  const handleBlur = () => {
+    setFocused(false);
+    if (commit(draft)) {
+      setDraft('');
+    }
+  };
+  return /*#__PURE__*/_jsxs(Pressable, {
+    accessible: false,
+    disabled: control.disabled,
+    onPress: () => localRef.current?.focus(),
+    style: [stylesheet.container(size, state), style, styles?.container],
+    children: [tokens.map(token => /*#__PURE__*/_jsx(Chip, {
+      tone: tone,
+      size: size === 'lg' ? 'md' : 'sm',
+      disabled: control.disabled,
+      removeLabel: removeLabel?.(token),
+      onRemove: () => setTokens(tokens.filter(item => item !== token)),
+      style: styles?.token,
+      children: token
+    }, token)), /*#__PURE__*/_jsx(TextInput, {
+      ref: mergeRefs(localRef, ref),
+      value: draft,
+      onChangeText: handleChangeText,
+      onSubmitEditing: handleSubmit,
+      onKeyPress: handleKeyPress,
+      onFocus: () => setFocused(true),
+      onBlur: handleBlur,
+      editable: !control.disabled && !isFull,
+      blurOnSubmit: false,
+      returnKeyType: "done",
+      autoCapitalize: "none",
+      autoCorrect: false,
+      placeholder: tokens.length === 0 ? placeholder : undefined,
+      placeholderTextColor: theme.colors.textDimmed,
+      selectionColor: theme.colors.primary,
+      cursorColor: theme.colors.primary,
+      accessibilityLabel: accessibilityLabel,
+      accessibilityState: {
+        disabled: control.disabled
+      },
+      ...fieldAccessibility(control.field),
+      "aria-invalid": control.invalid,
+      style: [stylesheet.input(size), styles?.input]
+    })]
+  });
+};
+const stylesheet = StyleSheet.create(theme => ({
+  container: (size, state) => ({
+    flexDirection: 'row',
+    flexWrap: 'wrap',
+    alignItems: 'center',
+    gap: theme.space(0.75),
+    minHeight: inputHeight(theme, size),
+    paddingHorizontal: theme.space(1),
+    paddingVertical: theme.space(0.75),
+    ...inputSurface(theme, state)
+  }),
+  input: size => ({
+    flexGrow: 1,
+    minWidth: 96,
+    height: theme.sizes.control.sm - 4,
+    paddingVertical: 0,
+    color: theme.colors.text,
+    fontSize: size === 'sm' ? theme.typography.variants.label.fontSize : theme.typography.variants.body.fontSize,
+    ...variantFont(theme, 'body')
+  })
+}));
+export const TokenInput = ChipInput;
+//# sourceMappingURL=ChipInput.js.map

package/lib/module/components/forms/ChipInput.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useRef","useState","Pressable","TextInput","StyleSheet","useUnistyles","useControllableState","variantFont","mergeRefs","inputHeight","inputState","inputSurface","Chip","fieldAccessibility","useFieldControl","jsx","_jsx","jsxs","_jsxs","ChipInput","ref","value","defaultValue","onValueChange","placeholder","separators","allowDuplicates","maxTokens","validate","tone","size","disabled","invalid","accessibilityLabel","removeLabel","style","styles","theme","control","localRef","draft","setDraft","focused","setFocused","tokens","setTokens","onChange","state","isFull","undefined","length","commit","raw","token","trim","includes","handleChangeText","text","separatorIndex","split","findIndex","char","parts","RegExp","map","item","join","remainder","pop","accepted","forEach","part","duplicate","exceeds","push","handleSubmit","current","focus","handleKeyPress","event","nativeEvent","key","slice","handleBlur","accessible","onPress","stylesheet","container","children","onRemove","filter","onChangeText","onSubmitEditing","onKeyPress","onFocus","onBlur","editable","blurOnSubmit","returnKeyType","autoCapitalize","autoCorrect","placeholderTextColor","colors","textDimmed","selectionColor","primary","cursorColor","accessibilityState","field","input","create","flexDirection","flexWrap","alignItems","gap","space","minHeight","paddingHorizontal","paddingVertical","flexGrow","minWidth","height","sizes","sm","color","fontSize","typography","variants","label","body","TokenInput"],"sourceRoot":"../../../../src","sources":["components/forms/ChipInput.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/forms/ControlLabel.js

@@ -0,0 +1,37 @@
+"use strict";
+
+import { View } from 'react-native';
+import { StyleSheet } from 'react-native-unistyles';
+import { Text } from "../core/Text.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const ControlLabel = ({
+  label,
+  description,
+  style,
+  labelStyle,
+  descriptionStyle
+}) => {
+  if (!label && !description) {
+    return null;
+  }
+  return /*#__PURE__*/_jsxs(View, {
+    style: [stylesheet.content, style],
+    children: [typeof label === 'string' && label ? /*#__PURE__*/_jsx(Text, {
+      variant: "body",
+      style: labelStyle,
+      children: label
+    }) : label || null, description ? /*#__PURE__*/_jsx(Text, {
+      variant: "caption",
+      tone: "muted",
+      style: descriptionStyle,
+      children: description
+    }) : null]
+  });
+};
+const stylesheet = StyleSheet.create(theme => ({
+  content: {
+    flexShrink: 1,
+    gap: theme.space(0.25)
+  }
+}));
+//# sourceMappingURL=ControlLabel.js.map

package/lib/module/components/forms/ControlLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["View","StyleSheet","Text","jsx","_jsx","jsxs","_jsxs","ControlLabel","label","description","style","labelStyle","descriptionStyle","stylesheet","content","children","variant","tone","create","theme","flexShrink","gap","space"],"sourceRoot":"../../../../src","sources":["components/forms/ControlLabel.tsx"],"mappings":";;AACA,SAASA,IAAI,QAAQ,cAAc;AAEnC,SAASC,UAAU,QAAQ,wBAAwB;AACnD,SAASC,IAAI,QAAQ,iBAAc;AAAA,SAAAC,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAUnC,OAAO,MAAMC,YAAY,GAAGA,CAAC;EAC1BC,KAAK;EACLC,WAAW;EACXC,KAAK;EACLC,UAAU;EACVC;AACgB,CAAC,KAAK;EACtB,IAAI,CAACJ,KAAK,IAAI,CAACC,WAAW,EAAE;IACzB,OAAO,IAAI;EACd;EACA,oBACGH,KAAA,CAACN,IAAI;IAACU,KAAK,EAAE,CAACG,UAAU,CAACC,OAAO,EAAEJ,KAAK,CAAE;IAAAK,QAAA,GACrC,OAAOP,KAAK,KAAK,QAAQ,IAAIA,KAAK,gBAChCJ,IAAA,CAACF,IAAI;MAACc,OAAO,EAAC,MAAM;MAACN,KAAK,EAAEC,UAAW;MAAAI,QAAA,EACnCP;IAAK,CACH,CAAC,GAEPA,KAAK,IAAI,IACX,EACAC,WAAW,gBACTL,IAAA,CAACF,IAAI;MAACc,OAAO,EAAC,SAAS;MAACC,IAAI,EAAC,OAAO;MAACP,KAAK,EAAEE,gBAAiB;MAAAG,QAAA,EACzDN;IAAW,CACT,CAAC,GACN,IAAI;EAAA,CACL,CAAC;AAEb,CAAC;AAED,MAAMI,UAAU,GAAGZ,UAAU,CAACiB,MAAM,CAAEC,KAAK,KAAM;EAC9CL,OAAO,EAAE;IACNM,UAAU,EAAE,CAAC;IACbC,GAAG,EAAEF,KAAK,CAACG,KAAK,CAAC,IAAI;EACxB;AACH,CAAC,CAAC,CAAC","ignoreList":[]}