@impulse-ui-native/primitives 2.1.0 → 2.1.1

package/dist/components/atoms/typography.js

@@ -0,0 +1,184 @@
+import { createPreset } from "../../hocs";
+const Typography = {
+  Master: createPreset(
+    (theme) => ({ fontWeight: theme.fontWeight.regular }),
+    "Master"
+  ),
+  DisplayLarge: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.bold,
+      fontSize: theme.fontSize.colossal,
+      lineHeight: theme.lineHeight.colossal
+    }),
+    "DisplayLarge"
+  ),
+  DisplayMedium: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.bold,
+      fontSize: theme.fontSize.giant,
+      lineHeight: theme.lineHeight.giant
+    }),
+    "DisplayMedium"
+  ),
+  DisplaySmall: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.semiBold,
+      fontSize: theme.fontSize.huge,
+      lineHeight: theme.lineHeight.huge
+    }),
+    "DisplaySmall"
+  ),
+  Title1: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.bold,
+      fontSize: theme.fontSize.xxxl,
+      lineHeight: theme.lineHeight.xxxl
+    }),
+    "Title1"
+  ),
+  Title2: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.bold,
+      fontSize: theme.fontSize.xxl,
+      lineHeight: theme.lineHeight.xxl
+    }),
+    "Title2"
+  ),
+  Title3: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.semiBold,
+      fontSize: theme.fontSize.xl,
+      lineHeight: theme.lineHeight.xl
+    }),
+    "Title3"
+  ),
+  Title4: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.semiBold,
+      fontSize: theme.fontSize.lg,
+      lineHeight: theme.lineHeight.lg
+    }),
+    "Title4"
+  ),
+  Title5: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.semiBold,
+      fontSize: theme.fontSize.md,
+      lineHeight: theme.lineHeight.md
+    }),
+    "Title5"
+  ),
+  Title6: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.semiBold,
+      fontSize: theme.fontSize.sm,
+      lineHeight: theme.lineHeight.sm
+    }),
+    "Title6"
+  ),
+  Subtitle1: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.medium,
+      fontSize: theme.fontSize.md,
+      lineHeight: theme.lineHeight.lg
+    }),
+    "Subtitle1"
+  ),
+  Subtitle2: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.regular,
+      fontSize: theme.fontSize.sm,
+      lineHeight: theme.lineHeight.sm
+    }),
+    "Subtitle2"
+  ),
+  BodyLarge: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.regular,
+      fontSize: theme.fontSize.md,
+      lineHeight: theme.lineHeight.lg
+    }),
+    "BodyLarge"
+  ),
+  Body: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.regular,
+      fontSize: theme.fontSize.sm,
+      lineHeight: theme.lineHeight.sm
+    }),
+    "Body"
+  ),
+  BodySmall: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.regular,
+      fontSize: theme.fontSize.xsm,
+      lineHeight: theme.lineHeight.xsm
+    }),
+    "BodySmall"
+  ),
+  Caption: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.regular,
+      fontSize: theme.fontSize.xs,
+      lineHeight: theme.lineHeight.xs
+    }),
+    "Caption"
+  ),
+  Label: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.medium,
+      fontSize: theme.fontSize.xsm,
+      lineHeight: theme.lineHeight.xsm
+    }),
+    "Label"
+  ),
+  Overline: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.semiBold,
+      fontSize: theme.fontSize.xs,
+      lineHeight: theme.lineHeight.xs,
+      textTransform: "uppercase",
+      letterSpacing: 1
+    }),
+    "Overline"
+  ),
+  Helper: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.regular,
+      fontSize: theme.fontSize.xsm,
+      lineHeight: theme.lineHeight.xsm
+    }),
+    "Helper"
+  ),
+  Code: createPreset(
+    (theme) => ({
+      fontFamily: "monospace",
+      fontSize: theme.fontSize.xsm,
+      lineHeight: theme.lineHeight.xsm
+    }),
+    "Code"
+  ),
+  Quote: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.regular,
+      fontSize: theme.fontSize.md,
+      lineHeight: theme.lineHeight.lg,
+      fontStyle: "italic"
+    }),
+    "Quote"
+  ),
+  Eyebrow: createPreset(
+    (theme) => ({
+      fontWeight: theme.fontWeight.medium,
+      fontSize: theme.fontSize.xs,
+      lineHeight: theme.lineHeight.xs,
+      textTransform: "uppercase",
+      letterSpacing: 1
+    }),
+    "Eyebrow"
+  )
+};
+export {
+  Typography
+};
+//# sourceMappingURL=typography.js.map

package/dist/components/atoms/typography.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atoms/typography.tsx"],"sourcesContent":["import { createPreset } from \"../../hocs\";\n\nexport const Typography = {\n  Master: createPreset(\n    (theme) => ({ fontWeight: theme.fontWeight.regular }),\n    \"Master\",\n  ),\n\n  DisplayLarge: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.bold,\n      fontSize: theme.fontSize.colossal,\n      lineHeight: theme.lineHeight.colossal,\n    }),\n    \"DisplayLarge\",\n  ),\n\n  DisplayMedium: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.bold,\n      fontSize: theme.fontSize.giant,\n      lineHeight: theme.lineHeight.giant,\n    }),\n    \"DisplayMedium\",\n  ),\n\n  DisplaySmall: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.semiBold,\n      fontSize: theme.fontSize.huge,\n      lineHeight: theme.lineHeight.huge,\n    }),\n    \"DisplaySmall\",\n  ),\n\n  Title1: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.bold,\n      fontSize: theme.fontSize.xxxl,\n      lineHeight: theme.lineHeight.xxxl,\n    }),\n    \"Title1\",\n  ),\n\n  Title2: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.bold,\n      fontSize: theme.fontSize.xxl,\n      lineHeight: theme.lineHeight.xxl,\n    }),\n    \"Title2\",\n  ),\n\n  Title3: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.semiBold,\n      fontSize: theme.fontSize.xl,\n      lineHeight: theme.lineHeight.xl,\n    }),\n    \"Title3\",\n  ),\n\n  Title4: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.semiBold,\n      fontSize: theme.fontSize.lg,\n      lineHeight: theme.lineHeight.lg,\n    }),\n    \"Title4\",\n  ),\n\n  Title5: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.semiBold,\n      fontSize: theme.fontSize.md,\n      lineHeight: theme.lineHeight.md,\n    }),\n    \"Title5\",\n  ),\n\n  Title6: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.semiBold,\n      fontSize: theme.fontSize.sm,\n      lineHeight: theme.lineHeight.sm,\n    }),\n    \"Title6\",\n  ),\n\n  Subtitle1: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.medium,\n      fontSize: theme.fontSize.md,\n      lineHeight: theme.lineHeight.lg,\n    }),\n    \"Subtitle1\",\n  ),\n\n  Subtitle2: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.regular,\n      fontSize: theme.fontSize.sm,\n      lineHeight: theme.lineHeight.sm,\n    }),\n    \"Subtitle2\",\n  ),\n\n  BodyLarge: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.regular,\n      fontSize: theme.fontSize.md,\n      lineHeight: theme.lineHeight.lg,\n    }),\n    \"BodyLarge\",\n  ),\n\n  Body: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.regular,\n      fontSize: theme.fontSize.sm,\n      lineHeight: theme.lineHeight.sm,\n    }),\n    \"Body\",\n  ),\n\n  BodySmall: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.regular,\n      fontSize: theme.fontSize.xsm,\n      lineHeight: theme.lineHeight.xsm,\n    }),\n    \"BodySmall\",\n  ),\n\n  Caption: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.regular,\n      fontSize: theme.fontSize.xs,\n      lineHeight: theme.lineHeight.xs,\n    }),\n    \"Caption\",\n  ),\n\n  Label: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.medium,\n      fontSize: theme.fontSize.xsm,\n      lineHeight: theme.lineHeight.xsm,\n    }),\n    \"Label\",\n  ),\n\n  Overline: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.semiBold,\n      fontSize: theme.fontSize.xs,\n      lineHeight: theme.lineHeight.xs,\n      textTransform: \"uppercase\",\n      letterSpacing: 1,\n    }),\n    \"Overline\",\n  ),\n\n  Helper: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.regular,\n      fontSize: theme.fontSize.xsm,\n      lineHeight: theme.lineHeight.xsm,\n    }),\n    \"Helper\",\n  ),\n\n  Code: createPreset(\n    (theme) => ({\n      fontFamily: \"monospace\",\n      fontSize: theme.fontSize.xsm,\n      lineHeight: theme.lineHeight.xsm,\n    }),\n    \"Code\",\n  ),\n\n  Quote: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.regular,\n      fontSize: theme.fontSize.md,\n      lineHeight: theme.lineHeight.lg,\n      fontStyle: \"italic\",\n    }),\n    \"Quote\",\n  ),\n\n  Eyebrow: createPreset(\n    (theme) => ({\n      fontWeight: theme.fontWeight.medium,\n      fontSize: theme.fontSize.xs,\n      lineHeight: theme.lineHeight.xs,\n      textTransform: \"uppercase\",\n      letterSpacing: 1,\n    }),\n    \"Eyebrow\",\n  ),\n};\n\nexport type TypographyComponent = (typeof Typography)[keyof typeof Typography];\n"],"mappings":"AAAA,SAAS,oBAAoB;AAEtB,MAAM,aAAa;AAAA,EACxB,QAAQ;AAAA,IACN,CAAC,WAAW,EAAE,YAAY,MAAM,WAAW,QAAQ;AAAA,IACnD;AAAA,EACF;AAAA,EAEA,cAAc;AAAA,IACZ,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,eAAe;AAAA,IACb,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,cAAc;AAAA,IACZ,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,WAAW;AAAA,IACT,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,WAAW;AAAA,IACT,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,WAAW;AAAA,IACT,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,MAAM;AAAA,IACJ,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,WAAW;AAAA,IACT,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,SAAS;AAAA,IACP,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,OAAO;AAAA,IACL,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,UAAU;AAAA,IACR,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,eAAe;AAAA,MACf,eAAe;AAAA,IACjB;AAAA,IACA;AAAA,EACF;AAAA,EAEA,QAAQ;AAAA,IACN,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,MAAM;AAAA,IACJ,CAAC,WAAW;AAAA,MACV,YAAY;AAAA,MACZ,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,IAC/B;AAAA,IACA;AAAA,EACF;AAAA,EAEA,OAAO;AAAA,IACL,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,WAAW;AAAA,IACb;AAAA,IACA;AAAA,EACF;AAAA,EAEA,SAAS;AAAA,IACP,CAAC,WAAW;AAAA,MACV,YAAY,MAAM,WAAW;AAAA,MAC7B,UAAU,MAAM,SAAS;AAAA,MACzB,YAAY,MAAM,WAAW;AAAA,MAC7B,eAAe;AAAA,MACf,eAAe;AAAA,IACjB;AAAA,IACA;AAAA,EACF;AACF;","names":[]}

package/dist/components/atoms/view.d.mts

@@ -0,0 +1,8 @@
+import * as react from 'react';
+import * as _impulse_ui_native_theme from '@impulse-ui-native/theme';
+import * as react_native from 'react-native';
+import { View as View$1 } from 'react-native';
+
+declare const View: react.NamedExoticComponent<react_native.ViewProps & _impulse_ui_native_theme.SpacingProps & _impulse_ui_native_theme.ColorProps & _impulse_ui_native_theme.ShadowProps & _impulse_ui_native_theme.BorderProps & _impulse_ui_native_theme.FlexProps & _impulse_ui_native_theme.DimensionProps & react.RefAttributes<View$1>>;
+
+export { View };

package/dist/components/atoms/view.js

@@ -0,0 +1,27 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef, memo, useMemo } from "react";
+import { View as NativeView, StyleSheet } from "react-native";
+import {
+  getShadowStyle,
+  useColors,
+  useStyleProps
+} from "@impulse-ui-native/theme";
+const View = memo(
+  forwardRef(function View2(props, ref) {
+    const { style, shadow, shadowPosition, ...rest } = props;
+    const colors = useColors();
+    const extractedStyleProps = useStyleProps(props);
+    const viewStyle = useMemo(() => {
+      return StyleSheet.flatten([
+        getShadowStyle(shadow, shadowPosition, colors),
+        extractedStyleProps,
+        style
+      ]);
+    }, [extractedStyleProps, style, shadow, shadowPosition, colors]);
+    return /* @__PURE__ */ jsx(NativeView, { ...rest, style: viewStyle, ref });
+  })
+);
+export {
+  View
+};
+//# sourceMappingURL=view.js.map

package/dist/components/atoms/view.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/atoms/view.tsx"],"sourcesContent":["import { forwardRef, memo, useMemo } from \"react\";\nimport { View as NativeView, StyleSheet } from \"react-native\";\n\nimport {\n  getShadowStyle,\n  useColors,\n  useStyleProps,\n} from \"@impulse-ui-native/theme\";\n\nimport { ViewProps } from \"../../types\";\n\nexport const View = memo(\n  forwardRef<NativeView, ViewProps>(function View(props: ViewProps, ref) {\n    const { style, shadow, shadowPosition, ...rest } = props;\n\n    const colors = useColors();\n    const extractedStyleProps = useStyleProps(props);\n\n    const viewStyle = useMemo(() => {\n      return StyleSheet.flatten([\n        getShadowStyle(shadow, shadowPosition, colors),\n        extractedStyleProps,\n        style,\n      ]);\n    }, [extractedStyleProps, style, shadow, shadowPosition, colors]);\n\n    return <NativeView {...rest} style={viewStyle} ref={ref} />;\n  }),\n);\n"],"mappings":"AA0BW;AA1BX,SAAS,YAAY,MAAM,eAAe;AAC1C,SAAS,QAAQ,YAAY,kBAAkB;AAE/C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAIA,MAAM,OAAO;AAAA,EAClB,WAAkC,SAASA,MAAK,OAAkB,KAAK;AACrE,UAAM,EAAE,OAAO,QAAQ,gBAAgB,GAAG,KAAK,IAAI;AAEnD,UAAM,SAAS,UAAU;AACzB,UAAM,sBAAsB,cAAc,KAAK;AAE/C,UAAM,YAAY,QAAQ,MAAM;AAC9B,aAAO,WAAW,QAAQ;AAAA,QACxB,eAAe,QAAQ,gBAAgB,MAAM;AAAA,QAC7C;AAAA,QACA;AAAA,MACF,CAAC;AAAA,IACH,GAAG,CAAC,qBAAqB,OAAO,QAAQ,gBAAgB,MAAM,CAAC;AAE/D,WAAO,oBAAC,cAAY,GAAG,MAAM,OAAO,WAAW,KAAU;AAAA,EAC3D,CAAC;AACH;","names":["View"]}

package/dist/components/controls/addon.d.mts

@@ -0,0 +1,11 @@
+import * as react from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ControlAddonProps } from '../../types/control-components.types.mjs';
+import 'react-native';
+import '@impulse-ui-native/icon/types';
+import '@impulse-ui-native/theme';
+import '../../types/button.types.mjs';
+
+declare const ControlAddon: react.MemoExoticComponent<(props: ControlAddonProps) => react_jsx_runtime.JSX.Element | null>;
+
+export { ControlAddon };

package/dist/components/controls/addon.js

@@ -0,0 +1,72 @@
+import { jsx } from "react/jsx-runtime";
+import { memo, useMemo } from "react";
+import { StyleSheet } from "react-native";
+import { Icon } from "@impulse-ui-native/icon/components/icon";
+import {
+  useComponentsTokens,
+  useThemedStyles
+} from "@impulse-ui-native/theme";
+import { Pressable, View } from "../atoms";
+import { useControlContext } from "./provider";
+const ControlAddon = memo(function ControlAddon2(props) {
+  const { icon: AddonIcon, onPress, Content, style, ...rest } = props;
+  const { disabled, error } = useControlContext();
+  const tokens = useComponentsTokens();
+  const styles = useThemedStyles(
+    themedStyles,
+    {
+      disabled,
+      error
+    },
+    [disabled, error]
+  );
+  const Container = useMemo(() => {
+    if (onPress) {
+      return Pressable;
+    }
+    return View;
+  }, [onPress]);
+  const children = useMemo(() => {
+    if (Content) {
+      return /* @__PURE__ */ jsx(Content, {});
+    }
+    if (AddonIcon) {
+      return /* @__PURE__ */ jsx(Icon, { color: styles.icon.color, icon: AddonIcon });
+    }
+    return null;
+  }, [AddonIcon, Content, styles.icon.color]);
+  const containerStyle = useMemo(
+    () => [styles.container, style],
+    [styles.container, style]
+  );
+  if (!children) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(
+    Container,
+    {
+      ...rest,
+      style: containerStyle,
+      hitSlop: tokens.controlAddon.hitSlop,
+      onPress,
+      disabled,
+      children
+    }
+  );
+});
+function themedStyles(theme, props) {
+  const { disabled, error } = props;
+  const controlAddonTokens = theme.components.controlAddon;
+  return StyleSheet.create({
+    container: {
+      marginHorizontal: controlAddonTokens.marginHorizontal
+    },
+    icon: {
+      color: disabled ? controlAddonTokens.disabledIconColor : error ? controlAddonTokens.errorIconColor : controlAddonTokens.iconColor
+    }
+  });
+}
+export {
+  ControlAddon
+};
+//# sourceMappingURL=addon.js.map

package/dist/components/controls/addon.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/controls/addon.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\n\nimport { Icon } from \"@impulse-ui-native/icon/components/icon\";\nimport {\n  AppTheme,\n  useComponentsTokens,\n  useThemedStyles,\n} from \"@impulse-ui-native/theme\";\n\nimport { ControlAddonProps } from \"../../types\";\nimport { Pressable, View } from \"../atoms\";\nimport { useControlContext } from \"./provider\";\n\nexport const ControlAddon = memo(function ControlAddon(\n  props: ControlAddonProps,\n) {\n  const { icon: AddonIcon, onPress, Content, style, ...rest } = props;\n\n  const { disabled, error } = useControlContext();\n\n  const tokens = useComponentsTokens();\n\n  const styles = useThemedStyles(\n    themedStyles,\n    {\n      disabled,\n      error,\n    },\n    [disabled, error],\n  );\n\n  const Container = useMemo(() => {\n    if (onPress) {\n      return Pressable;\n    }\n\n    return View;\n  }, [onPress]);\n\n  const children = useMemo(() => {\n    if (Content) {\n      return <Content />;\n    }\n\n    if (AddonIcon) {\n      return <Icon color={styles.icon.color} icon={AddonIcon} />;\n    }\n\n    return null;\n  }, [AddonIcon, Content, styles.icon.color]);\n\n  const containerStyle = useMemo(\n    () => [styles.container, style],\n    [styles.container, style],\n  );\n\n  if (!children) {\n    return null;\n  }\n\n  return (\n    <Container\n      {...rest}\n      style={containerStyle}\n      hitSlop={tokens.controlAddon.hitSlop}\n      onPress={onPress}\n      disabled={disabled}\n    >\n      {children}\n    </Container>\n  );\n});\n\nfunction themedStyles(\n  theme: AppTheme,\n  props: {\n    disabled?: boolean;\n    error?: string;\n  },\n) {\n  const { disabled, error } = props;\n\n  const controlAddonTokens = theme.components.controlAddon;\n\n  return StyleSheet.create({\n    container: {\n      marginHorizontal: controlAddonTokens.marginHorizontal,\n    },\n\n    icon: {\n      color: disabled\n        ? controlAddonTokens.disabledIconColor\n        : error\n          ? controlAddonTokens.errorIconColor\n          : controlAddonTokens.iconColor,\n    },\n  });\n}\n"],"mappings":"AA0Ca;AA1Cb,SAAS,MAAM,eAAe;AAC9B,SAAS,kBAAkB;AAE3B,SAAS,YAAY;AACrB;AAAA,EAEE;AAAA,EACA;AAAA,OACK;AAGP,SAAS,WAAW,YAAY;AAChC,SAAS,yBAAyB;AAE3B,MAAM,eAAe,KAAK,SAASA,cACxC,OACA;AACA,QAAM,EAAE,MAAM,WAAW,SAAS,SAAS,OAAO,GAAG,KAAK,IAAI;AAE9D,QAAM,EAAE,UAAU,MAAM,IAAI,kBAAkB;AAE9C,QAAM,SAAS,oBAAoB;AAEnC,QAAM,SAAS;AAAA,IACb;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,UAAU,KAAK;AAAA,EAClB;AAEA,QAAM,YAAY,QAAQ,MAAM;AAC9B,QAAI,SAAS;AACX,aAAO;AAAA,IACT;AAEA,WAAO;AAAA,EACT,GAAG,CAAC,OAAO,CAAC;AAEZ,QAAM,WAAW,QAAQ,MAAM;AAC7B,QAAI,SAAS;AACX,aAAO,oBAAC,WAAQ;AAAA,IAClB;AAEA,QAAI,WAAW;AACb,aAAO,oBAAC,QAAK,OAAO,OAAO,KAAK,OAAO,MAAM,WAAW;AAAA,IAC1D;AAEA,WAAO;AAAA,EACT,GAAG,CAAC,WAAW,SAAS,OAAO,KAAK,KAAK,CAAC;AAE1C,QAAM,iBAAiB;AAAA,IACrB,MAAM,CAAC,OAAO,WAAW,KAAK;AAAA,IAC9B,CAAC,OAAO,WAAW,KAAK;AAAA,EAC1B;AAEA,MAAI,CAAC,UAAU;AACb,WAAO;AAAA,EACT;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,OAAO;AAAA,MACP,SAAS,OAAO,aAAa;AAAA,MAC7B;AAAA,MACA;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ,CAAC;AAED,SAAS,aACP,OACA,OAIA;AACA,QAAM,EAAE,UAAU,MAAM,IAAI;AAE5B,QAAM,qBAAqB,MAAM,WAAW;AAE5C,SAAO,WAAW,OAAO;AAAA,IACvB,WAAW;AAAA,MACT,kBAAkB,mBAAmB;AAAA,IACvC;AAAA,IAEA,MAAM;AAAA,MACJ,OAAO,WACH,mBAAmB,oBACnB,QACE,mBAAmB,iBACnB,mBAAmB;AAAA,IAC3B;AAAA,EACF,CAAC;AACH;","names":["ControlAddon"]}

package/dist/components/controls/container.d.mts

@@ -0,0 +1,11 @@
+import * as react from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ControlContainerProps } from '../../types/control-components.types.mjs';
+import 'react-native';
+import '@impulse-ui-native/icon/types';
+import '@impulse-ui-native/theme';
+import '../../types/button.types.mjs';
+
+declare const ControlContainer: react.MemoExoticComponent<(props: ControlContainerProps) => react_jsx_runtime.JSX.Element>;
+
+export { ControlContainer };

package/dist/components/controls/container.js

@@ -0,0 +1,54 @@
+import { jsx } from "react/jsx-runtime";
+import { memo, useMemo } from "react";
+import { StyleSheet } from "react-native";
+import {
+  useThemedStyles
+} from "@impulse-ui-native/theme";
+import { View } from "../atoms/view";
+import { useControlContext } from "./provider";
+const ControlContainer = memo(function ControlContainer2(props) {
+  const { style, ...rest } = props;
+  const { size, variant, disabled, error } = useControlContext();
+  const styles = useThemedStyles(
+    themedStyles,
+    {
+      size,
+      variant,
+      disabled,
+      error
+    },
+    [size, variant, disabled, error]
+  );
+  const containerStyle = useMemo(
+    () => [styles.inputContainer, style],
+    [styles.inputContainer, style]
+  );
+  return /* @__PURE__ */ jsx(View, { style: containerStyle, ...rest });
+});
+function themedStyles(theme, {
+  size,
+  variant,
+  disabled,
+  error
+}) {
+  const controlContainerTokens = theme.components.controlContainer;
+  const sizeTokens = controlContainerTokens.sizes[size];
+  const variantTokens = controlContainerTokens.variants[variant];
+  return StyleSheet.create({
+    inputContainer: {
+      flexDirection: "row",
+      alignItems: "center",
+      height: sizeTokens.height,
+      paddingHorizontal: sizeTokens.paddingHorizontal,
+      borderRadius: controlContainerTokens.borderRadius,
+      borderWidth: controlContainerTokens.borderWidth,
+      opacity: disabled ? controlContainerTokens.disabledOpacity : 1,
+      backgroundColor: disabled ? variantTokens.disabledBackgroundColor : variantTokens.backgroundColor,
+      borderColor: error ? variantTokens.errorBorderColor : disabled ? variantTokens.disabledBorderColor : variantTokens.borderColor
+    }
+  });
+}
+export {
+  ControlContainer
+};
+//# sourceMappingURL=container.js.map

package/dist/components/controls/container.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/controls/container.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\n\nimport {\n  AppTheme,\n  ComponentSize,\n  ComponentVariant,\n  useThemedStyles,\n} from \"@impulse-ui-native/theme\";\n\nimport { ControlContainerProps } from \"../../types\";\nimport { View } from \"../atoms/view\";\nimport { useControlContext } from \"./provider\";\n\nexport const ControlContainer = memo(function ControlContainer(\n  props: ControlContainerProps,\n) {\n  const { style, ...rest } = props;\n\n  const { size, variant, disabled, error } = useControlContext();\n\n  const styles = useThemedStyles(\n    themedStyles,\n    {\n      size,\n      variant,\n      disabled,\n      error,\n    },\n    [size, variant, disabled, error],\n  );\n\n  const containerStyle = useMemo(\n    () => [styles.inputContainer, style],\n    [styles.inputContainer, style],\n  );\n\n  return <View style={containerStyle} {...rest} />;\n});\n\nfunction themedStyles(\n  theme: AppTheme,\n  {\n    size,\n    variant,\n    disabled,\n    error,\n  }: {\n    size: ComponentSize;\n    variant: ComponentVariant;\n    disabled?: boolean;\n    error?: string;\n  },\n) {\n  const controlContainerTokens = theme.components.controlContainer;\n  const sizeTokens = controlContainerTokens.sizes[size];\n  const variantTokens = controlContainerTokens.variants[variant];\n\n  return StyleSheet.create({\n    inputContainer: {\n      flexDirection: \"row\",\n      alignItems: \"center\",\n\n      height: sizeTokens.height,\n      paddingHorizontal: sizeTokens.paddingHorizontal,\n\n      borderRadius: controlContainerTokens.borderRadius,\n      borderWidth: controlContainerTokens.borderWidth,\n\n      opacity: disabled ? controlContainerTokens.disabledOpacity : 1,\n\n      backgroundColor: disabled\n        ? variantTokens.disabledBackgroundColor\n        : variantTokens.backgroundColor,\n\n      borderColor: error\n        ? variantTokens.errorBorderColor\n        : disabled\n          ? variantTokens.disabledBorderColor\n          : variantTokens.borderColor,\n    },\n  });\n}\n"],"mappings":"AAqCS;AArCT,SAAS,MAAM,eAAe;AAC9B,SAAS,kBAAkB;AAE3B;AAAA,EAIE;AAAA,OACK;AAGP,SAAS,YAAY;AACrB,SAAS,yBAAyB;AAE3B,MAAM,mBAAmB,KAAK,SAASA,kBAC5C,OACA;AACA,QAAM,EAAE,OAAO,GAAG,KAAK,IAAI;AAE3B,QAAM,EAAE,MAAM,SAAS,UAAU,MAAM,IAAI,kBAAkB;AAE7D,QAAM,SAAS;AAAA,IACb;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,MAAM,SAAS,UAAU,KAAK;AAAA,EACjC;AAEA,QAAM,iBAAiB;AAAA,IACrB,MAAM,CAAC,OAAO,gBAAgB,KAAK;AAAA,IACnC,CAAC,OAAO,gBAAgB,KAAK;AAAA,EAC/B;AAEA,SAAO,oBAAC,QAAK,OAAO,gBAAiB,GAAG,MAAM;AAChD,CAAC;AAED,SAAS,aACP,OACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMA;AACA,QAAM,yBAAyB,MAAM,WAAW;AAChD,QAAM,aAAa,uBAAuB,MAAM,IAAI;AACpD,QAAM,gBAAgB,uBAAuB,SAAS,OAAO;AAE7D,SAAO,WAAW,OAAO;AAAA,IACvB,gBAAgB;AAAA,MACd,eAAe;AAAA,MACf,YAAY;AAAA,MAEZ,QAAQ,WAAW;AAAA,MACnB,mBAAmB,WAAW;AAAA,MAE9B,cAAc,uBAAuB;AAAA,MACrC,aAAa,uBAAuB;AAAA,MAEpC,SAAS,WAAW,uBAAuB,kBAAkB;AAAA,MAE7D,iBAAiB,WACb,cAAc,0BACd,cAAc;AAAA,MAElB,aAAa,QACT,cAAc,mBACd,WACE,cAAc,sBACd,cAAc;AAAA,IACtB;AAAA,EACF,CAAC;AACH;","names":["ControlContainer"]}

package/dist/components/controls/control.d.mts

@@ -0,0 +1,23 @@
+import * as react from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ViewProps } from '../../types/view.types.mjs';
+import { ControlContainerProps, ControlContextData, ControlLabelProps, ControlErrorLabelProps, ControlAddonProps, ControlInputProps, ControlPlaceholderProps, ControlValueProps } from '../../types/control-components.types.mjs';
+import 'react-native';
+import '@impulse-ui-native/theme';
+import '@impulse-ui-native/icon/types';
+import '../../types/button.types.mjs';
+
+declare const Control: {
+    Container: react.MemoExoticComponent<(props: ControlContainerProps) => react_jsx_runtime.JSX.Element>;
+    Provider: react.MemoExoticComponent<(props: react.PropsWithChildren<ControlContextData>) => react_jsx_runtime.JSX.Element>;
+    Root: react.MemoExoticComponent<(props: ViewProps) => react_jsx_runtime.JSX.Element>;
+    Label: react.MemoExoticComponent<(props: ControlLabelProps) => react_jsx_runtime.JSX.Element | null>;
+    Error: react.MemoExoticComponent<(props: ControlErrorLabelProps) => react_jsx_runtime.JSX.Element | null>;
+    Addon: react.MemoExoticComponent<(props: ControlAddonProps) => react_jsx_runtime.JSX.Element | null>;
+    Input: react.MemoExoticComponent<(props: ControlInputProps) => react_jsx_runtime.JSX.Element>;
+    Placeholder: react.MemoExoticComponent<(props: ControlPlaceholderProps) => react_jsx_runtime.JSX.Element>;
+    Value: react.MemoExoticComponent<(props: ControlValueProps) => react_jsx_runtime.JSX.Element>;
+    Loader: react.MemoExoticComponent<() => react_jsx_runtime.JSX.Element>;
+};
+
+export { Control };

package/dist/components/controls/control.js

@@ -0,0 +1,26 @@
+import { ControlAddon } from "./addon";
+import { ControlContainer } from "./container";
+import { ControlError } from "./error";
+import { ControlInput } from "./input";
+import { ControlLabel } from "./label";
+import { ControlLoader } from "./loader";
+import { ControlPlaceholder } from "./placeholder";
+import { ControlProvider } from "./provider";
+import { ControlRoot } from "./root";
+import { ControlValue } from "./value";
+const Control = {
+  Container: ControlContainer,
+  Provider: ControlProvider,
+  Root: ControlRoot,
+  Label: ControlLabel,
+  Error: ControlError,
+  Addon: ControlAddon,
+  Input: ControlInput,
+  Placeholder: ControlPlaceholder,
+  Value: ControlValue,
+  Loader: ControlLoader
+};
+export {
+  Control
+};
+//# sourceMappingURL=control.js.map

package/dist/components/controls/control.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/controls/control.tsx"],"sourcesContent":["import { ControlAddon } from \"./addon\";\nimport { ControlContainer } from \"./container\";\nimport { ControlError } from \"./error\";\nimport { ControlInput } from \"./input\";\nimport { ControlLabel } from \"./label\";\nimport { ControlLoader } from \"./loader\";\nimport { ControlPlaceholder } from \"./placeholder\";\nimport { ControlProvider } from \"./provider\";\nimport { ControlRoot } from \"./root\";\nimport { ControlValue } from \"./value\";\n\nexport const Control = {\n  Container: ControlContainer,\n  Provider: ControlProvider,\n  Root: ControlRoot,\n  Label: ControlLabel,\n  Error: ControlError,\n  Addon: ControlAddon,\n  Input: ControlInput,\n  Placeholder: ControlPlaceholder,\n  Value: ControlValue,\n  Loader: ControlLoader,\n};\n"],"mappings":"AAAA,SAAS,oBAAoB;AAC7B,SAAS,wBAAwB;AACjC,SAAS,oBAAoB;AAC7B,SAAS,oBAAoB;AAC7B,SAAS,oBAAoB;AAC7B,SAAS,qBAAqB;AAC9B,SAAS,0BAA0B;AACnC,SAAS,uBAAuB;AAChC,SAAS,mBAAmB;AAC5B,SAAS,oBAAoB;AAEtB,MAAM,UAAU;AAAA,EACrB,WAAW;AAAA,EACX,UAAU;AAAA,EACV,MAAM;AAAA,EACN,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AAAA,EACP,aAAa;AAAA,EACb,OAAO;AAAA,EACP,QAAQ;AACV;","names":[]}

package/dist/components/controls/error.d.mts

@@ -0,0 +1,11 @@
+import * as react from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ControlErrorLabelProps } from '../../types/control-components.types.mjs';
+import 'react-native';
+import '@impulse-ui-native/icon/types';
+import '@impulse-ui-native/theme';
+import '../../types/button.types.mjs';
+
+declare const ControlError: react.MemoExoticComponent<(props: ControlErrorLabelProps) => react_jsx_runtime.JSX.Element | null>;
+
+export { ControlError };

package/dist/components/controls/error.js

@@ -0,0 +1,33 @@
+import { jsx } from "react/jsx-runtime";
+import { memo, useMemo } from "react";
+import { StyleSheet } from "react-native";
+import { useThemedStyles } from "@impulse-ui-native/theme";
+import { Typography } from "../atoms";
+import { useControlContext } from "./provider";
+const ControlError = memo(function ControlError2(props) {
+  const { style, ...rest } = props;
+  const { error } = useControlContext();
+  const styles = useThemedStyles(themedStyles);
+  const errorStyle = useMemo(
+    () => [styles.error, style],
+    [styles.error, style]
+  );
+  if (!Boolean(error)) {
+    return null;
+  }
+  return /* @__PURE__ */ jsx(Typography.Caption, { ...rest, style: errorStyle, children: error });
+});
+function themedStyles(theme) {
+  const controlErrorTokens = theme.components.controlError;
+  return StyleSheet.create({
+    error: {
+      marginTop: controlErrorTokens.marginTop,
+      color: controlErrorTokens.color,
+      fontSize: controlErrorTokens.fontSize
+    }
+  });
+}
+export {
+  ControlError
+};
+//# sourceMappingURL=error.js.map

package/dist/components/controls/error.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/controls/error.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\nimport { StyleSheet } from \"react-native\";\n\nimport { AppTheme, useThemedStyles } from \"@impulse-ui-native/theme\";\n\nimport { ControlErrorLabelProps } from \"../../types\";\nimport { Typography } from \"../atoms\";\nimport { useControlContext } from \"./provider\";\n\nexport const ControlError = memo(function ControlError(\n  props: ControlErrorLabelProps,\n) {\n  const { style, ...rest } = props;\n\n  const { error } = useControlContext();\n\n  const styles = useThemedStyles(themedStyles);\n\n  const errorStyle = useMemo(\n    () => [styles.error, style],\n    [styles.error, style],\n  );\n\n  if (!Boolean(error)) {\n    return null;\n  }\n\n  return (\n    <Typography.Caption {...rest} style={errorStyle}>\n      {error}\n    </Typography.Caption>\n  );\n});\n\nfunction themedStyles(theme: AppTheme) {\n  const controlErrorTokens = theme.components.controlError;\n\n  return StyleSheet.create({\n    error: {\n      marginTop: controlErrorTokens.marginTop,\n      color: controlErrorTokens.color,\n      fontSize: controlErrorTokens.fontSize,\n    },\n  });\n}\n"],"mappings":"AA4BI;AA5BJ,SAAS,MAAM,eAAe;AAC9B,SAAS,kBAAkB;AAE3B,SAAmB,uBAAuB;AAG1C,SAAS,kBAAkB;AAC3B,SAAS,yBAAyB;AAE3B,MAAM,eAAe,KAAK,SAASA,cACxC,OACA;AACA,QAAM,EAAE,OAAO,GAAG,KAAK,IAAI;AAE3B,QAAM,EAAE,MAAM,IAAI,kBAAkB;AAEpC,QAAM,SAAS,gBAAgB,YAAY;AAE3C,QAAM,aAAa;AAAA,IACjB,MAAM,CAAC,OAAO,OAAO,KAAK;AAAA,IAC1B,CAAC,OAAO,OAAO,KAAK;AAAA,EACtB;AAEA,MAAI,CAAC,QAAQ,KAAK,GAAG;AACnB,WAAO;AAAA,EACT;AAEA,SACE,oBAAC,WAAW,SAAX,EAAoB,GAAG,MAAM,OAAO,YAClC,iBACH;AAEJ,CAAC;AAED,SAAS,aAAa,OAAiB;AACrC,QAAM,qBAAqB,MAAM,WAAW;AAE5C,SAAO,WAAW,OAAO;AAAA,IACvB,OAAO;AAAA,MACL,WAAW,mBAAmB;AAAA,MAC9B,OAAO,mBAAmB;AAAA,MAC1B,UAAU,mBAAmB;AAAA,IAC/B;AAAA,EACF,CAAC;AACH;","names":["ControlError"]}

package/dist/components/controls/index.d.mts

@@ -0,0 +1,10 @@
+export { Control } from './control.mjs';
+export { useControlContext } from './provider.mjs';
+import 'react';
+import 'react/jsx-runtime';
+import '../../types/view.types.mjs';
+import 'react-native';
+import '@impulse-ui-native/theme';
+import '../../types/control-components.types.mjs';
+import '@impulse-ui-native/icon/types';
+import '../../types/button.types.mjs';

package/dist/components/controls/index.js

@@ -0,0 +1,7 @@
+import { Control } from "./control";
+import { useControlContext } from "./provider";
+export {
+  Control,
+  useControlContext
+};
+//# sourceMappingURL=index.js.map

package/dist/components/controls/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/controls/index.ts"],"sourcesContent":["export { Control } from \"./control\";\nexport { useControlContext } from \"./provider\";\n"],"mappings":"AAAA,SAAS,eAAe;AACxB,SAAS,yBAAyB;","names":[]}

package/dist/components/controls/input.d.mts

@@ -0,0 +1,11 @@
+import * as react from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ControlInputProps } from '../../types/control-components.types.mjs';
+import 'react-native';
+import '@impulse-ui-native/icon/types';
+import '@impulse-ui-native/theme';
+import '../../types/button.types.mjs';
+
+declare const ControlInput: react.MemoExoticComponent<(props: ControlInputProps) => react_jsx_runtime.JSX.Element>;
+
+export { ControlInput };

package/dist/components/controls/input.js

@@ -0,0 +1,63 @@
+import { jsx } from "react/jsx-runtime";
+import { memo, useMemo } from "react";
+import { StyleSheet, TextInput } from "react-native";
+import {
+  useThemedStyles
+} from "@impulse-ui-native/theme";
+import { useControlContext } from "./provider";
+const ControlInput = memo(function ControlInput2(props) {
+  const { onPress, style, ...rest } = props;
+  const { size, variant, disabled, error } = useControlContext();
+  const styles = useThemedStyles(
+    themedStyles,
+    {
+      size,
+      variant,
+      disabled,
+      error
+    },
+    [size, variant, disabled, error]
+  );
+  const inputStyles = useMemo(
+    () => [styles.input, style],
+    [styles.input, style]
+  );
+  return /* @__PURE__ */ jsx(
+    TextInput,
+    {
+      ...rest,
+      style: inputStyles,
+      placeholderTextColor: styles.placeholder.color,
+      editable: !disabled
+    }
+  );
+});
+function themedStyles(theme, {
+  size,
+  variant,
+  disabled,
+  error
+}) {
+  const controlInputTokens = theme.components.controlInput;
+  const sizeTokens = controlInputTokens.sizes[size];
+  const variantTokens = controlInputTokens.variants[variant];
+  const color = disabled ? variantTokens.disabledColor : error ? variantTokens.errorColor : variantTokens.color;
+  const placeholderColor = disabled ? variantTokens.disabledPlaceholderColor : error ? variantTokens.errorPlaceholderColor : variantTokens.placeholderColor;
+  return StyleSheet.create({
+    input: {
+      flex: controlInputTokens.flex,
+      color,
+      fontSize: sizeTokens.fontSize,
+      fontFamily: controlInputTokens.fontFamily,
+      paddingHorizontal: controlInputTokens.paddingHorizontal,
+      height: "100%"
+    },
+    placeholder: {
+      color: placeholderColor
+    }
+  });
+}
+export {
+  ControlInput
+};
+//# sourceMappingURL=input.js.map

package/dist/components/controls/input.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/controls/input.tsx"],"sourcesContent":["import { memo, useMemo } from \"react\";\nimport { StyleSheet, TextInput } from \"react-native\";\n\nimport {\n  AppTheme,\n  ComponentSize,\n  ComponentVariant,\n  useThemedStyles,\n} from \"@impulse-ui-native/theme\";\n\nimport { ControlInputProps } from \"../../types\";\nimport { useControlContext } from \"./provider\";\n\nexport const ControlInput = memo(function ControlInput(\n  props: ControlInputProps,\n) {\n  const { onPress, style, ...rest } = props;\n\n  const { size, variant, disabled, error } = useControlContext();\n\n  const styles = useThemedStyles(\n    themedStyles,\n    {\n      size,\n      variant,\n      disabled,\n      error,\n    },\n    [size, variant, disabled, error],\n  );\n\n  const inputStyles = useMemo(\n    () => [styles.input, style],\n    [styles.input, style],\n  );\n\n  return (\n    <TextInput\n      {...rest}\n      style={inputStyles}\n      placeholderTextColor={styles.placeholder.color}\n      editable={!disabled}\n    />\n  );\n});\n\nfunction themedStyles(\n  theme: AppTheme,\n  {\n    size,\n    variant,\n    disabled,\n    error,\n  }: {\n    size: ComponentSize;\n    variant: ComponentVariant;\n    disabled?: boolean;\n    error?: string;\n  },\n) {\n  const controlInputTokens = theme.components.controlInput;\n  const sizeTokens = controlInputTokens.sizes[size];\n  const variantTokens = controlInputTokens.variants[variant];\n\n  const color = disabled\n    ? variantTokens.disabledColor\n    : error\n      ? variantTokens.errorColor\n      : variantTokens.color;\n\n  const placeholderColor = disabled\n    ? variantTokens.disabledPlaceholderColor\n    : error\n      ? variantTokens.errorPlaceholderColor\n      : variantTokens.placeholderColor;\n\n  return StyleSheet.create({\n    input: {\n      flex: controlInputTokens.flex,\n      color,\n      fontSize: sizeTokens.fontSize,\n      fontFamily: controlInputTokens.fontFamily,\n      paddingHorizontal: controlInputTokens.paddingHorizontal,\n      height: \"100%\",\n    },\n\n    placeholder: {\n      color: placeholderColor,\n    },\n  });\n}\n"],"mappings":"AAqCI;AArCJ,SAAS,MAAM,eAAe;AAC9B,SAAS,YAAY,iBAAiB;AAEtC;AAAA,EAIE;AAAA,OACK;AAGP,SAAS,yBAAyB;AAE3B,MAAM,eAAe,KAAK,SAASA,cACxC,OACA;AACA,QAAM,EAAE,SAAS,OAAO,GAAG,KAAK,IAAI;AAEpC,QAAM,EAAE,MAAM,SAAS,UAAU,MAAM,IAAI,kBAAkB;AAE7D,QAAM,SAAS;AAAA,IACb;AAAA,IACA;AAAA,MACE;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,MAAM,SAAS,UAAU,KAAK;AAAA,EACjC;AAEA,QAAM,cAAc;AAAA,IAClB,MAAM,CAAC,OAAO,OAAO,KAAK;AAAA,IAC1B,CAAC,OAAO,OAAO,KAAK;AAAA,EACtB;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,OAAO;AAAA,MACP,sBAAsB,OAAO,YAAY;AAAA,MACzC,UAAU,CAAC;AAAA;AAAA,EACb;AAEJ,CAAC;AAED,SAAS,aACP,OACA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,GAMA;AACA,QAAM,qBAAqB,MAAM,WAAW;AAC5C,QAAM,aAAa,mBAAmB,MAAM,IAAI;AAChD,QAAM,gBAAgB,mBAAmB,SAAS,OAAO;AAEzD,QAAM,QAAQ,WACV,cAAc,gBACd,QACE,cAAc,aACd,cAAc;AAEpB,QAAM,mBAAmB,WACrB,cAAc,2BACd,QACE,cAAc,wBACd,cAAc;AAEpB,SAAO,WAAW,OAAO;AAAA,IACvB,OAAO;AAAA,MACL,MAAM,mBAAmB;AAAA,MACzB;AAAA,MACA,UAAU,WAAW;AAAA,MACrB,YAAY,mBAAmB;AAAA,MAC/B,mBAAmB,mBAAmB;AAAA,MACtC,QAAQ;AAAA,IACV;AAAA,IAEA,aAAa;AAAA,MACX,OAAO;AAAA,IACT;AAAA,EACF,CAAC;AACH;","names":["ControlInput"]}

package/dist/components/controls/label.d.mts

@@ -0,0 +1,11 @@
+import * as react from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { ControlLabelProps } from '../../types/control-components.types.mjs';
+import 'react-native';
+import '@impulse-ui-native/icon/types';
+import '@impulse-ui-native/theme';
+import '../../types/button.types.mjs';
+
+declare const ControlLabel: react.MemoExoticComponent<(props: ControlLabelProps) => react_jsx_runtime.JSX.Element | null>;
+
+export { ControlLabel };