@ttoss/components 2.0.8 → 2.0.10

package/src/components/Modal/Modal.tsx

@@ -1,64 +0,0 @@
-import { css as transformStyleObject } from '@theme-ui/css';
-import { useResponsiveValue, useTheme } from '@ttoss/ui';
-import ReactModal from 'react-modal';
-
-ReactModal.defaultStyles = {
-  overlay: {},
-  content: {},
-};
-
-export type ModalProps = ReactModal.Props;
-
-export const Modal = (props: ModalProps) => {
-  const { theme } = useTheme();
-
-  const space = theme.space as Record<string, string>;
-
-  const padding =
-    useResponsiveValue([space?.['lg'], space?.['xl'], space?.['xl']]) || 0;
-
-  const style: ReactModal.Styles = {
-    overlay: transformStyleObject({
-      position: 'fixed',
-      top: 0,
-      left: 0,
-      right: 0,
-      bottom: 0,
-      backgroundColor: 'rgba(0, 0, 0, 0.5)',
-      display: 'flex',
-      justifyContent: 'center',
-      alignItems: 'center',
-      zIndex: 'modal',
-      ...props.style?.overlay,
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    })(theme) as any,
-    content: transformStyleObject({
-      /**
-       * Theme
-       */
-      backgroundColor: 'surface',
-      padding,
-      border: 'default',
-      borderColor: 'surface',
-      borderRadius: 'default',
-      /**
-       * General
-       */
-      WebkitOverflowScrolling: 'touch',
-      overflow: 'auto',
-      position: 'relative',
-      top: '0px',
-      left: '0px',
-      right: '0px',
-      bottom: '0px',
-      maxHeight: '90%',
-      maxWidth: '90%',
-      ...props.style?.content,
-      // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    })(theme) as any,
-  };
-
-  return <ReactModal {...props} style={style} />;
-};
-
-Modal.setAppElement = ReactModal.setAppElement;

package/src/components/Modal/index.ts

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

package/src/components/Search/Search.tsx

@@ -1,36 +0,0 @@
-import * as React from 'react';
-import { Input, type InputProps } from '@ttoss/ui';
-import { useDebounce } from '@ttoss/react-hooks';
-
-export type SearchProps = Omit<InputProps, 'onChange'> & {
-  loading?: boolean;
-  debounce?: number;
-  onChange: (value?: InputProps['value']) => void;
-};
-
-export const Search = ({
-  value,
-  defaultValue,
-  loading,
-  onChange,
-  ...props
-}: SearchProps) => {
-  const [text, setText] = React.useState(value ?? defaultValue);
-
-  const debouncedValue = useDebounce(text, 500);
-
-  React.useEffect(() => {
-    onChange(debouncedValue);
-  }, [debouncedValue, onChange]);
-
-  return (
-    <Input
-      leadingIcon={loading ? 'loading' : 'search'}
-      defaultValue={text}
-      onChange={(e) => {
-        return setText(e.target.value);
-      }}
-      {...props}
-    />
-  );
-};

package/src/components/Search/index.ts

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

package/src/components/Table/Table.tsx

@@ -1,36 +0,0 @@
-import { Box, BoxProps } from '@ttoss/ui';
-
-// eslint-disable-next-line react-refresh/only-export-components
-export * from '@tanstack/react-table';
-
-export const Table = (props: BoxProps) => {
-  return <Box as="table" {...props} />;
-};
-
-export const TableHead = (props: BoxProps) => {
-  return <Box as="thead" {...props} />;
-};
-
-export const TableBody = (props: BoxProps) => {
-  return <Box as="tbody" {...props} />;
-};
-
-export const TableRow = (props: BoxProps) => {
-  return <Box as="tr" {...props} />;
-};
-
-export const TableCell = (props: BoxProps) => {
-  return <Box as="td" {...props} />;
-};
-
-export const TableHeader = (props: BoxProps) => {
-  return <Box as="th" {...props} />;
-};
-
-export const TableCaption = (props: BoxProps) => {
-  return <Box as="caption" {...props} />;
-};
-
-export const TableFooter = (props: BoxProps) => {
-  return <Box as="tfoot" {...props} />;
-};

package/src/components/Table/index.ts

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

package/src/components/Toast/Toast.tsx

@@ -1,37 +0,0 @@
-import * as React from 'react';
-import { Box } from '@ttoss/ui';
-import {
-  ToastContainer as ReactToastifyToastContainer,
-  type ToastContainerProps,
-  toast,
-} from 'react-toastify';
-import { injectStyle } from 'react-toastify/dist/inject-style';
-
-export { toast };
-
-export { type ToastContainerProps };
-
-export const ToastContainer = (props: ToastContainerProps) => {
-  React.useEffect(() => {
-    injectStyle();
-  }, []);
-
-  return (
-    <Box
-      sx={({ colors, fonts }) => {
-        return {
-          '--toastify-color-light': '#fff',
-          '--toastify-color-dark': '#121212',
-          '--toastify-color-info': colors?.info || '#3498db',
-          '--toastify-color-success': colors?.success || '#07bc0c',
-          '--toastify-color-warning': '#f1c40f',
-          '--toastify-color-error': '#e74c3c',
-          '--toastify-color-progress-light': `linear-gradient(to right, ${colors?.primary}, ${colors?.secondary})`,
-          '--toastify-font-family': (fonts as { body: string }).body,
-        };
-      }}
-    >
-      <ReactToastifyToastContainer {...props} />
-    </Box>
-  );
-};

package/src/components/Toast/index.ts

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