@app-studio/web 0.9.5 → 0.9.6

package/dist/components/Form/ColorInput/ColorInput/ColorInput.state.d.ts

@@ -0,0 +1,20 @@
+/// <reference types="react" />
+import { ColorInputProps } from './ColorInput.props';
+export declare const useColorInputState: (props: ColorInputProps) => {
+    isOpen: boolean;
+    selectedColor: string;
+    recentColors: string[];
+    customColor: string;
+    isFocused: boolean;
+    isHovered: boolean;
+    handleToggle: () => void;
+    handleColorSelect: (color: string) => void;
+    handleCustomColorChange: (color: string) => void;
+    handleCustomColorSubmit: () => void;
+    handleClose: () => void;
+    setIsFocused: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    setIsHovered: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+    setValue: (newValue: string) => void;
+    triggerRef: import("react").RefObject<HTMLDivElement>;
+    dropdownRef: import("react").RefObject<HTMLDivElement>;
+};

package/dist/components/Form/ColorInput/ColorInput/ColorInput.style.d.ts

@@ -0,0 +1,31 @@
+import { ViewProps } from 'app-studio';
+import { Size, Variant, Shape } from './ColorInput.type';
+/**
+ * Default styles for the ColorInput component
+ */
+export declare const DefaultColorInputStyles: {
+    container: ViewProps;
+    trigger: ViewProps;
+    dropdown: ViewProps;
+    colorGrid: ViewProps;
+    recentColors: ViewProps;
+};
+/**
+ * Size variants for ColorInput
+ */
+export declare const Sizes: Record<Size, ViewProps>;
+/**
+ * Shape variants for ColorInput
+ */
+export declare const Shapes: Record<Shape, ViewProps>;
+/**
+ * Variant styles for ColorInput
+ */
+export declare const Variants: Record<Variant, ViewProps>;
+/**
+ * Default color palette for the ColorInput
+ */
+export declare const DefaultColorPalette: {
+    name: string;
+    value: string;
+}[];

package/dist/components/Form/ColorInput/ColorInput/ColorInput.type.d.ts

@@ -0,0 +1,36 @@
+import { ViewProps } from 'app-studio';
+export declare type Variant = 'outline' | 'default' | 'none';
+export declare type Shape = 'default' | 'sharp' | 'rounded' | 'pillShaped';
+export declare type Size = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+export declare type ColorInputStyles = {
+    text?: ViewProps;
+    label?: ViewProps;
+    error?: ViewProps;
+    helperText?: ViewProps;
+    container?: ViewProps;
+    trigger?: ViewProps;
+    dropdown?: ViewProps;
+    colorGrid?: ViewProps;
+    colorSwatch?: ViewProps;
+    customInput?: ViewProps;
+    recentColors?: ViewProps;
+};
+export declare type ColorFormat = 'hex' | 'rgb' | 'hsl';
+export declare type ColorValue = {
+    hex: string;
+    rgb: {
+        r: number;
+        g: number;
+        b: number;
+    };
+    hsl: {
+        h: number;
+        s: number;
+        l: number;
+    };
+};
+export declare type PredefinedColor = {
+    name: string;
+    value: string;
+    category?: string;
+};

package/dist/components/Form/ColorInput/ColorInput/ColorInput.view.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { ColorInputViewProps } from './ColorInput.props';
+declare const ColorInputView: React.FC<ColorInputViewProps>;
+export default ColorInputView;

package/dist/components/Form/ColorInput/ColorInput.d.ts

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

package/dist/components/Form/ColorInput/examples/Default.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const DefaultColorInput: () => React.JSX.Element;

package/dist/components/Form/ColorInput/examples/FormIntegration.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const FormIntegrationColorInput: () => React.JSX.Element;

package/dist/components/Form/ColorInput/examples/Sizes.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const SizesColorInput: () => React.JSX.Element;

package/dist/components/Form/ColorInput/examples/Variants.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const VariantsColorInput: () => React.JSX.Element;

package/dist/components/Form/ColorInput/examples/index.d.ts

@@ -0,0 +1,4 @@
+export * from './Default';
+export * from './Variants';
+export * from './Sizes';
+export * from './FormIntegration';

package/dist/components/Form/Form.d.ts

@@ -1,4 +1,5 @@
 export * from './Checkbox/Checkbox';
+export * from './ColorInput/ColorInput';
 export * from './DatePicker/DatePicker';
 export * from './Label/Label';
 export * from './CountryPicker/CountryPicker';

package/dist/components/Formik/Formik.ColorInput.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+import { ColorInputProps } from '../Form/ColorInput/ColorInput/ColorInput.props';
+/**
+ * Color input allows users to select a color from a predefined palette or enter a custom color.
+ */
+export declare const FormikColorInput: React.FC<ColorInputProps>;

package/dist/components/Formik/examples/FormikColorInput.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare const FormikColorInputExample: () => React.JSX.Element;

package/dist/components/Formik/examples/index.d.ts

@@ -1,4 +1,5 @@
 export * from './FormikCheckbox';
+export * from './FormikColorInput';
 export * from './FormikComboBox';
 export * from './FormikCountryPicker';
 export * from './FormikDatePicker';

package/dist/components/Formik/index.d.ts

@@ -1,4 +1,5 @@
 export { FormikCheckbox } from './Formik.Checkbox';
+export { FormikColorInput } from './Formik.ColorInput';
 export { FormikDatePicker } from './Formik.DatePicker';
 export { FormikCountryPicker } from './Formik.CountryPicker';
 export { FormikSelect } from './Formik.Select';

package/dist/components/Title/Title/Title.style.d.ts

@@ -9,11 +9,6 @@ export declare const TitleSizes: {
     md: number;
     lg: number;
     xl: number;
-    '2xl': number;
-    '3xl': number;
-    '4xl': number;
-    '5xl': number;
-    '6xl': number;
 };
 /**
  * Line heights for different title sizes

package/dist/components/Title/Title/Title.type.d.ts

@@ -6,7 +6,7 @@ export declare type HighlightStyle = 'underline' | 'background' | 'gradient' | '
 /**
  * Title size options
  */
-export declare type TitleSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl' | '5xl' | '6xl';
+export declare type TitleSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 /**
  * Title styles for customization
  */

package/dist/components/index.d.ts

@@ -16,6 +16,7 @@ export * from './Form/Switch/Switch';
 export * from './Form/TextArea/TextArea';
 export * from './Form/TextField/TextField';
 export * from './Form/Checkbox/Checkbox';
+export * from './Form/ColorInput/ColorInput';
 export * from './Form/CountryPicker/CountryPicker';
 export * from './Form/DatePicker/DatePicker';
 export * from './Form/Password/Password';
@@ -39,6 +40,8 @@ export * from './Toggle/Toggle';
 export * from './ToggleGroup/ToggleGroup';
 export * from './DragAndDrop/DragAndDrop';
 export * from './DropdownMenu/DropdownMenu';
+export * from './ColorPicker/ColorPicker';
+export * from './EmojiPicker/EmojiPicker';
 export * from './HoverCard/HoverCard';
 export * from './Menubar/Menubar';
 export * from './Pagination/Pagination';
@@ -51,6 +54,7 @@ export * from './Tooltip/Tooltip';
 export * from './Tree/Tree';
 export * from './Flow/Flow';
 export * from './ChatInput/ChatInput';
+export * from './Background/Background';
 export * from './Accordion/Accordion/Accordion.props';
 export * from './Alert/Alert/Alert.props';
 export * from './AspectRatio/AspectRatio/AspectRatio.props';
@@ -68,6 +72,7 @@ export * from './Form/Switch/Switch/Switch.props';
 export * from './Form/TextArea/TextArea/TextArea.props';
 export * from './Form/TextField/TextField/TextField.props';
 export * from './Form/Checkbox/Checkbox/Checkbox.props';
+export * from './Form/ColorInput/ColorInput/ColorInput.props';
 export * from './Form/CountryPicker/CountryPicker/CountryPicker.props';
 export * from './Form/DatePicker/DatePicker/DatePicker.props';
 export * from './Form/Password/Password/Password.props';
@@ -87,6 +92,8 @@ export * from './ToggleGroup/ToggleGroup/ToggleGroup.props';
 export * from './HoverCard/HoverCard/HoverCard.props';
 export * from './NavigationMenu/NavigationMenu/NavigationMenu.props';
 export * from './DropdownMenu/DropdownMenu/DropdownMenu.props';
+export * from './ColorPicker/ColorPicker/ColorPicker.props';
+export * from './EmojiPicker/EmojiPicker/EmojiPicker.props';
 export * from './Menubar/Menubar/Menubar.props';
 export * from './Pagination/Pagination/Pagination.props';
 export * from './Separator/Separator/Separator.props';
@@ -98,3 +105,4 @@ export * from './Tooltip/Tooltip/Tooltip.props';
 export * from './Tree/Tree/Tree.props';
 export * from './Flow/Flow/Flow.props';
 export * from './ChatInput/ChatInput/ChatInput.props';
+export * from './Background/Background/Background.props';

package/dist/pages/background.page.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const BackgroundTestPage: () => React.JSX.Element;
+export default BackgroundTestPage;

package/dist/pages/colorInput.page.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const ColorInputPage: () => React.JSX.Element;
+export default ColorInputPage;

package/dist/pages/colorPicker.page.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const ColorPickerPage: () => React.JSX.Element;
+export default ColorPickerPage;

package/dist/pages/docs/components/CustomLiveCode.component.d.ts

@@ -0,0 +1,10 @@
+import React from 'react';
+interface CustomLiveCodeProps {
+    code: string;
+    originalCode: string;
+    scope: Record<string, any>;
+    language?: string;
+    mainComponentName?: string | null;
+}
+declare const CustomLiveCode: React.FC<CustomLiveCodeProps>;
+export default CustomLiveCode;

package/dist/pages/emojiPicker.page.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+export declare const EmojiPickerPage: () => React.JSX.Element;
+export default EmojiPickerPage;