@aveonline/ui-react 0.0.2-alpha.0 → 1.0.1

package/dist/components/molecules/Header/Header.d.ts

@@ -0,0 +1,7 @@
+import { IHeader } from './IHeader';
+/**
+ * Atom: Header
+ * The top bar is a header component that allows merchants to access menus, and navigate by clicking on the logo. It’s always visible at the top of interfaces.
+ */
+declare function Header({ hasLogo, className, ...rest }: IHeader): JSX.Element;
+export default Header;

package/dist/components/molecules/Header/IHeader.d.ts

@@ -0,0 +1,6 @@
+declare type IHeader = {
+    hasLogo?: boolean;
+    className?: string;
+    [rest: string]: any;
+};
+export type { IHeader };

package/dist/components/molecules/Header/index.d.ts

@@ -0,0 +1 @@
+export { default as Header } from './Header';

package/dist/components/molecules/InlineError/IInlineError.d.ts

@@ -0,0 +1,16 @@
+import type { IChildren, IClassName } from '../../../types';
+import { IColor, IKind } from '../../atoms/Icon';
+export interface IInlineError extends IChildren, IClassName {
+    /**
+     * Sizes availables
+     */
+    size?: 'lg' | 'sm';
+    /**
+     * Icons availables
+     */
+    icon?: IKind;
+    /**
+     * Colors icons
+     */
+    colorIcon?: IColor;
+}

package/dist/components/molecules/InlineError/InlineError.d.ts

@@ -0,0 +1,7 @@
+import type { IInlineError } from './IInlineError';
+/**
+ * Atom: InlineError
+ * Inline errors are brief, in-context messages that tell merchants something went wrong with a single or group of inputs in a form. Use inline errors to help merchants understand why a form input may not be valid and how to fix it.
+ */
+declare function InlineError({ children, size, icon, colorIcon, className, ...props }: IInlineError): JSX.Element;
+export default InlineError;

package/dist/components/molecules/InlineError/index.d.ts

@@ -0,0 +1 @@
+export { default as InlineError } from './InlineError';

package/dist/components/molecules/Modal/IModal.d.ts

@@ -0,0 +1,36 @@
+import { IChildren } from '../../../types';
+interface IPropsModal extends IChildren {
+    /**
+     * Crontol open and close modal
+     */
+    isOpen?: boolean;
+    /**
+     * Title main
+     */
+    title?: string;
+    /**
+     * Reference to icon with onclick on the header
+     */
+    iconTitle?: JSX.Element;
+    /**
+     * Subtitle secondary
+     */
+    subtitle?: string;
+    /**
+     * Container for elements align to x end
+     */
+    footer?: JSX.Element;
+    /**
+     * Control border for children
+     */
+    hasBorder?: Array<'top' | 'bottom'>;
+    /**
+     * Show icon delete from header
+     */
+    showClose?: boolean;
+    /**
+     * Event for close modal
+     */
+    onClose?: (value: boolean) => void;
+}
+export type { IPropsModal };

package/dist/components/molecules/Modal/Modal.d.ts

@@ -0,0 +1,7 @@
+import type { IPropsModal } from './IModal';
+/**
+ * Molecule: Modal
+ * Modals are overlays that require merchants to take an action before they can continue interacting with the rest of Shopify. They can be disruptive and should be used thoughtfully and sparingly.
+ */
+declare function Modal({ title, iconTitle, subtitle, footer, isOpen, hasBorder, showClose, onClose, children }: IPropsModal): JSX.Element;
+export default Modal;

package/dist/components/molecules/Modal/index.d.ts

@@ -0,0 +1 @@
+export { default as Modal } from './Modal';

package/dist/components/molecules/Selectable/AsyncSelect/AsyncSelect.d.ts

@@ -0,0 +1,7 @@
+import type { IAsyncSelect } from './IAsyncSelect';
+/**
+ * Molecule: AsyncSelect
+ * Async select lets merchants choose one option from an options menu. Consider select when you have 4 or more options, to avoid cluttering the interface. Data from network
+ */
+declare function AsyncSelect({ placeholder, id, name, error, helpText, hasLabelPlaceholder, isDisabled, isClearable, defaultValue, onChange, loadOptions, ...props }: IAsyncSelect): JSX.Element;
+export default AsyncSelect;

package/dist/components/molecules/Selectable/AsyncSelect/IAsyncSelect.d.ts

@@ -0,0 +1,7 @@
+import type { ISelect, IOption } from '../Select';
+export interface IAsyncSelect extends Omit<ISelect, 'options'> {
+    /**
+     * Handle change search async
+     */
+    loadOptions?: (inputValue: string) => Promise<IOption[]> | undefined;
+}

package/dist/components/molecules/Selectable/AsyncSelect/index.d.ts

@@ -0,0 +1 @@
+export { default as AsyncSelect } from './AsyncSelect';

package/dist/components/molecules/Selectable/Select/ISelect.d.ts

@@ -0,0 +1,54 @@
+export declare type IOption = {
+    label: string | number;
+    value: string | number;
+};
+export interface ISelect {
+    /**
+     * Array of options that populate the select menu
+     */
+    options?: IOption[];
+    /**
+     * Is the select disabled
+     */
+    isDisabled?: boolean;
+    /**
+     * Placeholder for the select value
+     */
+    placeholder?: string;
+    /**
+     * Object default of options
+     */
+    defaultValue?: IOption;
+    /**
+     * Message error
+     */
+    error?: string;
+    /**
+     * The id to set on the SelectContainer component.
+     */
+    id?: string;
+    /**
+     * Name of the HTML Input (optional - without this, no input will be rendered)
+     */
+    name?: string;
+    /**
+     * Handle change events on the select
+     */
+    onChange?: (value: IOption) => void;
+    /**
+     * Message for help human
+     */
+    helpText?: string;
+    /**
+     * Placeholder to convert on label
+     */
+    hasLabelPlaceholder?: boolean;
+    /**
+     * Whether to enable search functionality
+     */
+    isSearchable?: boolean;
+    /**
+     * Is the select value clearable
+     */
+    isClearable?: boolean;
+}

package/dist/components/molecules/Selectable/Select/Select.d.ts

@@ -0,0 +1,7 @@
+import type { ISelect } from './ISelect';
+/**
+ * Atom: Select
+ * Select lets merchants choose one option from an options menu. Consider select when you have 4 or more options, to avoid cluttering the interface.
+ */
+declare function Select({ options, placeholder, defaultValue, isDisabled, id, error, name, helpText, hasLabelPlaceholder, onChange, isSearchable, isClearable, ...props }: ISelect): JSX.Element;
+export default Select;

package/dist/components/molecules/Selectable/Select/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Select } from './Select';
+export * from './ISelect';

package/dist/components/molecules/Selectable/SelectButton/ISelectButton.d.ts

@@ -0,0 +1,25 @@
+import type { ISelect, IOption } from '../Select';
+import type { IKind } from '../../../atoms/Icon';
+import type { Align } from '../../../atoms/Button';
+export interface IOptionSelectButton extends IOption {
+    notSelect?: boolean;
+    icon?: IKind;
+}
+export interface IOptionSelectButtonGroup {
+    label: string;
+    options: IOption[];
+}
+export interface ISelectButton extends Omit<ISelect, 'options'> {
+    /**
+     * Array of options that populate the select menu - two structures optionals
+     */
+    options: IOptionSelectButton[] | IOptionSelectButtonGroup[];
+    /**
+     * Handle click for first element, options no selectable, only emit click
+     */
+    onClickFirstItem?: (value: IOptionSelectButton) => void;
+    /**
+     * Position align children elements atom[Button]
+     */
+    alignButton?: Align;
+}

package/dist/components/molecules/Selectable/SelectButton/Option.d.ts

@@ -0,0 +1,4 @@
+import type { Align } from '../../../atoms/Button';
+export declare const Option: ({ alignButton, ...allProps }: {
+    alignButton: Align;
+}) => JSX.Element;

package/dist/components/molecules/Selectable/SelectButton/SelectButton.d.ts

@@ -0,0 +1,7 @@
+import type { ISelectButton } from './ISelectButton';
+/**
+ * Molecule: SelectButton
+ * Select with button for first item lets merchants choose one option from an options menu. Consider select when you have 4 or more options, to avoid cluttering the interface.
+ */
+declare function SelectButton({ options, placeholder, defaultValue, isDisabled, id, error, name, helpText, hasLabelPlaceholder, onChange, isSearchable, isClearable, alignButton, onClickFirstItem, ...props }: ISelectButton): JSX.Element;
+export default SelectButton;

package/dist/components/molecules/Selectable/SelectButton/index.d.ts

@@ -0,0 +1 @@
+export { default as SelectButton } from './SelectButton';

package/dist/components/molecules/Selectable/SelectCountry/Option.d.ts

@@ -0,0 +1,2 @@
+import type { OptionProps } from 'react-select';
+export declare const Option: (props: OptionProps) => JSX.Element;

package/dist/components/molecules/Selectable/SelectCountry/Prefix.d.ts

@@ -0,0 +1,3 @@
+export declare const Prefix: ({ isDisabled }: {
+    isDisabled?: boolean | undefined;
+}) => JSX.Element;

package/dist/components/molecules/Selectable/SelectCountry/SelectCountry.d.ts

@@ -0,0 +1,7 @@
+import { ISelect } from '../Select/ISelect';
+/**
+ * Molecule: SelectCountry
+ * Select lets merchants choose one option from an options menu. Consider select when you have 4 or more options, to avoid cluttering the interface.
+ */
+declare function SelectCountry({ id, name, placeholder, options, defaultValue, isDisabled, error, isSearchable, helpText, onChange, isClearable, ...props }: ISelect): JSX.Element;
+export default SelectCountry;

package/dist/components/molecules/Selectable/SelectCountry/SingleValue.d.ts

@@ -0,0 +1,3 @@
+export declare const SingleValue: ({ isDisabled, ...allProps }: {
+    isDisabled?: boolean | undefined;
+}) => JSX.Element;

package/dist/components/molecules/Selectable/SelectCountry/index.d.ts

@@ -0,0 +1 @@
+export { default as SelectCountry } from './SelectCountry';

package/dist/components/molecules/Selectable/atoms/ClearIndicator.d.ts

@@ -0,0 +1,2 @@
+import type { ClearIndicatorProps } from 'react-select';
+export declare const ClearIndicator: (props: ClearIndicatorProps) => JSX.Element;

package/dist/components/molecules/Selectable/atoms/Container.d.ts

@@ -0,0 +1,7 @@
+import { IChildren } from '../../../../types';
+declare type IProps = {
+    helpText?: string;
+    error?: string;
+};
+export declare function Container({ helpText, error, children }: IProps & IChildren): JSX.Element;
+export {};

package/dist/components/molecules/Selectable/atoms/DropdownIndicator.d.ts

@@ -0,0 +1,2 @@
+import type { DropdownIndicatorProps } from 'react-select';
+export declare const DropdownIndicator: (props: DropdownIndicatorProps) => JSX.Element;

package/dist/components/molecules/Selectable/atoms/Option.d.ts

@@ -0,0 +1,2 @@
+import type { OptionProps } from 'react-select';
+export declare const Option: (props: OptionProps) => JSX.Element;

package/dist/components/molecules/Selectable/atoms/Placeholder.d.ts

@@ -0,0 +1,2 @@
+import type { PlaceholderProps } from 'react-select';
+export declare const Placeholder: (props: PlaceholderProps) => JSX.Element;

package/dist/components/molecules/Selectable/atoms/SingleValue.d.ts

@@ -0,0 +1,3 @@
+export declare const SingleValue: ({ hasLabelPlaceholder, ...allProps }: {
+    hasLabelPlaceholder?: boolean | undefined;
+}) => JSX.Element;

package/dist/components/molecules/Selectable/atoms/index.d.ts

@@ -0,0 +1,6 @@
+export * from './ClearIndicator';
+export * from './Container';
+export * from './DropdownIndicator';
+export * from './Option';
+export * from './Placeholder';
+export * from './SingleValue';

package/dist/components/molecules/Selectable/hooks/index.d.ts

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

package/dist/components/molecules/Selectable/hooks/useCSS.d.ts

@@ -0,0 +1,5 @@
+import type { StylesConfig } from 'react-select';
+import type { ISelect } from '../Select';
+export declare function useCSS({ error, helpText }: ISelect): {
+    styles: StylesConfig<unknown, boolean, import("react-select").GroupBase<unknown>>;
+};

package/dist/components/molecules/Summary/Summary.d.ts

@@ -0,0 +1,16 @@
+import { ITemplate } from '../../../types';
+/**
+ * Molecule: Summary
+ */
+declare function Summary({ children, title, className, footer, ...rest }: ITemplate & {
+    title?: string;
+}): JSX.Element;
+declare namespace Summary {
+    var Container: ({ children, className, ...rest }: ITemplate) => JSX.Element;
+    var Header: ({ children, className, ...rest }: ITemplate) => JSX.Element;
+    var Footer: ({ children, className, total, isDisabled, ...rest }: ITemplate & {
+        total?: string | undefined;
+        isDisabled?: boolean | undefined;
+    }) => JSX.Element;
+}
+export default Summary;

package/dist/components/molecules/Summary/index.d.ts

@@ -0,0 +1 @@
+export { default as Summary } from './Summary';

package/dist/components/molecules/Tab/ITab.d.ts

@@ -0,0 +1,19 @@
+export interface ITab {
+    children?: string | number | JSX.Element;
+    isDisabled?: boolean;
+    total?: number;
+}
+export declare type IState = {
+    selected: boolean;
+    isDisabled: boolean | undefined;
+};
+export interface ITabs {
+    /**
+     * Base structure for render content on the tab
+     */
+    tabs: Record<string, ITab>;
+    /**
+     * Option tabs availables
+     */
+    variant?: 'default' | 'fitted';
+}

package/dist/components/molecules/Tab/Tab.d.ts

@@ -0,0 +1,7 @@
+import { ITabs } from './ITab';
+/**
+ * Molecule: Tab
+ * Use to alternate among related views within the same context.
+ */
+declare function Tab({ tabs, variant }: ITabs): JSX.Element;
+export default Tab;

package/dist/components/molecules/Tab/index.d.ts

@@ -0,0 +1,2 @@
+export { default as Tab } from './Tab';
+export * from './Tab';

package/dist/components/molecules/TabNav/ITabNav.d.ts

@@ -0,0 +1,10 @@
+import { IKind } from '../../atoms/Icon';
+declare type ITabNav = {
+    isSelected?: boolean;
+    title?: string;
+    icon?: IKind;
+    total?: number;
+    isSmall?: boolean;
+    [rest: string]: any;
+};
+export type { ITabNav };

package/dist/components/molecules/TabNav/TabNav.d.ts

@@ -0,0 +1,6 @@
+import { ITabNav } from './ITabNav';
+/**
+ * Molecule: TabNav
+ */
+declare function TabNav({ icon, isSelected, title, total, isSmall, ...rest }: ITabNav): JSX.Element;
+export default TabNav;

package/dist/components/molecules/TabNav/index.d.ts

@@ -0,0 +1 @@
+export { default as TabNav } from './TabNav';

package/dist/components/organisms/Navigation/INavigation.d.ts

@@ -0,0 +1,8 @@
+import { IChildren } from '@/types';
+interface INavigation extends IChildren {
+    isSmall?: boolean;
+    [rest: string]: any;
+    className?: string;
+    onClick?: () => void;
+}
+export type { INavigation };

package/dist/components/organisms/Navigation/Navigation.d.ts

@@ -0,0 +1,6 @@
+import { INavigation } from './INavigation';
+/**
+ * Organism: Navigation
+ */
+declare function Navigation({ children, isSmall, onClick, className, ...rest }: INavigation): JSX.Element;
+export default Navigation;

package/dist/components/organisms/Navigation/index.d.ts

@@ -0,0 +1 @@
+export { default as Navigation } from './Navigation';

package/dist/components/templates/Main/Main.d.ts

@@ -0,0 +1,11 @@
+import { ITemplate } from '@/types';
+/**
+ * Template: Layout main
+ */
+declare function Layout({ children, className, ...rest }: ITemplate): JSX.Element;
+declare namespace Layout {
+    var Header: ({ children }: ITemplate) => JSX.Element;
+    var Menu: ({ children }: ITemplate) => JSX.Element;
+    var Main: ({ children, className, ...rest }: ITemplate) => JSX.Element;
+}
+export default Layout;

package/dist/components/templates/Main/index.d.ts

@@ -0,0 +1 @@
+export { default as Main } from './Main';

package/dist/components/templates/Shipment/Shipment.d.ts

@@ -0,0 +1,13 @@
+import { ITemplate } from '../../../types';
+/**
+ * Template: Layout generate shipment
+ */
+declare function Layout({ children, className, ...rest }: ITemplate): JSX.Element;
+declare namespace Layout {
+    var Header: ({ children, className, title, onBack, ...rest }: ITemplate & {
+        title?: string | undefined;
+        onBack?: (() => void) | undefined;
+    }) => JSX.Element;
+    var Main: ({ children, className, ...rest }: ITemplate) => JSX.Element;
+}
+export default Layout;

package/dist/components/templates/Shipment/index.d.ts

@@ -0,0 +1 @@
+export { default as Shipment } from './Shipment';

package/dist/hooks/index.d.ts

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

package/dist/hooks/useTokens.d.ts

@@ -0,0 +1,10 @@
+import type { IHeading, IText } from '../components';
+declare type Response = {
+    getWeight: () => string;
+    getFontSize: () => string;
+    getLineHeight: () => string;
+    getColorText: () => string;
+    getClassName: () => string;
+};
+export declare function useTokens(props: IHeading | IText): Response;
+export {};

package/dist/index.d.ts

@@ -1,3 +1,2 @@
-import { Button } from './components';
-export { Button };
-//# sourceMappingURL=index.d.ts.map
+import { Button, Avatar, Heading, Text, Badge, Switch, Tab, InlineError, Icon, Select, AsyncSelect, SelectButton, SelectCountry, CardSelect, Dropdown, EmptyState, TabNav, RadioButton, Tracker, Modal, Tooltip, Navigation, Header, Main, Summary, Shipment } from './components';
+export { Button, Avatar, Heading, Text, Badge, Switch, Tab, InlineError, Icon, Select, AsyncSelect, SelectButton, SelectCountry, CardSelect, Dropdown, EmptyState, TabNav, RadioButton, Tracker, Modal, Tooltip, Navigation, Header, Main, Summary, Shipment };

package/dist/postcss.config.js

@@ -1,6 +1,3 @@
-/* eslint-env es6 */
-/* eslint-disable */
-
 const cssnano = require('cssnano')
 const tailwindcss = require('tailwindcss')
 
@@ -9,6 +6,8 @@ module.exports = {
     require('postcss-import'),
     tailwindcss('./tailwind.config.js'),
     process.env.NODE_ENV === 'production' ? require('autoprefixer') : null,
-    process.env.NODE_ENV === 'production' ? cssnano({preset: 'default'}) : null,
-  ],
+    process.env.NODE_ENV === 'production'
+      ? cssnano({ preset: 'default' })
+      : null
+  ]
 }