@domun/component-library 1.0.0

package/lib/styles/icons.css

@@ -0,0 +1,636 @@
+[class^="icon-"], [class*=" icon-"] {
+  /* use !important to prevent issues with browser extensions that change fonts */
+  font-family: 'icomoon' !important;
+  speak: never;
+  font-style: normal;
+  font-weight: normal;
+  font-variant: normal;
+  text-transform: none;
+  line-height: 1;
+
+  /* Better Font Rendering =========== */
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.icon-cart:before {
+  content: "\e900";
+}
+.icon-calendar:before {
+  content: "\e901";
+}
+.icon-expert:before {
+  content: "\e902";
+}
+.icon-burger-menu:before {
+  content: "\e903";
+}
+.icon-headset-mic:before {
+  content: "\e904";
+}
+.icon-bubble-chat:before {
+  content: "\e905";
+}
+.icon-share:before {
+  content: "\e906";
+}
+.icon-close:before {
+  content: "\e907";
+}
+.icon-check:before {
+  content: "\e908";
+}
+.icon-user:before {
+  content: "\e909";
+}
+.icon-trash:before {
+  content: "\e90a";
+}
+.icon-minus:before {
+  content: "\e90b";
+}
+.icon-plus-2:before {
+  content: "\e90c";
+}
+.icon-plus:before {
+  content: "\e90d";
+}
+.icon-arrow-3:before {
+  content: "\e90e";
+}
+.icon-arrow-2:before {
+  content: "\e90f";
+}
+.icon-arrow:before {
+  content: "\e910";
+}
+.icon-hide-password:before {
+  content: "\e911";
+}
+.icon-show-password:before {
+  content: "\e912";
+}
+.icon-squares:before {
+  content: "\e913";
+}
+.icon-bullets-list:before {
+  content: "\e914";
+}
+.icon-search:before {
+  content: "\e915";
+}
+.icon-circle-check:before {
+  content: "\e916";
+}
+.icon-circle-exclamation:before {
+  content: "\e917";
+}
+.icon-shopping-cart:before {
+  content: "\e918";
+}
+.icon-cash:before {
+  content: "\e919";
+}
+.icon-refresh:before {
+  content: "\e91a";
+}
+.icon-arrows-left-right:before {
+  content: "\e91b";
+}
+.icon-credit-card:before {
+  content: "\e91c";
+}
+.icon-trophy:before {
+  content: "\e91d";
+}
+.icon-book-open:before {
+  content: "\e91e";
+}
+.icon-pencil:before {
+  content: "\e91f";
+}
+.icon-question-support:before {
+  content: "\e920";
+}
+.icon-youtube:before {
+  content: "\e921";
+}
+.icon-android:before {
+  content: "\e922";
+}
+.icon-linked-in:before {
+  content: "\e923";
+}
+.icon-tiktok:before {
+  content: "\e924";
+}
+.icon-instagram:before {
+  content: "\e925";
+}
+.icon-facebook:before {
+  content: "\e926";
+}
+.icon-apple:before {
+  content: "\e927";
+}
+.icon-four-points:before {
+  content: "\e928";
+}
+.icon-arrow-line:before {
+  content: "\e929";
+}
+.icon-arrow-bend:before {
+  content: "\e92a";
+}
+.icon-facebook-outline:before {
+  content: "\e92b";
+}
+.icon-list-more:before {
+  content: "\e92c";
+}
+.icon-clock:before {
+  content: "\e92d";
+}
+.icon-coupon:before {
+  content: "\e92e";
+}
+.icon-truck:before {
+  content: "\e92f";
+}
+.icon-email-fill:before {
+  content: "\e930";
+}
+.icon-eye:before {
+  content: "\e931";
+}
+.icon-facebook-circle-outline:before {
+  content: "\e932";
+}
+.icon-ascendant:before {
+  content: "\e933";
+}
+.icon-grid:before {
+  content: "\e934";
+}
+.icon-question:before {
+  content: "\e935";
+}
+.icon-head-phones:before {
+  content: "\e936";
+}
+.icon-whatsapp-color:before {
+  content: "\e937";
+}
+.icon-instagram-circle-outline:before {
+  content: "\e938";
+}
+.icon-link-share:before {
+  content: "\e939";
+}
+.icon-list:before {
+  content: "\e93a";
+}
+.icon-store:before {
+  content: "\e93b";
+}
+.icon-instagram-outline:before {
+  content: "\e93c";
+}
+.icon-order:before {
+  content: "\e93d";
+}
+.icon-phone:before {
+  content: "\e93e";
+}
+.icon-play-circle:before {
+  content: "\e93f";
+}
+.icon-percentage-fill-stroke:before {
+  content: "\e940";
+}
+.icon-question-circle:before {
+  content: "\e941";
+}
+.icon-share-outline:before {
+  content: "\e942";
+}
+.icon-twitter-online:before {
+  content: "\e943";
+}
+.icon-star-fill:before {
+  content: "\e944";
+}
+.icon-build:before {
+  content: "\e945";
+}
+.icon-support:before {
+  content: "\e946";
+}
+.icon-location-outline:before {
+  content: "\e947";
+}
+.icon-filters:before {
+  content: "\e948";
+}
+.icon-pause:before {
+  content: "\e949";
+}
+.icon-mute:before {
+  content: "\e94a";
+}
+.icon-volume:before {
+  content: "\e94b";
+}
+.icon-talk:before {
+  content: "\e94c";
+}
+.icon-play:before {
+  content: "\e94d";
+}
+.icon-heart:before {
+  content: "\e94e";
+}
+.icon-crown:before {
+  content: "\e94f";
+}
+.icon-pin:before {
+  content: "\e950";
+}
+.icon-arrow-top:before {
+  content: "\e951";
+}
+.icon-trash-outline:before {
+  content: "\e952";
+}
+.icon-info-alert-icon:before {
+  content: "\e953";
+}
+.icon-minus-circle:before {
+  content: "\e954";
+}
+.icon-plus-circle:before {
+  content: "\e955";
+}
+.icon-ray:before {
+  content: "\e956";
+}
+.icon-full-screen:before {
+  content: "\e957";
+}
+.icon-bag:before {
+  content: "\e958";
+}
+.icon-image:before {
+  content: "\e959";
+}
+.icon-palette:before {
+  content: "\e95a";
+}
+.icon-picture-in-picture:before {
+  content: "\e95b";
+}
+.icon-star:before {
+  content: "\e95c";
+}
+.icon-dots:before {
+  content: "\e95d";
+}
+.icon-caret-circle-down:before {
+  content: "\e95e";
+}
+.icon-arrow-right:before {
+  content: "\e95f";
+}
+.icon-arrow-line-up:before {
+  content: "\e960";
+}
+.icon-megaphone:before {
+  content: "\e961";
+}
+.icon-filled-clock:before {
+  content: "\e962";
+}
+.icon-bank:before {
+  content: "\e963";
+}
+.icon-filled-lock:before {
+  content: "\e964";
+}
+.icon-outlined-shield:before {
+  content: "\e965";
+}
+.icon-font:before {
+  content: "\e966";
+}
+.icon-sumer-logo:before {
+  content: "\e967";
+}
+.icon-e-twitter:before {
+  content: "\e968";
+}
+.icon-e-facebook:before {
+  content: "\e969";
+}
+.icon-e-instagram:before {
+  content: "\e96a";
+}
+.icon-e-tik-tok:before {
+  content: "\e96b";
+}
+.icon-camera:before {
+  content: "\e96c";
+}
+.icon-light-dots-three-circle:before {
+  content: "\e96d";
+}
+.icon-close-circle:before {
+  content: "\e96e";
+}
+.icon-diamonds:before {
+  content: "\e96f";
+}
+.icon-arrow-go-up:before {
+  content: "\e970";
+}
+.icon-chart-line-up:before {
+  content: "\e971";
+}
+.icon-map-pin-line:before {
+  content: "\e972";
+}
+.icon-light-percent:before {
+  content: "\e973";
+}
+.icon-chat-talk:before {
+  content: "\e974";
+}
+.icon-light-package:before {
+  content: "\e975";
+}
+.icon-line-start:before {
+  content: "\e976";
+}
+.icon-email-outline:before {
+  content: "\e977";
+}
+.icon-copy:before {
+  content: "\e978";
+}
+.icon-cart-outline:before {
+  content: "\e979";
+}
+.icon-account-circle-outline:before {
+  content: "\e97a";
+}
+.icon-comments-outline:before {
+  content: "\e97b";
+}
+.icon-handshake-outline:before {
+  content: "\e97c";
+}
+.icon-home-outline:before {
+  content: "\e97d";
+}
+.icon-logout-outline:before {
+  content: "\e97e";
+}
+.icon-shopping-outline:before {
+  content: "\e97f";
+}
+.icon-view-grid-outline:before {
+  content: "\e980";
+}
+.icon-menu:before {
+  content: "\e981";
+}
+.icon-light-trademarked:before {
+  content: "\e982";
+}
+.icon-light-layout:before {
+  content: "\e983";
+}
+.icon-eye-light:before {
+  content: "\e984";
+}
+.icon-light-paintBrush:before {
+  content: "\e985";
+}
+.icon-light-text:before {
+  content: "\e986";
+}
+.icon-light-text-align-left:before {
+  content: "\e987";
+}
+.icon-light-perspective:before {
+  content: "\e988";
+}
+.icon-light-camera:before {
+  content: "\e989";
+}
+.icon-light-align-right:before {
+  content: "\e98a";
+}
+.icon-light-align-center-horizontal:before {
+  content: "\e98b";
+}
+.icon-light-align-left:before {
+  content: "\e98c";
+}
+.icon-light-tshirt:before {
+  content: "\e98d";
+}
+.icon-light-lamp:before {
+  content: "\e98e";
+}
+.icon-light-hand:before {
+  content: "\e98f";
+}
+.icon-light-hamburger:before {
+  content: "\e990";
+}
+.icon-light-flower-lotus:before {
+  content: "\e991";
+}
+.icon-light-diamond:before {
+  content: "\e992";
+}
+.icon-light-desktop:before {
+  content: "\e993";
+}
+.icon-isotipo-sumer:before {
+  content: "\e994";
+}
+.icon-light-bag:before {
+  content: "\e995";
+}
+.icon-light-mobile:before {
+  content: "\e996";
+}
+.icon-light-cursor:before {
+  content: "\e997";
+}
+.icon-light-grid-four:before {
+  content: "\e998";
+}
+.icon-light-handbag:before {
+  content: "\e999";
+}
+.icon-light-list-three:before {
+  content: "\e99a";
+}
+.icon-rocket-launch-light:before {
+  content: "\e99b";
+}
+.icon-globe-hemisphere-west-light:before {
+  content: "\e99c";
+}
+.icon-square-rounded:before {
+  content: "\e99d";
+}
+.icon-circle:before {
+  content: "\e99e";
+}
+.icon-square:before {
+  content: "\e99f";
+}
+.icon-pen-ink:before {
+  content: "\e9a0";
+}
+.icon-arrow-black:before {
+  content: "\e9a1";
+}
+.icon-chats-circle:before {
+  content: "\e9a2";
+}
+.icon-chat-circle-dots:before {
+  content: "\e9a3";
+}
+.icon-chat-circle-text:before {
+  content: "\e9a4";
+}
+.icon-align-vertical-bottom:before {
+  content: "\e9a5";
+}
+.icon-align-vertical-center:before {
+  content: "\e9a6";
+}
+.icon-pencil-line:before {
+  content: "\e9a7";
+}
+.icon-puzzle-piece:before {
+  content: "\e9a8";
+}
+.icon-arrows-out-cardinal:before {
+  content: "\e9a9";
+}
+.icon-chart-bar-light:before {
+  content: "\e9aa";
+}
+.icon-layout-light:before {
+  content: "\e9ab";
+}
+.icon-six-dots-vertical:before {
+  content: "\e9ac";
+}
+.icon-link-light:before {
+  content: "\e9ad";
+}
+.icon-light-gradient:before {
+  content: "\e9ae";
+}
+.icon-light-target:before {
+  content: "\e9af";
+}
+.icon-addons:before {
+  content: "\e9b0";
+}
+.icon-cta:before {
+  content: "\e9b5";
+}
+.icon-ia:before {
+  content: "\e9b6";
+}
+.icon-h1:before {
+  content: "\e9b7";
+}
+.icon-h2:before {
+  content: "\e9b8";
+}
+.icon-square-five:before {
+  content: "\e9b9";
+}
+.icon-light-receipt:before {
+  content: "\e9ba";
+}
+.icon-light-link-simple:before {
+  content: "\e9bb";
+}
+.icon-whatsapp-outline:before {
+  content: "\e9bc";
+}
+.icon-light-globe:before {
+  content: "\e9bd";
+}
+.icon-car-light:before {
+  content: "\e9be";
+}
+.icon-star-half-light:before {
+  content: "\e9bf";
+}
+.icon-copy-simple-light:before {
+  content: "\e9c0";
+}
+.icon-circle-dashed-light:before {
+  content: "\e9c1";
+}
+.icon-cloud-moon-light:before {
+  content: "\e9c2";
+}
+.icon-light-paint-brush:before {
+  content: "\e9c3";
+}
+.icon-light-handshake:before {
+  content: "\e9c4";
+}
+.icon-light-flag-banner:before {
+  content: "\e9c5";
+}
+.icon-thumbs-up:before {
+  content: "\e9c6";
+}
+.icon-thumbs-down:before {
+  content: "\e9c7";
+}
+.icon-pause-circle:before {
+  content: "\e9c8";
+}
+.icon-paper-plane-tilt:before {
+  content: "\e9c9";
+}
+.icon-minus:before {
+  content: "\e9ca";
+}
+.icon-evo:before {
+  content: "\e9cb";
+}
+.icon-dots-three-outline:before {
+  content: "\e9cc";
+}
+.icon-arrows-out-simple:before {
+  content: "\e9cd";
+}
+.icon-arrows-in-simple:before {
+  content: "\e9ce";
+}
+.icon-arrows-clockwise:before {
+  content: "\e9cf";
+}
+.icon-arrow-up-right:before {
+  content: "\e9d0";
+}
+.icon-arrow-counter-clockwise:before {
+  content: "\e9d1";
+}
+.icon-shuffle:before {
+  content: "\e9d2";
+}

package/lib/ui/index.d.ts

@@ -0,0 +1,13 @@
+export * from './ui-button';
+export * from './ui-checkbox';
+export * from './ui-dropdown';
+export * from './ui-full-screen-loader';
+export * from './ui-input';
+export * from './ui-landing-footer';
+export * from './ui-landing-header';
+export * from './ui-loader';
+export * from './ui-phone';
+export * from './ui-radio';
+export * from './ui-timer';
+export * from './ui-icons';
+export * from './ui-autocomplete';

package/lib/ui/ui-autocomplete/index.d.ts

@@ -0,0 +1,2 @@
+export * from './types';
+export { default as UiAutocomplete } from './ui-autocomplete';

package/lib/ui/ui-autocomplete/types.d.ts

@@ -0,0 +1,11 @@
+export declare type UiAutocompleteProps = {
+    expandiblePosition?: 'top' | 'bottom';
+    options: UiAutocompleteOption[];
+    showNoResults?: boolean;
+    onChange: (v: string) => void;
+    onInputChange?: (v: string) => void;
+};
+export declare type UiAutocompleteOption = {
+    label: string;
+    value: string;
+};

package/lib/ui/ui-autocomplete/ui-autocomplete.d.ts

@@ -0,0 +1,5 @@
+import { FC } from "react";
+import { UiInputProps } from "../ui-input";
+import { UiAutocompleteProps } from "./types";
+declare const UiAutocomplete: FC<UiAutocompleteProps & Omit<UiInputProps, 'onChange'>>;
+export default UiAutocomplete;

package/lib/ui/ui-autocomplete/ui-autocomplete.stories.d.ts

@@ -0,0 +1,5 @@
+import React from 'react';
+import { ComponentMeta, ComponentStory } from '@storybook/react';
+declare const _default: ComponentMeta<React.FC<import("./types").UiAutocompleteProps & Omit<import("..").UiInputProps, "onChange">>>;
+export default _default;
+export declare const Default: ComponentStory<React.FC<import("./types").UiAutocompleteProps & Omit<import("..").UiInputProps, "onChange">>>;

package/lib/ui/ui-button/index.d.ts

@@ -0,0 +1,2 @@
+export * from './types';
+export { default as UiButton } from './ui-button';

package/lib/ui/ui-button/types.d.ts

@@ -0,0 +1,24 @@
+import { MouseEvent, ReactNode, FormEvent } from "react";
+export type UiButtonProps = {
+    appereance?: string;
+    children: string | React.ReactNode;
+    className?: string;
+    disabled?: boolean;
+    isLoading?: boolean;
+    icon?: ReactNode;
+    role?: string;
+    onClick: (event: MouseEvent<HTMLButtonElement> | FormEvent<HTMLFormElement>) => void;
+    styles?: ButtonStyles;
+};
+export type StyledButtonProps = ButtonStyles & {
+    appereance: string;
+};
+export type ButtonStyles = {
+    background?: string;
+    color?: string;
+    borderRadius?: string;
+    width?: string;
+    height?: string;
+    borderColor?: string;
+    padding?: string;
+};

package/lib/ui/ui-button/ui-button.d.ts

@@ -0,0 +1,4 @@
+import { FC } from "react";
+import { UiButtonProps } from "./types";
+declare const UiButton: FC<UiButtonProps>;
+export default UiButton;

package/lib/ui/ui-checkbox/index.d.ts

@@ -0,0 +1,2 @@
+export * from './types';
+export { default as UiCheckbox } from './ui-checkbox';

package/lib/ui/ui-checkbox/types.d.ts

@@ -0,0 +1,6 @@
+export declare type UiCheckboxProps = {
+    active: boolean;
+    className?: string;
+    size?: number;
+    onChange: (value: boolean) => void;
+};