@app-studio/components 0.10.17

package/dist/native/components/Input/FieldContent/FieldContent.d.ts

@@ -0,0 +1,9 @@
+/**
+ * FieldContent Component
+ *
+ * Renders the content area of a form field with various styles and states
+ * according to the design guidelines.
+ */
+import React from 'react';
+import { ContentProps } from './FieldContent/FieldContent.props';
+export declare const FieldContent: React.FC<ContentProps>;

package/dist/native/components/Input/FieldContent/FieldContent.js

@@ -0,0 +1,25 @@
+/**
+ * FieldContent Component
+ *
+ * Renders the content area of a form field with various styles and states
+ * according to the design guidelines.
+ */
+import React from 'react';
+import { Typography, useTheme } from 'app-studio';
+import { InputVariants, PadddingWithLabel, PaddingWithoutLabel, Shapes, } from '../Input.style';
+import { Horizontal } from 'app-studio';
+export const FieldContent = ({ label, shadow, children, value, size = 'md', shape = 'default', variant = 'default', error = false, showLabel = false, isFocused = false, isHovered = false, isDisabled = false, isReadOnly = false, views = { pickerBox: {} }, ...props }) => {
+    const { themeMode } = useTheme();
+    const isDark = themeMode === 'dark';
+    // Determine if the field is in an interactive state
+    const isInteractive = (isHovered || isFocused) && !isDisabled;
+    const color = error
+        ? 'color-red-500'
+        : isInteractive
+            ? 'theme-primary'
+            : 'color-gray-200';
+    return (<Horizontal gap={8} width="100%" display="flex" flexWrap="nowrap" alignItems="center" justifyContent="flex-start" borderStyle="solid" borderColor={color} backgroundColor={isDark ? 'color-gray-900' : 'color-white'} fontSize={Typography.fontSizes[size]} cursor={isDisabled ? 'not-allowed' : isReadOnly ? 'auto' : 'text'} opacity={isDisabled ? 0.7 : 1} transition="border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease" {...(showLabel ? PadddingWithLabel : PaddingWithoutLabel)} {...(typeof shadow === 'object' && shadow !== null ? shadow : {})} {...Shapes[shape]} {...InputVariants[variant]} {...views?.container} {...props}>
+      {children}
+    </Horizontal>);
+};
+//# sourceMappingURL=FieldContent.js.map

package/dist/native/components/Input/FieldContent/FieldContent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldContent.js","sourceRoot":"","sources":["../../../../../src/components/Input/FieldContent/FieldContent.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAElD,OAAO,EACL,aAAa,EACb,iBAAiB,EACjB,mBAAmB,EACnB,MAAM,GACP,MAAM,gBAAgB,CAAC;AACxB,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAIxC,MAAM,CAAC,MAAM,YAAY,GAA2B,CAAC,EACnD,KAAK,EACL,MAAM,EACN,QAAQ,EACR,KAAK,EACL,IAAI,GAAG,IAAI,EACX,KAAK,GAAG,SAAS,EACjB,OAAO,GAAG,SAAS,EACnB,KAAK,GAAG,KAAK,EACb,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,KAAK,EACjB,SAAS,GAAG,KAAK,EACjB,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,KAAK,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE,EACzB,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,EAAE,SAAS,EAAE,GAAG,QAAQ,EAAE,CAAC;IACjC,MAAM,MAAM,GAAG,SAAS,KAAK,MAAM,CAAC;IAEpC,oDAAoD;IACpD,MAAM,aAAa,GAAG,CAAC,SAAS,IAAI,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC;IAC9D,MAAM,KAAK,GAAG,KAAK;QACjB,CAAC,CAAC,eAAe;QACjB,CAAC,CAAC,aAAa;YACf,CAAC,CAAC,eAAe;YACjB,CAAC,CAAC,gBAAgB,CAAC;IAErB,OAAO,CACL,CAAC,UAAU,CACT,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,KAAK,CAAC,MAAM,CACZ,OAAO,CAAC,MAAM,CACd,QAAQ,CAAC,QAAQ,CACjB,UAAU,CAAC,QAAQ,CACnB,cAAc,CAAC,YAAY,CAC3B,WAAW,CAAC,OAAO,CACnB,WAAW,CAAC,CAAC,KAAK,CAAC,CACnB,eAAe,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,aAAa,CAAC,CAC3D,QAAQ,CAAC,CAAC,UAAU,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CACrC,MAAM,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,CAClE,OAAO,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,CAC9B,UAAU,CAAC,6FAA6F,CACxG,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAAC,CAC1D,IAAI,CAAC,OAAO,MAAM,KAAK,QAAQ,IAAI,MAAM,KAAK,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAClE,IAAI,MAAM,CAAC,KAAK,CAAC,CAAC,CAClB,IAAI,aAAa,CAAC,OAAO,CAAC,CAAC,CAC3B,IAAI,KAAK,EAAE,SAAS,CAAC,CACrB,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,QAAQ,CACX;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC"}

package/dist/native/components/Input/FieldIcons/FieldIcons/FieldIcons.props.d.ts

@@ -0,0 +1,3 @@
+import { ImageProps } from 'app-studio';
+export interface FieldIconsProps extends Omit<ImageProps, 'size'> {
+}

package/dist/native/components/Input/FieldIcons/FieldIcons/FieldIcons.props.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=FieldIcons.props.js.map

package/dist/native/components/Input/FieldIcons/FieldIcons/FieldIcons.props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldIcons.props.js","sourceRoot":"","sources":["../../../../../../src/components/Input/FieldIcons/FieldIcons/FieldIcons.props.ts"],"names":[],"mappings":""}

package/dist/native/components/Input/FieldIcons/FieldIcons.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { FieldIconsProps } from './FieldIcons/FieldIcons.props';
+export declare const FieldIcons: React.FC<FieldIconsProps>;

package/dist/native/components/Input/FieldIcons/FieldIcons.js

@@ -0,0 +1,6 @@
+import React from 'react';
+import { Horizontal } from 'app-studio';
+export const FieldIcons = ({ children, ...props }) => (<Horizontal gap={10} right={10} zIndex={500} flexWrap="nowrap" alignItems="center" justifyContent="flex-end" {...props}>
+    {children}
+  </Horizontal>);
+//# sourceMappingURL=FieldIcons.js.map

package/dist/native/components/Input/FieldIcons/FieldIcons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldIcons.js","sourceRoot":"","sources":["../../../../../src/components/Input/FieldIcons/FieldIcons.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAIxC,MAAM,CAAC,MAAM,UAAU,GAA8B,CAAC,EACpD,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,EAAE,CAAC,CACJ,CAAC,UAAU,CACT,GAAG,CAAC,CAAC,EAAE,CAAC,CACR,KAAK,CAAC,CAAC,EAAE,CAAC,CACV,MAAM,CAAC,CAAC,GAAG,CAAC,CACZ,QAAQ,CAAC,QAAQ,CACjB,UAAU,CAAC,QAAQ,CACnB,cAAc,CAAC,UAAU,CACzB,IAAI,KAAK,CAAC,CAEV;IAAA,CAAC,QAAQ,CACX;EAAA,EAAE,UAAU,CAAC,CACd,CAAC"}

package/dist/native/components/Input/FieldLabel/FieldLabel/FieldLabel.props.d.ts

@@ -0,0 +1,31 @@
+import React from 'react';
+import { Size } from '../../Input.type';
+import { ViewProps } from 'app-studio';
+export interface LabelProps extends Omit<ViewProps, 'size'> {
+    /**
+     * The content to be rendered inside the Label.
+     */
+    children?: React.ReactNode;
+    /**
+     * Indicates whether the field has an error.
+     */
+    error?: boolean;
+    /**
+     * The size of the Label
+     */
+    size?: Size;
+    /**
+     * The color of the Label
+     */
+    color?: string;
+    /**
+     * CSS styles applied to the Label
+     */
+    views?: {
+        label?: ViewProps;
+    };
+    /**
+     * Helper text rendered below the label (hint / error / explanation).
+     */
+    helperText?: React.ReactNode;
+}

package/dist/native/components/Input/FieldLabel/FieldLabel/FieldLabel.props.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=FieldLabel.props.js.map

package/dist/native/components/Input/FieldLabel/FieldLabel/FieldLabel.props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLabel.props.js","sourceRoot":"","sources":["../../../../../../src/components/Input/FieldLabel/FieldLabel/FieldLabel.props.ts"],"names":[],"mappings":""}

package/dist/native/components/Input/FieldLabel/FieldLabel.d.ts

@@ -0,0 +1,9 @@
+/**
+ * FieldLabel Component
+ *
+ * Renders a label for a form field with various styles and states
+ * according to the design guidelines.
+ */
+import React from 'react';
+import { LabelProps } from './FieldLabel/FieldLabel.props';
+export declare const FieldLabel: React.FC<LabelProps>;

package/dist/native/components/Input/FieldLabel/FieldLabel.js

@@ -0,0 +1,13 @@
+/**
+ * FieldLabel Component
+ *
+ * Renders a label for a form field with various styles and states
+ * according to the design guidelines.
+ */
+import React from 'react';
+import { Label } from '../../Form/Label/Label';
+import { LabelSizes } from '../Input.style';
+export const FieldLabel = ({ children, size = 'md', error = false, color = 'theme-primary', views = { label: {} }, helperText, ...props }) => (<Label position="static" fontSize={LabelSizes[size]} letterSpacing="-0.01em" whiteSpace="nowrap" fontWeight={500} opacity={error ? 1 : 0.72} color={error ? 'color-red-500' : 'inherit'} transition="color 0.2s ease" {...views['label']} {...props}>
+    {children}
+  </Label>);
+//# sourceMappingURL=FieldLabel.js.map

package/dist/native/components/Input/FieldLabel/FieldLabel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLabel.js","sourceRoot":"","sources":["../../../../../src/components/Input/FieldLabel/FieldLabel.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAC;AAE/C,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAI5C,MAAM,CAAC,MAAM,UAAU,GAAyB,CAAC,EAC/C,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,KAAK,GAAG,KAAK,EACb,KAAK,GAAG,eAAe,EACvB,KAAK,GAAG,EAAE,KAAK,EAAE,EAAE,EAAE,EACrB,UAAU,EACV,GAAG,KAAK,EACT,EAAE,EAAE,CAAC,CACJ,CAAC,KAAK,CACJ,QAAQ,CAAC,QAAQ,CACjB,QAAQ,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC,CAC3B,aAAa,CAAC,SAAS,CACvB,UAAU,CAAC,QAAQ,CACnB,UAAU,CAAC,CAAC,GAAG,CAAC,CAChB,OAAO,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAC1B,KAAK,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,SAAS,CAAC,CAC3C,UAAU,CAAC,iBAAiB,CAC5B,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,CACnB,IAAI,KAAK,CAAC,CAEV;IAAA,CAAC,QAAQ,CACX;EAAA,EAAE,KAAK,CAAC,CACT,CAAC"}

package/dist/native/components/Input/FieldLayout/FieldLayout/FieldLayout.props.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { Size, TextFieldStyles } from '../../Input.type';
+import { ViewProps } from 'app-studio';
+export interface FieldProps extends Omit<ViewProps, 'size'> {
+    /**
+     * The content to be rendered inside the Field.
+     */
+    children?: React.ReactNode;
+    /**
+     * The size of the field (default: "md").
+     */
+    size?: Size;
+    /**
+     * Determines if the field is disabled (default: false).
+     */
+    isDisabled?: boolean;
+    /**
+     * Determines if the field is read-only (default: false).
+     */
+    isReadOnly?: boolean;
+    /**
+     * CSS styles applied to the field (default: {}).
+     */
+    views?: TextFieldStyles;
+}

package/dist/native/components/Input/FieldLayout/FieldLayout/FieldLayout.props.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=FieldLayout.props.js.map

package/dist/native/components/Input/FieldLayout/FieldLayout/FieldLayout.props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLayout.props.js","sourceRoot":"","sources":["../../../../../../src/components/Input/FieldLayout/FieldLayout/FieldLayout.props.ts"],"names":[],"mappings":""}

package/dist/native/components/Input/FieldLayout/FieldLayout.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { FieldProps } from './FieldLayout/FieldLayout.props';
+export declare const FieldLayout: React.FC<FieldProps>;

package/dist/native/components/Input/FieldLayout/FieldLayout.js

@@ -0,0 +1,7 @@
+import React from 'react';
+import { Typography } from 'app-studio';
+import { Vertical } from 'app-studio';
+export const FieldLayout = ({ children, size = 'md', isDisabled = false, isReadOnly = false, views = { text: {} }, ...props }) => (<Vertical gap={2} margin={0} padding={0} width="100%" height="100%" border="none" position="relative" fontSize={Typography.fontSizes[size]} color={isDisabled ? 'theme-text-disable' : 'theme-text-normal'} cursor={isDisabled ? 'not-allowed' : isReadOnly ? 'auto' : 'pointer'} style={{ backgroundColor: 'transparent' }} {...views['text']} {...props}>
+    {children}
+  </Vertical>);
+//# sourceMappingURL=FieldLayout.js.map

package/dist/native/components/Input/FieldLayout/FieldLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldLayout.js","sourceRoot":"","sources":["../../../../../src/components/Input/FieldLayout/FieldLayout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,MAAM,YAAY,CAAC;AAExC,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAItC,MAAM,CAAC,MAAM,WAAW,GAAyB,CAAC,EAChD,QAAQ,EACR,IAAI,GAAG,IAAI,EACX,UAAU,GAAG,KAAK,EAClB,UAAU,GAAG,KAAK,EAClB,KAAK,GAAG,EAAE,IAAI,EAAE,EAAE,EAAE,EACpB,GAAG,KAAK,EACT,EAAE,EAAE,CAAC,CACJ,CAAC,QAAQ,CACP,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,MAAM,CAAC,CAAC,CAAC,CAAC,CACV,OAAO,CAAC,CAAC,CAAC,CAAC,CACX,KAAK,CAAC,MAAM,CACZ,MAAM,CAAC,MAAM,CACb,MAAM,CAAC,MAAM,CACb,QAAQ,CAAC,UAAU,CACnB,QAAQ,CAAC,CAAC,UAAU,CAAC,SAAS,CAAC,IAAI,CAAC,CAAC,CACrC,KAAK,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,mBAAmB,CAAC,CAC/D,MAAM,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC,CACrE,KAAK,CAAC,CAAC,EAAE,eAAe,EAAE,aAAa,EAAE,CAAC,CAC1C,IAAI,KAAK,CAAC,MAAM,CAAC,CAAC,CAClB,IAAI,KAAK,CAAC,CAEV;IAAA,CAAC,QAAQ,CACX;EAAA,EAAE,QAAQ,CAAC,CACZ,CAAC"}

package/dist/native/components/Input/FieldWrapper/FieldWrapper.d.ts

@@ -0,0 +1,9 @@
+/**
+ * FieldWrapper Component
+ *
+ * Renders a wrapper for form field content with appropriate styling
+ * according to the design guidelines.
+ */
+import React from 'react';
+import { WrapperFieldProps } from './FieldWrapper.props';
+export declare const FieldWrapper: React.FC<WrapperFieldProps>;

package/dist/native/components/Input/FieldWrapper/FieldWrapper.js

@@ -0,0 +1,12 @@
+/**
+ * FieldWrapper Component
+ *
+ * Renders a wrapper for form field content with appropriate styling
+ * according to the design guidelines.
+ */
+import React from 'react';
+import { Vertical } from 'app-studio';
+export const FieldWrapper = ({ children, ...props }) => (<Vertical display="flex" flexDirection="column" gap={4} flex={1} width="100%" maxWidth="100%" {...props}>
+    {children}
+  </Vertical>);
+//# sourceMappingURL=FieldWrapper.js.map

package/dist/native/components/Input/FieldWrapper/FieldWrapper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldWrapper.js","sourceRoot":"","sources":["../../../../../src/components/Input/FieldWrapper/FieldWrapper.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAItC,MAAM,CAAC,MAAM,YAAY,GAAgC,CAAC,EACxD,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,EAAE,CAAC,CACJ,CAAC,QAAQ,CACP,OAAO,CAAC,MAAM,CACd,aAAa,CAAC,QAAQ,CACtB,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,IAAI,CAAC,CAAC,CAAC,CAAC,CACR,KAAK,CAAC,MAAM,CACZ,QAAQ,CAAC,MAAM,CACf,IAAI,KAAK,CAAC,CAEV;IAAA,CAAC,QAAQ,CACX;EAAA,EAAE,QAAQ,CAAC,CACZ,CAAC"}

package/dist/native/components/Input/FieldWrapper/FieldWrapper.props.d.ts

@@ -0,0 +1,3 @@
+import { ViewProps } from 'app-studio';
+export interface WrapperFieldProps extends ViewProps {
+}

package/dist/native/components/Input/FieldWrapper/FieldWrapper.props.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=FieldWrapper.props.js.map

package/dist/native/components/Input/FieldWrapper/FieldWrapper.props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FieldWrapper.props.js","sourceRoot":"","sources":["../../../../../src/components/Input/FieldWrapper/FieldWrapper.props.ts"],"names":[],"mappings":""}

package/dist/native/components/Input/HelperText/HelperText.d.ts

@@ -0,0 +1,9 @@
+/**
+ * HelperText Component
+ *
+ * Renders helper text for form fields with appropriate styling
+ * according to the design guidelines.
+ */
+import React from 'react';
+import { HelperTextProps } from './HelperText.props';
+export declare const HelperText: React.FC<HelperTextProps>;

package/dist/native/components/Input/HelperText/HelperText.js

@@ -0,0 +1,12 @@
+/**
+ * HelperText Component
+ *
+ * Renders helper text for form fields with appropriate styling
+ * according to the design guidelines.
+ */
+import React from 'react';
+import { Text } from 'app-studio';
+export const HelperText = ({ children, views = { helperText: {} }, ...props }) => (<Text fontSize="11px" fontWeight="400" letterSpacing="-0.01em" lineHeight="16px" marginVertical={0} marginHorizontal={0} color="color-gray-500" transition="color 0.2s ease, opacity 0.2s ease" {...views['helperText']} {...props}>
+    {children}
+  </Text>);
+//# sourceMappingURL=HelperText.js.map

package/dist/native/components/Input/HelperText/HelperText.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HelperText.js","sourceRoot":"","sources":["../../../../../src/components/Input/HelperText/HelperText.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AAEH,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAIlC,MAAM,CAAC,MAAM,UAAU,GAA8B,CAAC,EACpD,QAAQ,EACR,KAAK,GAAG,EAAE,UAAU,EAAE,EAAE,EAAE,EAC1B,GAAG,KAAK,EACT,EAAE,EAAE,CAAC,CACJ,CAAC,IAAI,CACH,QAAQ,CAAC,MAAM,CACf,UAAU,CAAC,KAAK,CAChB,aAAa,CAAC,SAAS,CACvB,UAAU,CAAC,MAAM,CACjB,cAAc,CAAC,CAAC,CAAC,CAAC,CAClB,gBAAgB,CAAC,CAAC,CAAC,CAAC,CACpB,KAAK,CAAC,gBAAgB,CACtB,UAAU,CAAC,oCAAoC,CAC/C,IAAK,KAAK,CAAC,YAAY,CAAS,CAAC,CACjC,IAAI,KAAK,CAAC,CAEV;IAAA,CAAC,QAAQ,CACX;EAAA,EAAE,IAAI,CAAC,CACR,CAAC"}

package/dist/native/components/Input/HelperText/HelperText.props.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { TextFieldStyles } from '../Input.type';
+import { ViewProps } from 'app-studio';
+export interface HelperTextProps extends ViewProps {
+    /**
+     * The content to be rendered inside the HelperText.
+     */
+    children: React.ReactNode;
+    /**
+     * If true, changes the input style to indicate error.
+     */
+    error?: boolean;
+    /**
+     * CSS styles applied to the HelperText.
+     */
+    views?: TextFieldStyles;
+}

package/dist/native/components/Input/HelperText/HelperText.props.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=HelperText.props.js.map

package/dist/native/components/Input/HelperText/HelperText.props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"HelperText.props.js","sourceRoot":"","sources":["../../../../../src/components/Input/HelperText/HelperText.props.ts"],"names":[],"mappings":""}

package/dist/native/components/Input/Input.style.d.ts

@@ -0,0 +1,62 @@
+/**
+ * Input Styles
+ *
+ * Defines the styles for input components following the design guidelines:
+ * - Typography: Inter/Geist font, specific sizes/weights
+ * - Spacing: 4px grid system
+ * - Colors: Neutral palette with semantic colors
+ * - Rounded corners: Consistent border radius
+ * - Transitions: Subtle animations
+ */
+import { ViewProps } from 'app-studio';
+import { Shape, Size, Variant } from './Input.type';
+/**
+ * Shape styles for input components with consistent border radius
+ */
+export declare const Shapes: Record<Shape, ViewProps>;
+/**
+ * Label sizes following the 4px grid system
+ */
+export declare const LabelSizes: Record<Size, string>;
+/**
+ * Input variants with consistent styling
+ * Design tokens:
+ * - Transitions: 200ms ease-out for smooth, natural feel
+ * - Focus ring: 3px offset with 15% opacity primary color
+ * - Hover: Subtle background tint for better affordance
+ */
+export declare const InputVariants: Record<Variant, ViewProps>;
+/**
+ * Padding for input shells following the gallery form treatment.
+ */
+export declare const PadddingWithLabel: {
+    paddingTop: string;
+    paddingBottom: string;
+    paddingLeft: string;
+    paddingRight: string;
+    media: {
+        mobile: {
+            paddingTop: string;
+            paddingBottom: string;
+            paddingLeft: string;
+            paddingRight: string;
+        };
+    };
+};
+/**
+ * Padding for input shells without a label.
+ */
+export declare const PaddingWithoutLabel: {
+    paddingTop: string;
+    paddingBottom: string;
+    paddingLeft: string;
+    paddingRight: string;
+    media: {
+        mobile: {
+            paddingTop: string;
+            paddingBottom: string;
+            paddingLeft: string;
+            paddingRight: string;
+        };
+    };
+};

package/dist/native/components/Input/Input.style.js

@@ -0,0 +1,130 @@
+/**
+ * Input Styles
+ *
+ * Defines the styles for input components following the design guidelines:
+ * - Typography: Inter/Geist font, specific sizes/weights
+ * - Spacing: 4px grid system
+ * - Colors: Neutral palette with semantic colors
+ * - Rounded corners: Consistent border radius
+ * - Transitions: Subtle animations
+ */
+/**
+ * Shape styles for input components with consistent border radius
+ */
+export const Shapes = {
+    default: {
+        borderRadius: '8px', // Consistent with design system (rounded-md)
+    },
+    square: {
+        borderRadius: 0,
+    },
+    rounded: {
+        borderRadius: '8px', // Consistent with design system (rounded-md)
+    },
+    pill: {
+        borderRadius: '9999px', // Full rounded for pill shape
+    },
+};
+/**
+ * Label sizes following the 4px grid system
+ */
+export const LabelSizes = {
+    xs: '10px',
+    sm: '11px',
+    md: '11px',
+    lg: '12px',
+    xl: '12px',
+};
+/**
+ * Input variants with consistent styling
+ * Design tokens:
+ * - Transitions: 200ms ease-out for smooth, natural feel
+ * - Focus ring: 3px offset with 15% opacity primary color
+ * - Hover: Subtle background tint for better affordance
+ */
+export const InputVariants = {
+    outline: {
+        borderWidth: '1px',
+        borderStyle: 'solid',
+        borderColor: 'color-gray-200',
+        backgroundColor: 'transparent',
+        color: 'inherit',
+        transition: 'border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease',
+        _hover: {
+            borderColor: 'color-gray-300',
+        },
+        _focus: {
+            borderColor: 'theme-primary',
+            outline: 'none',
+            boxShadow: '0 0 0 3px theme-primary',
+        },
+        _focusVisible: {
+            borderColor: 'theme-primary',
+            outline: 'none',
+            boxShadow: '0 0 0 3px theme-primary',
+        },
+    },
+    default: {
+        borderWidth: '1px',
+        borderStyle: 'solid',
+        borderColor: 'color-gray-200',
+        borderRadius: '8px',
+        backgroundColor: 'transparent',
+        color: 'inherit',
+        transition: 'border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease',
+        _hover: {
+            borderColor: 'color-gray-300',
+        },
+        _focus: {
+            borderColor: 'theme-primary',
+            outline: 'none',
+            boxShadow: '0 0 0 3px theme-primary',
+        },
+        _focusVisible: {
+            borderColor: 'theme-primary',
+            outline: 'none',
+            boxShadow: '0 0 0 3px theme-primary',
+        },
+    },
+    none: {
+        border: 'none',
+        style: { backgroundColor: 'transparent' },
+        color: 'inherit',
+        transition: 'background-color 0.2s ease',
+    },
+};
+/**
+ * Padding for input shells following the gallery form treatment.
+ */
+export const PadddingWithLabel = {
+    paddingTop: '10px',
+    paddingBottom: '10px',
+    paddingLeft: '12px',
+    paddingRight: '12px',
+    media: {
+        mobile: {
+            paddingTop: '10px',
+            paddingBottom: '10px',
+            paddingLeft: '12px',
+            paddingRight: '12px',
+        },
+    },
+};
+/**
+ * Padding for input shells without a label.
+ */
+export const PaddingWithoutLabel = {
+    paddingTop: '10px',
+    paddingBottom: '10px',
+    paddingLeft: '12px',
+    paddingRight: '12px',
+    media: {
+        mobile: {
+            paddingTop: '10px',
+            paddingBottom: '10px',
+            paddingLeft: '12px',
+            paddingRight: '12px',
+        },
+    },
+};
+//# sourceMappingURL=Input.style.js.map

package/dist/native/components/Input/Input.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.style.js","sourceRoot":"","sources":["../../../../src/components/Input/Input.style.ts"],"names":[],"mappings":"AAAA;;;;;;;;;GASG;AAKH;;GAEG;AACH,MAAM,CAAC,MAAM,MAAM,GAA6B;IAC9C,OAAO,EAAE;QACP,YAAY,EAAE,KAAK,EAAE,6CAA6C;KACnE;IACD,MAAM,EAAE;QACN,YAAY,EAAE,CAAC;KAChB;IACD,OAAO,EAAE;QACP,YAAY,EAAE,KAAK,EAAE,6CAA6C;KACnE;IACD,IAAI,EAAE;QACJ,YAAY,EAAE,QAAQ,EAAE,8BAA8B;KACvD;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,UAAU,GAAyB;IAC9C,EAAE,EAAE,MAAM;IACV,EAAE,EAAE,MAAM;IACV,EAAE,EAAE,MAAM;IACV,EAAE,EAAE,MAAM;IACV,EAAE,EAAE,MAAM;CACX,CAAC;AAEF;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,aAAa,GAA+B;IACvD,OAAO,EAAE;QACP,WAAW,EAAE,KAAK;QAClB,WAAW,EAAE,OAAO;QACpB,WAAW,EAAE,gBAAgB;QAC7B,eAAe,EAAE,aAAa;QAC9B,KAAK,EAAE,SAAS;QAChB,UAAU,EACR,0EAA0E;QAC5E,MAAM,EAAE;YACN,WAAW,EAAE,gBAAgB;SAC9B;QACD,MAAM,EAAE;YACN,WAAW,EAAE,eAAe;YAC5B,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,yBAAyB;SACrC;QACD,aAAa,EAAE;YACb,WAAW,EAAE,eAAe;YAC5B,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,yBAAyB;SACrC;KACF;IACD,OAAO,EAAE;QACP,WAAW,EAAE,KAAK;QAClB,WAAW,EAAE,OAAO;QACpB,WAAW,EAAE,gBAAgB;QAC7B,YAAY,EAAE,KAAK;QACnB,eAAe,EAAE,aAAa;QAC9B,KAAK,EAAE,SAAS;QAChB,UAAU,EACR,0EAA0E;QAC5E,MAAM,EAAE;YACN,WAAW,EAAE,gBAAgB;SAC9B;QACD,MAAM,EAAE;YACN,WAAW,EAAE,eAAe;YAC5B,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,yBAAyB;SACrC;QACD,aAAa,EAAE;YACb,WAAW,EAAE,eAAe;YAC5B,OAAO,EAAE,MAAM;YACf,SAAS,EAAE,yBAAyB;SACrC;KACF;IACD,IAAI,EAAE;QACJ,MAAM,EAAE,MAAM;QACd,KAAK,EAAE,EAAE,eAAe,EAAE,aAAa,EAAE;QACzC,KAAK,EAAE,SAAS;QAChB,UAAU,EAAE,4BAA4B;KACzC;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG;IAC/B,UAAU,EAAE,MAAM;IAClB,aAAa,EAAE,MAAM;IACrB,WAAW,EAAE,MAAM;IACnB,YAAY,EAAE,MAAM;IACpB,KAAK,EAAE;QACL,MAAM,EAAE;YACN,UAAU,EAAE,MAAM;YAClB,aAAa,EAAE,MAAM;YACrB,WAAW,EAAE,MAAM;YACnB,YAAY,EAAE,MAAM;SACrB;KACF;CACF,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,mBAAmB,GAAG;IACjC,UAAU,EAAE,MAAM;IAClB,aAAa,EAAE,MAAM;IACrB,WAAW,EAAE,MAAM;IACnB,YAAY,EAAE,MAAM;IACpB,KAAK,EAAE;QACL,MAAM,EAAE;YACN,UAAU,EAAE,MAAM;YAClB,aAAa,EAAE,MAAM;YACrB,WAAW,EAAE,MAAM;YACnB,YAAY,EAAE,MAAM;SACrB;KACF;CACF,CAAC"}

package/dist/native/components/Input/Input.type.d.ts

@@ -0,0 +1,13 @@
+import { ViewProps } from 'app-studio';
+export type Variant = 'outline' | 'default' | 'none';
+export type Shape = 'default' | 'square' | 'rounded' | 'pill';
+export type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export type TextFieldStyles = {
+    text?: ViewProps;
+    label?: ViewProps;
+    error?: ViewProps;
+    helperText?: ViewProps;
+    container?: ViewProps;
+};
+export type Wrap = 'wrap' | 'nowrap' | 'wrap-reverse';
+export type Justify = 'flex-start' | 'center' | 'flex-end' | 'space-between' | 'space-around' | 'space-evenly';

package/dist/native/components/Input/Input.type.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Input.type.js.map

package/dist/native/components/Input/Input.type.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Input.type.js","sourceRoot":"","sources":["../../../../src/components/Input/Input.type.ts"],"names":[],"mappings":""}

package/dist/native/components/Input/index.d.ts

@@ -0,0 +1,7 @@
+export * from './FieldContainer/FieldContainer';
+export * from './FieldContent/FieldContent';
+export * from './FieldIcons/FieldIcons';
+export * from './FieldLabel/FieldLabel';
+export * from './FieldLayout/FieldLayout';
+export * from './FieldWrapper/FieldWrapper';
+export * from './HelperText/HelperText';

package/dist/native/components/Input/index.js

@@ -0,0 +1,8 @@
+export * from './FieldContainer/FieldContainer';
+export * from './FieldContent/FieldContent';
+export * from './FieldIcons/FieldIcons';
+export * from './FieldLabel/FieldLabel';
+export * from './FieldLayout/FieldLayout';
+export * from './FieldWrapper/FieldWrapper';
+export * from './HelperText/HelperText';
+//# sourceMappingURL=index.js.map

package/dist/native/components/Input/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Input/index.ts"],"names":[],"mappings":"AAAA,cAAc,iCAAiC,CAAC;AAChD,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC;AACxC,cAAc,yBAAyB,CAAC;AACxC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,6BAA6B,CAAC;AAC5C,cAAc,yBAAyB,CAAC"}

package/dist/native/components/Link/Link/Link.props.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+import { Size, Styles, TextDecorationStyle } from './Link.type';
+import { ViewProps } from 'app-studio';
+export interface LinkProps extends Omit<ViewProps, 'size'> {
+    children: React.ReactNode;
+    underline?: TextDecorationStyle;
+    isExternal?: boolean;
+    iconSize?: Size;
+    to: string;
+    views?: Styles;
+}
+export interface LinkViewProps extends LinkProps {
+    isHovered: boolean;
+    setIsHovered: Function;
+}

package/dist/native/components/Link/Link/Link.props.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=Link.props.js.map

package/dist/native/components/Link/Link/Link.props.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Link.props.js","sourceRoot":"","sources":["../../../../../src/components/Link/Link/Link.props.ts"],"names":[],"mappings":""}

package/dist/native/components/Link/Link/Link.state.d.ts

@@ -0,0 +1,4 @@
+export declare const useLinkState: () => {
+    isHovered: boolean;
+    setIsHovered: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+};

package/dist/native/components/Link/Link/Link.state.js

@@ -0,0 +1,7 @@
+import { useState } from 'react';
+// This function initializes the Link component's state using the useState hook and exposes its state and setter function.
+export const useLinkState = () => {
+    const [isHovered, setIsHovered] = useState(false);
+    return { isHovered, setIsHovered };
+};
+//# sourceMappingURL=Link.state.js.map

package/dist/native/components/Link/Link/Link.state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Link.state.js","sourceRoot":"","sources":["../../../../../src/components/Link/Link/Link.state.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,0HAA0H;AAC1H,MAAM,CAAC,MAAM,YAAY,GAAG,GAAG,EAAE;IAC/B,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IAClD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;AACrC,CAAC,CAAC"}

package/dist/native/components/Link/Link/Link.style.d.ts

@@ -0,0 +1,7 @@
+import { ViewProps } from 'app-studio';
+import { Size } from './Link.type';
+export declare const IconSizes: Record<Size, number>;
+/**
+ * Link base styles matching shadcn/ui patterns
+ */
+export declare const LinkBaseStyles: ViewProps;

package/dist/native/components/Link/Link/Link.style.js

@@ -0,0 +1,29 @@
+// Defines a mapping of various size names (from 'xs' to '6xl') to their respective numeric icon sizes, providing a scalable way to reference icon sizes throughout the component.
+export const IconSizes = {
+    xs: 12,
+    sm: 14,
+    md: 16,
+    lg: 18,
+    xl: 20,
+};
+/**
+ * Link base styles matching shadcn/ui patterns
+ */
+export const LinkBaseStyles = {
+    textDecoration: 'underline',
+    textUnderlineOffset: '2px',
+    textDecorationThickness: '1px',
+    transition: 'all 0.15s ease-in-out',
+    _hover: {
+        opacity: 0.8,
+    },
+    _focus: {
+        outline: 'none',
+        opacity: 0.8,
+    },
+    _focusVisible: {
+        boxShadow: '0 0 0 2px white, 0 0 0 4px theme-primary',
+        borderRadius: 4, // radius-xs
+    },
+};
+//# sourceMappingURL=Link.style.js.map

package/dist/native/components/Link/Link/Link.style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Link.style.js","sourceRoot":"","sources":["../../../../../src/components/Link/Link/Link.style.ts"],"names":[],"mappings":"AAGA,kLAAkL;AAClL,MAAM,CAAC,MAAM,SAAS,GAAyB;IAC7C,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;CACP,CAAC;AAEF;;GAEG;AACH,MAAM,CAAC,MAAM,cAAc,GAAc;IACvC,cAAc,EAAE,WAAW;IAC3B,mBAAmB,EAAE,KAAK;IAC1B,uBAAuB,EAAE,KAAK;IAC9B,UAAU,EAAE,uBAAuB;IACnC,MAAM,EAAE;QACN,OAAO,EAAE,GAAG;KACb;IACD,MAAM,EAAE;QACN,OAAO,EAAE,MAAM;QACf,OAAO,EAAE,GAAG;KACb;IACD,aAAa,EAAE;QACb,SAAS,EAAE,0CAA0C;QACrD,YAAY,EAAE,CAAC,EAAE,YAAY;KAC9B;CACF,CAAC"}

package/dist/native/components/Link/Link/Link.view.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { LinkViewProps } from './Link.props';
+declare const LinkView: React.ForwardRefExoticComponent<LinkViewProps & React.RefAttributes<HTMLAnchorElement>>;
+export default LinkView;