@app-studio/components 0.10.17

package/dist/native/components/Slider/Slider/Slider.view.js

@@ -0,0 +1,144 @@
+import React from 'react';
+import { View, Text, Center, Vertical, Horizontal } from 'app-studio';
+import { HelperText } from '../../Input/HelperText/HelperText';
+import { SliderSizes, SliderShapes, SliderVariants, ThumbSizes, EnhancedSliderSizes, OrientationStyles, } from './Slider.style';
+const isRawCssColor = (value) => typeof value === 'string' &&
+    (/^(#|rgb\(|rgba\(|hsl\(|hsla\(|var\()/.test(value) ||
+        ['black', 'currentColor', 'inherit', 'transparent', 'white'].includes(value));
+const colorStyleProp = (property, value) => isRawCssColor(value)
+    ? { style: { [property]: value } }
+    : { [property]: value };
+// Defines the SliderView functional component, which renders the visual representation of the slider, memoized for performance to prevent unnecessary re-renders.
+export const SliderView = React.memo(({ min = 0, max = 100, step = 1, currentValue, stepValues, shape = 'rounded', size = 'md', variant = 'default', orientation = 'horizontal', isDisabled = false, showValue = false, showTooltip = false, backgroundColor = 'theme-primary', label, helperText, themeMode: elementMode, shadow = {}, isDragging, isHovered, setIsHovered, trackRef, thumbRef, handleThumbMouseDown, handleTrackMouseDown, handleKeyDown, thumbPositionPercent, ariaLabel = 'Slider', views = {
+    container: {},
+    track: {},
+    progress: {},
+    filledTrack: {},
+    thumb: {},
+    label: {},
+    valueLabel: {},
+    stepMarks: {},
+    tooltip: {},
+}, onChange, onDrag, value, defaultValue, ...props }) => {
+    // Assigns the `backgroundColor` prop to `themeColor` for consistent styling across different parts of the slider.
+    const themeColor = backgroundColor;
+    // Defines a standard color to be used when the slider is in a disabled state.
+    const disabledColor = 'theme-disabled';
+    // Determines the default background color of the slider track based on the selected `variant` from `SliderVariants`.
+    const trackColor = SliderVariants[variant].backgroundColor;
+    // Sets the color for the active or filled portion of the track, defaulting to `disabledColor` if the slider is `isDisabled`.
+    const activeTrackColor = isDisabled ? disabledColor : themeColor;
+    // A boolean flag indicating whether the slider's `orientation` is set to 'vertical', influencing layout and styling.
+    const isVertical = orientation === 'vertical';
+    // Calculates the track's cross-axis size and the thumb's size based on the slider's `size` property, with fallbacks to default values.
+    const { trackCrossAxisSize, thumbSize } = EnhancedSliderSizes[size] || {
+        trackCrossAxisSize: SliderSizes[size].height,
+        thumbSize: ThumbSizes[size].width || 16,
+    };
+    // Defines the JSX structure for a 'legacy' slider view, typically used for horizontal sliders without advanced tooltip functionality.
+    const legacyView = (<Vertical width="100%" gap={8} {...views.container} {...props}>
+        {label && (<Horizontal justifyContent="space-between" alignItems="center">
+            <Text fontSize={14} fontWeight={500} {...views.label}>
+              {label}
+            </Text>
+            {showValue && (<Text fontSize={14} color="color-gray-500" {...views.valueLabel}>
+                {currentValue}
+              </Text>)}
+          </Horizontal>)}
+        <View ref={trackRef} position="relative" cursor={isDisabled ? 'not-allowed' : 'pointer'} opacity={isDisabled ? 0.6 : 1} onMouseDown={handleTrackMouseDown} onMouseEnter={() => setIsHovered(true)} onMouseLeave={() => setIsHovered(false)} {...SliderSizes[size]} borderRadius={SliderShapes[shape]} backgroundColor={trackColor} {...SliderVariants[variant]} {...shadow} {...views.track}>
+          
+          {stepValues && stepValues.length > 0 && (<>
+              {stepValues.map((stepValue) => {
+                const stepPercentage = ((stepValue - min) / (max - min)) * 100;
+                return (<View key={stepValue} position="absolute" top="50%" left={`${stepPercentage}%`} transform="translate(-50%, -50%)" width={4} height={4} borderRadius="50%" zIndex={1} {...colorStyleProp('backgroundColor', activeTrackColor)} {...views.stepMarks}/>);
+            })}
+            </>)}
+          
+          <View position="absolute" top={0} left={0} height="100%" width={`${thumbPositionPercent}%`} borderRadius={SliderShapes[shape]} transition="width 0.1s ease-in-out" {...colorStyleProp('backgroundColor', activeTrackColor)} {...views.progress} {...views.filledTrack}/>
+          
+          <View ref={thumbRef} role="slider" tabIndex={isDisabled ? -1 : 0} aria-valuemin={min} aria-valuemax={max} aria-valuenow={currentValue} aria-orientation={orientation} aria-disabled={isDisabled} aria-label={ariaLabel} position="absolute" top="50%" left={`${thumbPositionPercent}%`} borderRadius="50%" backgroundColor="color-white" boxShadow="0 2px 4px rgba(0, 0, 0, 0.2)" borderWidth={2} borderStyle="solid" transition={isDragging ? 'none' : 'transform 0.1s ease-in-out'} {...colorStyleProp('borderColor', activeTrackColor)} transform={isHovered
+            ? 'translate(-50%, -50%) scale(1.1)'
+            : 'translate(-50%, -50%)'} zIndex={2} onMouseDown={handleThumbMouseDown} onTouchStart={handleThumbMouseDown} onKeyDown={handleKeyDown} {...ThumbSizes[size]} {...views.thumb}>
+            
+            {showTooltip && (isHovered || isDragging) && (<View position="absolute" bottom="100%" left="50%" transform="translateX(-50%)" marginBottom={8} padding="4px 8px" backgroundColor="color-black" color="color-white" borderRadius={4} fontSize={12} whiteSpace="nowrap" zIndex={3} {...views.tooltip}>
+                <Text {...views.tooltip?.text}>
+                  {currentValue?.toFixed(step < 1 ? 1 : 0)}
+                </Text>
+              </View>)}
+          </View>
+        </View>
+        {helperText && <HelperText>{helperText}</HelperText>}
+      </Vertical>);
+    const enhancedView = (<Center {...OrientationStyles[orientation]} position="relative" onMouseEnter={() => !isDisabled && setIsHovered(true)} onMouseLeave={() => !isDisabled && setIsHovered(false)} {...props} {...views?.container}>
+        {label && (<Horizontal justifyContent="space-between" alignItems="center" marginBottom={8} width="100%">
+            <Text fontSize={14} fontWeight={500} {...views.label}>
+              {label}
+            </Text>
+            {showValue && (<Text fontSize={14} color="color-gray-500" {...views.valueLabel}>
+                {currentValue}
+              </Text>)}
+          </Horizontal>)}
+        <View ref={trackRef} position="relative" borderRadius={trackCrossAxisSize / 2} backgroundColor={isDisabled ? disabledColor : trackColor} cursor={isDisabled ? 'not-allowed' : 'pointer'} width={isVertical ? `${trackCrossAxisSize}px` : '100%'} height={isVertical ? '100%' : `${trackCrossAxisSize}px`} onMouseDown={handleTrackMouseDown} onTouchStart={handleTrackMouseDown} {...views?.track}>
+          
+          {stepValues && stepValues.length > 0 && (<>
+              {stepValues.map((stepValue) => {
+                const stepPercentage = ((stepValue - min) / (max - min)) * 100;
+                return (<View key={stepValue} position="absolute" width={4} height={4} borderRadius="50%" backgroundColor={activeTrackColor} zIndex={1} {...(isVertical
+                    ? {
+                        bottom: `${stepPercentage}%`,
+                        left: '50%',
+                        transform: 'translate(-50%, 50%)',
+                    }
+                    : {
+                        left: `${stepPercentage}%`,
+                        top: '50%',
+                        transform: 'translate(-50%, -50%)',
+                    })} {...views.stepMarks}/>);
+            })}
+            </>)}
+          <View position="absolute" borderRadius={trackCrossAxisSize / 2} {...(isVertical
+        ? {
+            bottom: 0,
+            left: 0,
+            width: '100%',
+            height: `${thumbPositionPercent}%`,
+        }
+        : {
+            top: 0,
+            left: 0,
+            height: '100%',
+            width: `${thumbPositionPercent}%`,
+        })} {...colorStyleProp('backgroundColor', activeTrackColor)} {...views?.filledTrack} {...views?.progress}/>
+          <View ref={thumbRef} role="slider" tabIndex={isDisabled ? -1 : 0} aria-valuemin={min} aria-valuemax={max} aria-valuenow={currentValue} aria-orientation={orientation} aria-disabled={isDisabled} aria-label={ariaLabel} position="absolute" width={`${thumbSize}px`} height={`${thumbSize}px`} borderRadius="50%" borderWidth={2} borderStyle="solid" borderColor="color-white" boxShadow="0 1px 3px rgba(0, 0, 0, 0.2)" cursor={isDisabled ? 'not-allowed' : 'grab'} transform={isVertical ? 'translateX(-50%)' : 'translateY(-50%)'} zIndex={2} transition={isDragging ? 'none' : 'left 0.1s, bottom 0.1s'} {...colorStyleProp('backgroundColor', activeTrackColor)} {...(isVertical
+        ? {
+            left: '50%',
+            bottom: `${thumbPositionPercent}%`,
+        }
+        : {
+            top: '50%',
+            left: `${thumbPositionPercent}%`,
+        })} onMouseDown={handleThumbMouseDown} onTouchStart={handleThumbMouseDown} onKeyDown={handleKeyDown} {...views?.thumb}>
+            {showTooltip && (isHovered || isDragging) && (<View position="absolute" padding="4px 8px" backgroundColor={'color-black'} color={'color-white'} borderRadius="4px" whiteSpace="nowrap" zIndex={3} {...(isVertical
+            ? {
+                left: '100%',
+                marginLeft: '8px',
+                bottom: '0',
+                transform: 'translateY(50%)',
+            }
+            : {
+                bottom: '100%',
+                left: '50%',
+                marginBottom: '8px',
+                transform: 'translateX(-50%)',
+            })} {...views?.tooltip}>
+                <Text {...views?.tooltip?.text}>
+                  {currentValue?.toFixed(step < 1 ? 1 : 0)}
+                </Text>
+              </View>)}
+          </View>
+        </View>
+        {helperText && <HelperText marginTop={8}>{helperText}</HelperText>}
+      </Center>);
+    return isVertical || showTooltip ? enhancedView : legacyView;
+});
+//# sourceMappingURL=Slider.view.js.map

package/dist/native/components/Slider/Slider/Slider.view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.view.js","sourceRoot":"","sources":["../../../../../src/components/Slider/Slider/Slider.view.tsx"],"names":[],"mappings":"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"}

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

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

package/dist/native/components/Slider/Slider/Slider.view.native.js

@@ -0,0 +1,40 @@
+import React from 'react';
+import { View, Text, Vertical, Horizontal } from 'app-studio';
+import { HelperText } from '../../Input/HelperText/HelperText';
+import { SliderSizes, SliderShapes, SliderVariants, ThumbSizes, EnhancedSliderSizes, } from './Slider.style';
+const isRawCssColor = (value) => typeof value === 'string' &&
+    (/^(#|rgb\(|rgba\(|hsl\(|hsla\(|var\()/.test(value) ||
+        ['black', 'currentColor', 'inherit', 'transparent', 'white'].includes(value));
+const colorStyleProp = (property, value) => isRawCssColor(value) ? { style: { [property]: value } } : { [property]: value };
+export const SliderView = React.memo(({ min = 0, max = 100, step = 1, currentValue, stepValues, shape = 'rounded', size = 'md', variant = 'default', orientation = 'horizontal', isDisabled = false, showValue = false, backgroundColor = 'theme-primary', label, helperText, themeMode: elementMode, isDragging, isHovered, setIsHovered, trackRef, thumbRef, handleThumbMouseDown, handleTrackMouseDown, handleKeyDown, thumbPositionPercent, ariaLabel = 'Slider', views = {}, onChange, onDrag, value, defaultValue, ...props }) => {
+    const themeColor = backgroundColor;
+    const disabledColor = 'theme-disabled';
+    const trackColor = SliderVariants[variant].backgroundColor;
+    const activeTrackColor = isDisabled ? disabledColor : themeColor;
+    const { trackCrossAxisSize, thumbSize } = EnhancedSliderSizes[size] || {
+        trackCrossAxisSize: SliderSizes[size].height,
+        thumbSize: ThumbSizes[size].width || 16,
+    };
+    return (<Vertical width="100%" gap={8} {...views.container} {...props}>
+        {label && (<Horizontal justifyContent="space-between" alignItems="center">
+            <Text fontSize={14} fontWeight={500} {...views.label}>
+              {label}
+            </Text>
+            {showValue && (<Text fontSize={14} color="color-gray-500" {...views.valueLabel}>
+                {currentValue}
+              </Text>)}
+          </Horizontal>)}
+        <View ref={trackRef} position="relative" opacity={isDisabled ? 0.6 : 1} onStartShouldSetResponder={() => !isDisabled} onResponderGrant={handleTrackMouseDown} {...SliderSizes[size]} borderRadius={SliderShapes[shape]} backgroundColor={trackColor} {...SliderVariants[variant]} {...views.track}>
+          {stepValues && stepValues.length > 0 && (<>
+              {stepValues.map((stepValue) => {
+                const stepPercentage = ((stepValue - min) / (max - min)) * 100;
+                return (<View key={stepValue} position="absolute" top="50%" left={`${stepPercentage}%`} width={4} height={4} borderRadius={2} zIndex={1} {...colorStyleProp('backgroundColor', activeTrackColor)} {...views.stepMarks}/>);
+            })}
+            </>)}
+          <View position="absolute" top={0} left={0} height="100%" width={`${thumbPositionPercent}%`} borderRadius={SliderShapes[shape]} {...colorStyleProp('backgroundColor', activeTrackColor)} {...views.progress} {...views.filledTrack}/>
+          <View ref={thumbRef} position="absolute" top="50%" left={`${thumbPositionPercent}%`} borderRadius={thumbSize / 2} backgroundColor="color-white" borderWidth={2} borderStyle="solid" zIndex={2} {...colorStyleProp('borderColor', activeTrackColor)} onStartShouldSetResponder={() => !isDisabled} onResponderGrant={handleThumbMouseDown} {...ThumbSizes[size]} {...views.thumb}/>
+        </View>
+        {helperText && <HelperText>{helperText}</HelperText>}
+      </Vertical>);
+});
+//# sourceMappingURL=Slider.view.native.js.map

package/dist/native/components/Slider/Slider/Slider.view.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.view.native.js","sourceRoot":"","sources":["../../../../../src/components/Slider/Slider/Slider.view.native.tsx"],"names":[],"mappings":"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"}

package/dist/native/components/Slider/Slider.d.ts

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

package/dist/native/components/Slider/Slider.js

@@ -0,0 +1,12 @@
+import React from 'react';
+import { useSliderState } from './Slider/Slider.state';
+import { SliderView } from './Slider/Slider.view';
+import { useMergedDesignSystemComponentProps } from '../../design-system';
+// This file defines the main Slider component, which integrates the slider's state management logic with its presentation via the SliderView and useSliderState hook.
+const SliderComponent = (props) => {
+    const mergedProps = useMergedDesignSystemComponentProps('slider', props);
+    const sliderState = useSliderState(mergedProps);
+    return <SliderView {...mergedProps} {...sliderState}/>;
+};
+export const Slider = SliderComponent;
+//# sourceMappingURL=Slider.js.map

package/dist/native/components/Slider/Slider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider.js","sourceRoot":"","sources":["../../../../src/components/Slider/Slider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,cAAc,EAAE,MAAM,uBAAuB,CAAC;AACvD,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAClD,OAAO,EAAE,mCAAmC,EAAE,MAAM,mBAAmB,CAAC;AACxE,sKAAsK;AACtK,MAAM,eAAe,GAA0B,CAAC,KAAK,EAAE,EAAE;IACvD,MAAM,WAAW,GAAG,mCAAmC,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IACzE,MAAM,WAAW,GAAG,cAAc,CAAC,WAAW,CAAC,CAAC;IAChD,OAAO,CAAC,UAAU,CAAC,IAAI,WAAW,CAAC,CAAC,IAAI,WAAW,CAAC,EAAG,CAAC;AAC1D,CAAC,CAAC;AACF,MAAM,CAAC,MAAM,MAAM,GAAG,eAAe,CAAC"}

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

@@ -0,0 +1 @@
+export * from './Slider';

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

@@ -0,0 +1,3 @@
+// Re-exports all functionalities and components from the './Slider' module, making them directly accessible when importing from the component's root directory.
+export * from './Slider';
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Slider/index.ts"],"names":[],"mappings":"AAAA,gKAAgK;AAChK,cAAc,UAAU,CAAC"}

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

@@ -0,0 +1,12 @@
+import React from 'react';
+import { ViewProps } from 'app-studio';
+import { Status, StatusIndicatorStyles } from './StatusIndicator.type';
+export interface StatusIndicatorProps extends ViewProps {
+    label?: string;
+    status?: Status;
+    views?: StatusIndicatorStyles;
+    icon?: React.ReactNode;
+    color?: string;
+    size?: string;
+    variant?: string;
+}

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

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

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

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

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

@@ -0,0 +1,10 @@
+import { ViewProps } from 'app-studio';
+import { Status } from './StatusIndicator.type';
+export declare const getThemes: (themeMode: string) => Record<Status, {
+    indicator: ViewProps;
+    label: ViewProps;
+}>;
+export declare const Themes: Record<Status, {
+    indicator: ViewProps;
+    label: ViewProps;
+}>;

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

@@ -0,0 +1,32 @@
+// Defines a function to generate a set of styling themes for different status types (e.g., default, info, success, warning, error), applying specific background colors for indicators and text colors for labels.
+export const getThemes = (
+// Represents the current theme mode, which could be used to adjust the returned styles (though currently not utilized in the function's logic).
+themeMode) => {
+    // Labels inherit color from the surrounding context so they stay readable on
+    // any brand surface (light or dark). The indicator dot carries the semantic hue.
+    return {
+        default: {
+            indicator: { backgroundColor: 'color-gray-400' },
+            label: { color: 'inherit' },
+        },
+        info: {
+            indicator: { backgroundColor: 'color-blue-500' },
+            label: { color: 'inherit' },
+        },
+        success: {
+            indicator: { backgroundColor: 'color-green-500' },
+            label: { color: 'inherit' },
+        },
+        warning: {
+            indicator: { backgroundColor: 'color-orange-500' },
+            label: { color: 'inherit' },
+        },
+        error: {
+            indicator: { backgroundColor: 'color-red-500' },
+            label: { color: 'inherit' },
+        },
+    };
+};
+// Exports a constant `Themes` that holds the specific styling themes for the StatusIndicator, initialized by calling `getThemes` with the 'light' theme mode.
+export const Themes = getThemes('light');
+//# sourceMappingURL=StatusIndicator.style.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"StatusIndicator.style.js","sourceRoot":"","sources":["../../../../../src/components/StatusIndicator/StatusIndicator/StatusIndicator.style.tsx"],"names":[],"mappings":"AAEA,mNAAmN;AACnN,MAAM,CAAC,MAAM,SAAS,GAAG;AACvB,gJAAgJ;AAChJ,SAAiB,EAC2C,EAAE;IAC9D,6EAA6E;IAC7E,iFAAiF;IACjF,OAAO;QACL,OAAO,EAAE;YACP,SAAS,EAAE,EAAE,eAAe,EAAE,gBAAgB,EAAE;YAChD,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;SAC5B;QACD,IAAI,EAAE;YACJ,SAAS,EAAE,EAAE,eAAe,EAAE,gBAAgB,EAAE;YAChD,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;SAC5B;QACD,OAAO,EAAE;YACP,SAAS,EAAE,EAAE,eAAe,EAAE,iBAAiB,EAAE;YACjD,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;SAC5B;QACD,OAAO,EAAE;YACP,SAAS,EAAE,EAAE,eAAe,EAAE,kBAAkB,EAAE;YAClD,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;SAC5B;QACD,KAAK,EAAE;YACL,SAAS,EAAE,EAAE,eAAe,EAAE,eAAe,EAAE;YAC/C,KAAK,EAAE,EAAE,KAAK,EAAE,SAAS,EAAE;SAC5B;KACF,CAAC;AACJ,CAAC,CAAC;AACF,8JAA8J;AAC9J,MAAM,CAAC,MAAM,MAAM,GAAG,SAAS,CAAC,OAAO,CAAC,CAAC"}

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

@@ -0,0 +1,7 @@
+import { ViewProps } from 'app-studio';
+export type Status = 'default' | 'info' | 'success' | 'warning' | 'error';
+export type StatusIndicatorStyles = {
+    container?: ViewProps;
+    indicator?: ViewProps;
+    label?: ViewProps;
+};

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

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

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

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

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

@@ -0,0 +1,3 @@
+import React from 'react';
+import { StatusIndicatorProps } from './StatusIndicator.props';
+export declare const StatusIndicatorView: ({ label, status, views, themeMode: elementMode, ...props }: StatusIndicatorProps) => React.JSX.Element;

package/dist/native/components/StatusIndicator/StatusIndicator/StatusIndicator.view.js

@@ -0,0 +1,30 @@
+import React from 'react';
+import { Horizontal, View, useTheme } from 'app-studio';
+import { Text } from 'app-studio';
+import { getThemes } from './StatusIndicator.style';
+// Defines the functional component responsible for rendering the Status Indicator UI.
+export const StatusIndicatorView = ({ 
+// Represents the text label displayed alongside the status indicator.
+label, 
+// Specifies the current status of the indicator, influencing its visual styling. Defaults to 'default'.
+status = 'default', 
+// An object allowing custom styling or overriding default view properties for various parts of the indicator.
+views, 
+// Allows overriding the theme mode specifically for this indicator, separate from the global theme.
+themeMode: elementMode, 
+// Gathers any additional HTML attributes or props passed to the component's root element.
+...props }) => {
+    // Retrieves the current global theme mode from the application's theme context.
+    const { themeMode } = useTheme();
+    // Determines the effective theme mode for the indicator, preferring `elementMode` if provided, otherwise using the global `themeMode`.
+    const currentThemeMode = elementMode || themeMode;
+    // Fetches the specific styling themes based on the resolved `currentThemeMode` for the indicator's elements.
+    const themes = getThemes(currentThemeMode);
+    return (<Horizontal alignItems="center" gap={8} role="status-indicator" {...views?.container} {...props}>
+      <View role="status-dot" width="8px" height="8px" borderRadius="50%" {...themes[status].indicator} {...views?.indicator}/>
+      {label && (<Text role="status-label" fontSize="14px" lineHeight="20px" {...themes[status].label} {...views?.label}>
+          {label}
+        </Text>)}
+    </Horizontal>);
+};
+//# sourceMappingURL=StatusIndicator.view.js.map

package/dist/native/components/StatusIndicator/StatusIndicator/StatusIndicator.view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusIndicator.view.js","sourceRoot":"","sources":["../../../../../src/components/StatusIndicator/StatusIndicator/StatusIndicator.view.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,UAAU,EAAE,IAAI,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACxD,OAAO,EAAE,IAAI,EAAE,MAAM,YAAY,CAAC;AAElC,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,sFAAsF;AACtF,MAAM,CAAC,MAAM,mBAAmB,GAAG,CAAC;AAClC,sEAAsE;AACtE,KAAK;AACL,wGAAwG;AACxG,MAAM,GAAG,SAAS;AAClB,8GAA8G;AAC9G,KAAK;AACL,oGAAoG;AACpG,SAAS,EAAE,WAAW;AACtB,0FAA0F;AAC1F,GAAG,KAAK,EACa,EAAE,EAAE;IACzB,gFAAgF;IAChF,MAAM,EAAE,SAAS,EAAE,GAAG,QAAQ,EAAE,CAAC;IACjC,uIAAuI;IACvI,MAAM,gBAAgB,GAAG,WAAW,IAAI,SAAS,CAAC;IAClD,6GAA6G;IAC7G,MAAM,MAAM,GAAG,SAAS,CAAC,gBAAgB,CAAC,CAAC;IAC3C,OAAO,CACL,CAAC,UAAU,CACT,UAAU,CAAC,QAAQ,CACnB,GAAG,CAAC,CAAC,CAAC,CAAC,CACP,IAAI,CAAC,kBAAkB,CACvB,IAAI,KAAK,EAAE,SAAS,CAAC,CACrB,IAAI,KAAK,CAAC,CAEV;MAAA,CAAC,IAAI,CACH,IAAI,CAAC,YAAY,CACjB,KAAK,CAAC,KAAK,CACX,MAAM,CAAC,KAAK,CACZ,YAAY,CAAC,KAAK,CAClB,IAAI,MAAM,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,CAC7B,IAAI,KAAK,EAAE,SAAS,CAAC,EAEvB;MAAA,CAAC,KAAK,IAAI,CACR,CAAC,IAAI,CACH,IAAI,CAAC,cAAc,CACnB,QAAQ,CAAC,MAAM,CACf,UAAU,CAAC,MAAM,CACjB,IAAI,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,CAAC,CACzB,IAAI,KAAK,EAAE,KAAK,CAAC,CAEjB;UAAA,CAAC,KAAK,CACR;QAAA,EAAE,IAAI,CAAC,CACR,CACH;IAAA,EAAE,UAAU,CAAC,CACd,CAAC;AACJ,CAAC,CAAC"}

package/dist/native/components/StatusIndicator/StatusIndicator.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { StatusIndicatorProps } from './StatusIndicator/StatusIndicator.props';
+export declare const StatusIndicator: (props: StatusIndicatorProps) => React.JSX.Element;

package/dist/native/components/StatusIndicator/StatusIndicator.js

@@ -0,0 +1,9 @@
+import React from 'react';
+import { StatusIndicatorView } from './StatusIndicator/StatusIndicator.view';
+import { useMergedDesignSystemComponentProps } from '../../design-system';
+// This component serves as the main entry point for the StatusIndicator, acting as a functional component that primarily renders the StatusIndicatorView, passing all received props directly to it. Its purpose is to define the core StatusIndicator component.
+export const StatusIndicator = (props) => {
+    const mergedProps = useMergedDesignSystemComponentProps('status', props);
+    return <StatusIndicatorView {...mergedProps}/>;
+};
+//# sourceMappingURL=StatusIndicator.js.map

package/dist/native/components/StatusIndicator/StatusIndicator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"StatusIndicator.js","sourceRoot":"","sources":["../../../../src/components/StatusIndicator/StatusIndicator.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,mBAAmB,EAAE,MAAM,wCAAwC,CAAC;AAC7E,OAAO,EAAE,mCAAmC,EAAE,MAAM,mBAAmB,CAAC;AACxE,kQAAkQ;AAClQ,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAE,EAAE;IAC7D,MAAM,WAAW,GAAG,mCAAmC,CAAC,QAAQ,EAAE,KAAK,CAAC,CAAC;IACzE,OAAO,CAAC,mBAAmB,CAAC,IAAI,WAAW,CAAC,EAAG,CAAC;AAClD,CAAC,CAAC"}

package/dist/native/components/Table/Table/Table.context.d.ts

@@ -0,0 +1,23 @@
+import React from 'react';
+import { ViewProps } from 'app-studio';
+export type TableViewStyles = {
+    table?: ViewProps;
+    thead?: ViewProps;
+    tfoot?: ViewProps;
+    tbody?: ViewProps;
+    tr?: ViewProps;
+    td?: ViewProps;
+    th?: ViewProps;
+    caption?: ViewProps;
+};
+interface TableContextProps {
+    views: TableViewStyles;
+    onRowClick?: Function;
+}
+export declare const TableProvider: React.FC<{
+    children: React.ReactNode;
+    views?: TableViewStyles;
+    onRowClick?: Function;
+}>;
+export declare const useTableContext: () => TableContextProps;
+export {};

package/dist/native/components/Table/Table/Table.context.js

@@ -0,0 +1,15 @@
+import React, { createContext, useContext } from 'react';
+const defaultStyles = {};
+// Create a context that includes both styles and the onClick function
+const TableContext = createContext({
+    views: defaultStyles,
+    onRowClick: () => { }, // Default to undefined if no onClick is passed
+});
+export const TableProvider = ({ children, views = defaultStyles, onRowClick }) => (
+// Pass both styles and onClick to the context
+<TableContext.Provider value={{ views, onRowClick }}>
+    {children}
+  </TableContext.Provider>);
+// Custom hook to consume the context and get the styles and onClick handler
+export const useTableContext = () => useContext(TableContext);
+//# sourceMappingURL=Table.context.js.map

package/dist/native/components/Table/Table/Table.context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.context.js","sourceRoot":"","sources":["../../../../../src/components/Table/Table/Table.context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAczD,MAAM,aAAa,GAAoB,EAAE,CAAC;AAO1C,sEAAsE;AACtE,MAAM,YAAY,GAAG,aAAa,CAAoB;IACpD,KAAK,EAAE,aAAa;IACpB,UAAU,EAAE,GAAG,EAAE,GAAE,CAAC,EAAE,+CAA+C;CACtE,CAAC,CAAC;AAEH,MAAM,CAAC,MAAM,aAAa,GAIrB,CAAC,EAAE,QAAQ,EAAE,KAAK,GAAG,aAAa,EAAE,UAAU,EAAE,EAAE,EAAE,CAAC;AACxD,8CAA8C;AAC9C,CAAC,YAAY,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,EAAE,UAAU,EAAE,CAAC,CAClD;IAAA,CAAC,QAAQ,CACX;EAAA,EAAE,YAAY,CAAC,QAAQ,CAAC,CACzB,CAAC;AAEF,4EAA4E;AAC5E,MAAM,CAAC,MAAM,eAAe,GAAG,GAAG,EAAE,CAAC,UAAU,CAAC,YAAY,CAAC,CAAC"}

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

@@ -0,0 +1,24 @@
+import React from 'react';
+import { Column, FooterCell, TableViewStyles } from './Table.type';
+import { ViewProps } from 'app-studio';
+export interface TableProps {
+    data: any[];
+    columns: Column[];
+    footer?: FooterCell[];
+    caption?: React.ReactNode;
+    views?: TableViewStyles;
+}
+export interface TableViewProps extends TableProps, Omit<ViewProps, 'size' | 'columns'> {
+}
+export interface TableLayoutProps {
+    Head?: React.FC<any>;
+    Body?: React.FC<any>;
+    Row?: React.FC<any>;
+    Cell?: React.FC<any>;
+    Footer?: React.FC<any>;
+    Caption?: React.FC<any>;
+    TableContainer?: React.FC<any>;
+    children?: React.ReactNode;
+    views?: TableViewStyles;
+    onClick?: Function;
+}

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

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

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

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

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

@@ -0,0 +1,5 @@
+import React from 'react';
+export declare const useTableState: () => {
+    isHovered: boolean;
+    setIsHovered: React.Dispatch<React.SetStateAction<boolean>>;
+};

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

@@ -0,0 +1,6 @@
+import React from 'react';
+export const useTableState = () => {
+    const [isHovered, setIsHovered] = React.useState(false);
+    return { isHovered, setIsHovered };
+};
+//# sourceMappingURL=Table.state.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Table.state.js","sourceRoot":"","sources":["../../../../../src/components/Table/Table/Table.state.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,CAAC,MAAM,aAAa,GAAG,GAAG,EAAE;IAChC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC;IACxD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAC;AACrC,CAAC,CAAC"}

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

@@ -0,0 +1,32 @@
+/**
+ * Table Styles
+ *
+ * Defines the styles for the Table component 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 { TableViewStyles } from './Table.type';
+/**
+ * Default table styles following the design system
+ * Matching shadcn/ui patterns with subtle shadows and transitions
+ */
+export declare const DefaultTableStyles: TableViewStyles;
+/**
+ * Compact table styles
+ */
+export declare const CompactTableStyles: TableViewStyles;
+/**
+ * Striped table styles
+ */
+export declare const StripedTableStyles: TableViewStyles;
+/**
+ * Bordered table styles
+ */
+export declare const BorderedTableStyles: TableViewStyles;
+/**
+ * Dark theme table styles
+ */
+export declare const DarkTableStyles: TableViewStyles;