@rulab/adminjs-components 0.1.0-alpha.8 → 0.1.0-beta.1

package/src/components/Editor/config.d.ts

@@ -1,29 +0,0 @@
-import Quote from "@editorjs/quote";
-import Table from "@editorjs/table";
-export declare const EDITOR_TOOLS: {
-    paragraph: {
-        class: any;
-        inlineToolbar: boolean;
-    };
-    list: {
-        class: any;
-        inlineToolbar: boolean;
-    };
-    header: {
-        class: any;
-        config: {
-            placeholder: string;
-            levels: number[];
-            defaultLevel: number;
-        };
-    };
-    table: {
-        class: typeof Table;
-        inlineToolbar: boolean;
-    };
-    quote: {
-        class: typeof Quote;
-        inlineToolbar: boolean;
-    };
-    audioPlayer: any;
-};

package/src/components/Editor/config.js

@@ -1,34 +0,0 @@
-import Header from "@editorjs/header";
-import List from "@editorjs/list";
-import Paragraph from "@editorjs/paragraph";
-import Quote from "@editorjs/quote";
-import Table from "@editorjs/table";
-// @ts-ignore
-import AudioPlayer from "editorjs-audio-player";
-export const EDITOR_TOOLS = {
-    paragraph: {
-        class: Paragraph,
-        inlineToolbar: true,
-    },
-    list: {
-        class: List,
-        inlineToolbar: true,
-    },
-    header: {
-        class: Header,
-        config: {
-            placeholder: "Enter a header",
-            levels: [2, 3, 4],
-            defaultLevel: 2,
-        },
-    },
-    table: {
-        class: Table,
-        inlineToolbar: true,
-    },
-    quote: {
-        class: Quote,
-        inlineToolbar: true,
-    },
-    audioPlayer: AudioPlayer,
-};

package/src/components/Editor/config.ts

@@ -1,35 +0,0 @@
-import Header from "@editorjs/header";
-import List from "@editorjs/list";
-import Paragraph from "@editorjs/paragraph";
-import Quote from "@editorjs/quote";
-import Table from "@editorjs/table";
-// @ts-ignore
-import AudioPlayer from "editorjs-audio-player";
-
-export const EDITOR_TOOLS = {
-  paragraph: {
-    class: Paragraph,
-    inlineToolbar: true,
-  },
-  list: {
-    class: List,
-    inlineToolbar: true,
-  },
-  header: {
-    class: Header,
-    config: {
-      placeholder: "Enter a header",
-      levels: [2, 3, 4],
-      defaultLevel: 2,
-    },
-  },
-  table: {
-    class: Table,
-    inlineToolbar: true,
-  },
-  quote: {
-    class: Quote,
-    inlineToolbar: true,
-  },
-  audioPlayer: AudioPlayer,
-};

package/src/components/Editor/index.d.ts

@@ -1,3 +0,0 @@
-export * from "./Editor.jsx";
-export * from "./EditorShow.jsx";
-export * from "./EditorList.jsx";

package/src/components/Editor/index.js

@@ -1,3 +0,0 @@
-export * from "./Editor.jsx";
-export * from "./EditorShow.jsx";
-export * from "./EditorList.jsx";

package/src/components/Editor/index.ts

@@ -1,3 +0,0 @@
-export * from "./Editor.jsx";
-export * from "./EditorShow.jsx";
-export * from "./EditorList.jsx";

package/src/components/Editor/styles.d.ts

@@ -1,6 +0,0 @@
-export declare const StyledLabel: any;
-export declare const StyledShowLabel: any;
-export declare const StyledEditorWrapper: any;
-export declare const StyledEditorViewWrapper: any;
-export declare const StyledEditorShowWrapper: any;
-export declare const StyledEditor: any;

package/src/components/Editor/styles.js

@@ -1,145 +0,0 @@
-import { Box } from "@adminjs/design-system";
-import { styled } from "@adminjs/design-system/styled-components";
-export const StyledLabel = styled.div `
-  font-size: 12px;
-  margin-bottom: 8px;
-  text-transform: capitalize;
-`;
-export const StyledShowLabel = styled(StyledLabel) `
-  color: rgb(137, 138, 154);
-  font-weight: 300;
-`;
-export const StyledEditorWrapper = styled(Box) `
-  padding: 12px;
-  margin-bottom: 24px;
-  border: 1px solid rgb(187, 195, 203);
-`;
-export const StyledEditorViewWrapper = styled(Box) `
-  h1,
-  h2,
-  h3 {
-    margin-bottom: 5px;
-    font-weight: bold;
-  }
-
-  h1 {
-    font-size: 18px;
-  }
-
-  h2 {
-    font-size: 16px;
-  }
-
-  h3 {
-    font-size: 14px;
-  }
-
-  p {
-    margin-bottom: 8px;
-  }
-
-  ol,
-  ul {
-    margin-left: 20px;
-    margin-bottom: 8px;
-  }
-
-  ol {
-    list-style: auto;
-  }
-
-  ul {
-    list-style: inherit;
-  }
-
-  table,
-  audio {
-    margin: 16px 0;
-  }
-
-  table,
-  th,
-  td {
-    border: 1px solid;
-  }
-
-  th {
-    font-weight: bold;
-  }
-
-  th,
-  td {
-    padding: 4px;
-  }
-
-  blockquote {
-    display: block;
-    padding: 5px 8px;
-    width: fit-content;
-    border-radius: 4px;
-    background-color: #e6e6e6;
-  }
-`;
-export const StyledEditorShowWrapper = styled(StyledEditorViewWrapper) `
-  margin-bottom: 24px;
-`;
-export const StyledEditor = styled.div `
-  audio,
-  .cdx-block,
-  .ce-header {
-    padding-left: 58px;
-  }
-
-  input {
-    margin-left: 58px;
-    width: auto;
-  }
-
-  .cdx-list {
-    padding-left: 85px;
-  }
-
-  .ce-block__content {
-    width: 100%;
-    max-width: none;
-  }
-
-  .ce-toolbar__content {
-    max-width: none;
-    left: 0;
-  }
-
-  .ce-toolbar__actions {
-    left: 0;
-  }
-
-  h1.ce-header {
-    font-size: 22px;
-    font-weight: bold;
-  }
-
-  h2.ce-header {
-    font-size: 20px;
-    font-weight: bold;
-  }
-
-  h3.ce-header {
-    font-size: 18px;
-    font-weight: bold;
-  }
-
-  h4.ce-header {
-    font-size: 16px;
-    font-weight: bold;
-  }
-
-  h5.ce-header {
-    font-size: 15px;
-    font-weight: bold;
-  }
-
-  h6.ce-header {
-    font-size: 14px;
-    font-weight: bold;
-  }
-`;

package/src/components/Editor/styles.ts

@@ -1,151 +0,0 @@
-import { Box } from "@adminjs/design-system";
-import { styled } from "@adminjs/design-system/styled-components";
-
-export const StyledLabel = styled.div`
-  font-size: 12px;
-  margin-bottom: 8px;
-  text-transform: capitalize;
-`;
-
-export const StyledShowLabel = styled(StyledLabel)`
-  color: rgb(137, 138, 154);
-  font-weight: 300;
-`;
-
-export const StyledEditorWrapper = styled(Box)`
-  padding: 12px;
-  margin-bottom: 24px;
-  border: 1px solid rgb(187, 195, 203);
-`;
-
-export const StyledEditorViewWrapper = styled(Box)`
-  h1,
-  h2,
-  h3 {
-    margin-bottom: 5px;
-    font-weight: bold;
-  }
-
-  h1 {
-    font-size: 18px;
-  }
-
-  h2 {
-    font-size: 16px;
-  }
-
-  h3 {
-    font-size: 14px;
-  }
-
-  p {
-    margin-bottom: 8px;
-  }
-
-  ol,
-  ul {
-    margin-left: 20px;
-    margin-bottom: 8px;
-  }
-
-  ol {
-    list-style: auto;
-  }
-
-  ul {
-    list-style: inherit;
-  }
-
-  table,
-  audio {
-    margin: 16px 0;
-  }
-
-  table,
-  th,
-  td {
-    border: 1px solid;
-  }
-
-  th {
-    font-weight: bold;
-  }
-
-  th,
-  td {
-    padding: 4px;
-  }
-
-  blockquote {
-    display: block;
-    padding: 5px 8px;
-    width: fit-content;
-    border-radius: 4px;
-    background-color: #e6e6e6;
-  }
-`;
-
-export const StyledEditorShowWrapper = styled(StyledEditorViewWrapper)`
-  margin-bottom: 24px;
-`;
-
-export const StyledEditor = styled.div`
-  audio,
-  .cdx-block,
-  .ce-header {
-    padding-left: 58px;
-  }
-
-  input {
-    margin-left: 58px;
-    width: auto;
-  }
-
-  .cdx-list {
-    padding-left: 85px;
-  }
-
-  .ce-block__content {
-    width: 100%;
-    max-width: none;
-  }
-
-  .ce-toolbar__content {
-    max-width: none;
-    left: 0;
-  }
-
-  .ce-toolbar__actions {
-    left: 0;
-  }
-
-  h1.ce-header {
-    font-size: 22px;
-    font-weight: bold;
-  }
-
-  h2.ce-header {
-    font-size: 20px;
-    font-weight: bold;
-  }
-
-  h3.ce-header {
-    font-size: 18px;
-    font-weight: bold;
-  }
-
-  h4.ce-header {
-    font-size: 16px;
-    font-weight: bold;
-  }
-
-  h5.ce-header {
-    font-size: 15px;
-    font-weight: bold;
-  }
-
-  h6.ce-header {
-    font-size: 14px;
-    font-weight: bold;
-  }
-`;

package/src/components/Slug/SlugEdit.d.ts

@@ -1,5 +0,0 @@
-import { EditPropertyProps } from "adminjs";
-import { FC } from "react";
-type CustomSlugTypes = Omit<EditPropertyProps, "where">;
-declare const SlugEdit: FC<CustomSlugTypes>;
-export default SlugEdit;

package/src/components/Slug/SlugEdit.js

@@ -1,27 +0,0 @@
-import React, { useEffect, useState, } from "react";
-import { ThemeProvider } from "styled-components";
-import { theme } from "@adminjs/design-system";
-import { slugifyTitle } from "../../utils";
-import { StyledCustomInput, StyledGenerateButton, StyledInputWrapper, StyledLabel, } from "./styles.js";
-const SlugEdit = ({ property, record, resource, onChange, }) => {
-    const [inputValue, setInputValue] = useState(record.params.slug);
-    useEffect(() => {
-        onChange(property.path, inputValue);
-    }, [inputValue]);
-    return (React.createElement(ThemeProvider, { theme: theme },
-        React.createElement(StyledLabel, { htmlFor: "customSlug" }, property.path),
-        React.createElement(StyledInputWrapper, null,
-            React.createElement(StyledCustomInput, { id: property.path, name: property.path, value: inputValue, onChange: handleInput }),
-            React.createElement(StyledGenerateButton, { variant: "outlined", onClick: generateSlug }, "Generate Slug"))));
-    function handleInput(e) {
-        setInputValue(e.target.value);
-    }
-    function generateSlug(e) {
-        e.preventDefault();
-        const slugSource = record.params[property.props.sourceField ?? resource.titleProperty.name];
-        if (slugSource) {
-            setInputValue(slugifyTitle(slugSource));
-        }
-    }
-};
-export default SlugEdit;

package/src/components/Slug/SlugEdit.tsx

@@ -1,68 +0,0 @@
-import { EditPropertyProps } from "adminjs";
-import React, {
-  ChangeEvent,
-  FC,
-  SyntheticEvent,
-  useEffect,
-  useState,
-} from "react";
-import { ThemeProvider } from "styled-components";
-
-import { theme } from "@adminjs/design-system";
-
-import { slugifyTitle } from "../../utils";
-
-import {
-  StyledCustomInput,
-  StyledGenerateButton,
-  StyledInputWrapper,
-  StyledLabel,
-} from "./styles.js";
-
-type CustomSlugTypes = Omit<EditPropertyProps, "where">;
-
-const SlugEdit: FC<CustomSlugTypes> = ({
-  property,
-  record,
-  resource,
-  onChange,
-}) => {
-  const [inputValue, setInputValue] = useState(record.params.slug);
-
-  useEffect(() => {
-    onChange(property.path, inputValue);
-  }, [inputValue]);
-
-  return (
-    <ThemeProvider theme={theme}>
-      <StyledLabel htmlFor="customSlug">{property.path}</StyledLabel>
-      <StyledInputWrapper>
-        <StyledCustomInput
-          id={property.path}
-          name={property.path}
-          value={inputValue}
-          onChange={handleInput}
-        />
-        <StyledGenerateButton variant="outlined" onClick={generateSlug}>
-          Generate Slug
-        </StyledGenerateButton>
-      </StyledInputWrapper>
-    </ThemeProvider>
-  );
-
-  function handleInput(e: ChangeEvent<HTMLInputElement>) {
-    setInputValue(e.target.value);
-  }
-
-  function generateSlug(e: SyntheticEvent<HTMLInputElement>) {
-    e.preventDefault();
-    const slugSource =
-      record.params[property.props.sourceField ?? resource.titleProperty.name];
-
-    if (slugSource) {
-      setInputValue(slugifyTitle(slugSource));
-    }
-  }
-};
-
-export default SlugEdit;

package/src/components/Slug/SlugFeature.d.ts

@@ -1,7 +0,0 @@
-import { ComponentLoader, FeatureType } from "adminjs";
-type SlugOptions = {
-    componentLoader: ComponentLoader;
-    key: string;
-};
-declare const SlugFeature: (config: SlugOptions) => FeatureType;
-export default SlugFeature;

package/src/components/Slug/SlugFeature.js

@@ -1,21 +0,0 @@
-import { buildFeature } from "adminjs";
-import { bundleComponent } from "../../utils/bundle-component";
-const COMPONENT_NAME = 'Slug';
-const SlugFeature = (config) => {
-    const { componentLoader, key } = config;
-    const slugFeature = () => {
-        const editComponent = bundleComponent(componentLoader, COMPONENT_NAME, 'SlugEdit.tsx');
-        return buildFeature({
-            properties: {
-                [key]: {
-                    isVisible: { show: false, edit: true, list: false, filter: false },
-                    components: {
-                        edit: editComponent,
-                    },
-                },
-            },
-        });
-    };
-    return slugFeature();
-};
-export default SlugFeature;

package/src/components/Slug/SlugFeature.ts

@@ -1,30 +0,0 @@
-import {buildFeature, ComponentLoader, FeatureType} from "adminjs";
-import {bundleComponent} from "../../utils/bundle-component";
-
-const COMPONENT_NAME = 'Slug'
-
-type SlugOptions = {
-    componentLoader: ComponentLoader
-    key: string
-}
-const SlugFeature = (config: SlugOptions): FeatureType => {
-    const {componentLoader,key} = config
-
-    const slugFeature = () => {
-        const editComponent = bundleComponent(componentLoader, COMPONENT_NAME, 'SlugEdit')
-        return buildFeature({
-            properties: {
-                [key]: {
-                    isVisible: { show: false, edit: true, list: false, filter: false },
-                    components: {
-                        edit: editComponent,
-                    },
-                },
-            },
-        })
-    }
-
-    return slugFeature()
-}
-
-export default SlugFeature

package/src/components/Slug/index.d.ts

@@ -1 +0,0 @@
-export { default } from "./SlugFeature.js";

package/src/components/Slug/index.js

@@ -1 +0,0 @@
-export { default } from "./SlugFeature.js";

package/src/components/Slug/index.ts

@@ -1 +0,0 @@
-export { default } from "./SlugFeature.js";

package/src/components/Slug/styles.d.ts

@@ -1,4 +0,0 @@
-export declare const StyledInputWrapper: any;
-export declare const StyledCustomInput: any;
-export declare const StyledGenerateButton: any;
-export declare const StyledLabel: any;

package/src/components/Slug/styles.js

@@ -1,20 +0,0 @@
-// @ts-ignore
-import { styled } from "@adminjs/design-system/styled-components";
-// @ts-ignore
-import { Box, Button, Input } from "@adminjs/design-system";
-export const StyledInputWrapper = styled(Box) `
-  display: flex;
-  margin-bottom: 40px;
-`;
-export const StyledCustomInput = styled(Input) `
-  width: 100%;
-  margin-right: 10px;
-`;
-export const StyledGenerateButton = styled(Button) `
-  white-space: nowrap;
-`;
-export const StyledLabel = styled.div `
-  font-size: 12px;
-  margin-bottom: 8px;
-  text-transform: capitalize;
-`;

package/src/components/Slug/styles.ts

@@ -1,24 +0,0 @@
-// @ts-ignore
-import { styled } from "@adminjs/design-system/styled-components";
-// @ts-ignore
-import { Box, Button, Input } from "@adminjs/design-system";
-
-export const StyledInputWrapper = styled(Box)`
-  display: flex;
-  margin-bottom: 40px;
-`;
-
-export const StyledCustomInput = styled(Input)`
-  width: 100%;
-  margin-right: 10px;
-`;
-
-export const StyledGenerateButton = styled(Button)`
-  white-space: nowrap;
-`;
-
-export const StyledLabel = styled.div`
-  font-size: 12px;
-  margin-bottom: 8px;
-  text-transform: capitalize;
-`;

package/src/components/StringList/SortableList/SortableList.d.ts

@@ -1,18 +0,0 @@
-import React from "react";
-import type { ReactNode } from "react";
-import { SortableItem } from "./components/index.js";
-import type { UniqueIdentifier } from "@dnd-kit/core";
-interface BaseItem {
-    id: UniqueIdentifier;
-    value: string;
-}
-interface Props<T extends BaseItem> {
-    items: T[];
-    onChange(items: T[]): void;
-    renderItem(item: T): ReactNode;
-}
-export declare function SortableList<T extends BaseItem>({ items, onChange, renderItem, }: Props<T>): React.JSX.Element;
-export declare namespace SortableList {
-    var Item: typeof SortableItem;
-}
-export {};