@eccenca/gui-elements 23.1.0 → 23.2.0-rc.1

package/src/index.ts

@@ -1,223 +1,18 @@
-import ApplicationContainer from "./components/Application/ApplicationContainer";
-import ApplicationHeader from "./components/Application/ApplicationHeader";
-import ApplicationContent from "./components/Application/ApplicationContent";
-import ApplicationSidebarNavigation from "./components/Application/ApplicationSidebarNavigation";
-import ApplicationSidebarToggler from "./components/Application/ApplicationSidebarToggler";
-import ApplicationTitle from "./components/Application/ApplicationTitle";
-import ApplicationToolbar from "./components/Application/ApplicationToolbar";
-import ApplicationToolbarSection from "./components/Application/ApplicationToolbarSection";
-import ApplicationToolbarAction from "./components/Application/ApplicationToolbarAction";
-import ApplicationToolbarPanel from "./components/Application/ApplicationToolbarPanel";
-import AutoSuggestion from "./components/AutoSuggestion/AutoSuggestion";
-import { AutoSuggestionList } from "./components/AutoSuggestion/AutoSuggestionList";
-import SingleLineCodeEditor from "./components/AutoSuggestion/SingleLineCodeEditor";
-
-import Grid from "./components/Grid/Grid";
-import GridRow from "./components/Grid/GridRow";
-import GridColumn from "./components/Grid/GridColumn";
-
-import { HoverToggler } from "./components/HoverToggler/HoverToggler";
-
-import WorkspaceContent from "./components/Workspace/WorkspaceContent";
-import WorkspaceMain from "./components/Workspace/WorkspaceMain";
-import WorkspaceSide from "./components/Workspace/WorkspaceSide";
-import WorkspaceHeader from "./components/Workspace/WorkspaceHeader";
-
-import IconButton from "./components/Icon/IconButton";
-
-import Label from "./components/Label/Label";
-import Button from "./components/Button/Button";
-import Checkbox from "./components/Checkbox/Checkbox";
-import RadioButton from "./components/RadioButton/RadioButton";
-import Tabs from "./components/Tabs/Tabs";
-import Tab from "./components/Tabs/Tab";
-import TabTitle from "./components/Tabs/TabTitle";
-import TabPanel from "./components/Tabs/TabPanel";
-import TextField from "./components/TextField/TextField";
-import TextArea from "./components/TextField/TextArea";
-import SearchField from "./components/TextField/SearchField";
-import Switch from "./components/Switch/Switch";
-import NumericInput from "./components/NumericInput/NumericInput";
-import FieldItem from "./components/Form/FieldItem";
-import FieldItemRow from "./components/Form/FieldItemRow";
-import FieldSet from "./components/Form/FieldSet";
-import { AutoCompleteField } from "./components/AutocompleteField/AutoCompleteField";
-
-import Menu from "./components/Menu/Menu";
-import MenuItem from "./components/Menu/MenuItem";
-import MenuDivider from "./components/Menu/MenuDivider";
-
-import ContextOverlay from "./components/ContextOverlay/ContextOverlay";
-import ContextMenu from "./components/ContextOverlay/ContextMenu";
-
-import Pagination from "./components/Pagination/Pagination";
-
-import Notification from "./components/Notification/Notification";
-import Toast from "./components/Notification/Toast";
-
-import Select from "./components/Select/Select";
-import MultiSelect from "./components/MultiSelect/MultiSelect";
-
-import { Iframe } from "./components/Iframe/Iframe";
-import { IframeModal } from "./components/Iframe/IframeModal";
-
-import {
-    OverviewItem,
-    OverviewItemActions,
-    OverviewItemDepiction,
-    OverviewItemDescription,
-    OverviewItemLine,
-    OverviewItemList,
-} from "./components/OverviewItem";
-
-import BreadcrumbList from "./components/Breadcrumb/BreadcrumbList";
-import BreadcrumbItem from "./components/Breadcrumb/BreadcrumbItem";
-
-import Modal from "./components/Dialog/Modal";
-import SimpleDialog from "./components/Dialog/SimpleDialog";
-import AlertDialog from "./components/Dialog/AlertDialog";
-
-import { Card, CardHeader, CardTitle, CardOptions, CardContent, CardActions, CardActionsAux } from "./components/Card";
-
-import Spacing from "./components/Separation/Spacing";
-import Divider from "./components/Separation/Divider";
-
-import Tooltip from "./components/Tooltip/Tooltip";
-
-import Toolbar from "./components/Toolbar/Toolbar";
-import ToolbarSection from "./components/Toolbar/ToolbarSection";
-
-import Section from "./components/Structure/Section";
-import SectionHeader from "./components/Structure/SectionHeader";
-import TitlePage from "./components/Structure/TitlePage";
-import TitleMainsection from "./components/Structure/TitleMainsection";
-import TitleSubsection from "./components/Structure/TitleSubsection";
-
-import Accordion from "./components/Accordion/Accordion";
-import AccordionItem from "./components/Accordion/AccordionItem";
-
-import Link from "./components/Link/Link";
-
-import Spinner from "./components/Spinner/Spinner";
-import InteractionGate from "./components/InteractionGate/InteractionGate";
-
-import { PropertyName, PropertyValue, PropertyValuePair, PropertyValueList } from "./components/PropertyValuePair";
-
-import List from "./components/List/List";
-
-import * as LegacyReplacements from "./legacy-replacements";
-
-import * as TypographyClassNames from "./components/Typography/classnames";
 import { ClassNames as IntentClassNames } from "./common/Intent";
+import * as TypographyClassNames from "./components/Typography/classnames";
+import * as LegacyReplacements from "./legacy-replacements";
 
-import { openInNewTab } from "./common/utils/openInNewTab";
-import decideContrastColorValue from "./common/utils/colorDecideContrastvalue";
-
-const HelperClasses = {
+const ClassNames = {
     Typography: TypographyClassNames,
     Intent: IntentClassNames,
 };
+// @deprecated use `ClassNames`
+const HelperClasses = ClassNames;
 
-const Utilities = {
-    openInNewTab,
-    decideContrastColorValue,
-};
-
-export {
-    ApplicationContainer,
-    ApplicationHeader,
-    ApplicationContent,
-    ApplicationSidebarNavigation,
-    ApplicationSidebarToggler,
-    ApplicationTitle,
-    ApplicationToolbar,
-    ApplicationToolbarSection,
-    ApplicationToolbarAction,
-    ApplicationToolbarPanel,
-    AutoSuggestion,
-    AutoSuggestionList,
-    SingleLineCodeEditor,
-    Grid,
-    GridRow,
-    GridColumn,
-    List,
-    WorkspaceContent,
-    WorkspaceMain,
-    WorkspaceSide,
-    WorkspaceHeader,
-    Menu,
-    MenuItem,
-    MenuDivider,
-    ContextOverlay,
-    ContextMenu,
-    OverviewItem,
-    OverviewItemDepiction,
-    OverviewItemDescription,
-    OverviewItemLine,
-    OverviewItemActions,
-    OverviewItemList,
-    IconButton,
-    Label,
-    Button,
-    Checkbox,
-    RadioButton,
-    Tabs,
-    Tab,
-    TabTitle,
-    TabPanel,
-    TextField,
-    TextArea,
-    SearchField,
-    Switch,
-    NumericInput,
-    FieldItem,
-    FieldItemRow,
-    FieldSet,
-    BreadcrumbList,
-    BreadcrumbItem,
-    Modal,
-    SimpleDialog,
-    AlertDialog,
-    Card,
-    CardHeader,
-    CardTitle,
-    CardOptions,
-    CardContent,
-    CardActions,
-    CardActionsAux,
-    HoverToggler,
-    Spacing,
-    Divider,
-    Tooltip,
-    Section,
-    SectionHeader,
-    TitlePage,
-    TitleMainsection,
-    TitleSubsection,
-    Accordion,
-    AccordionItem,
-    Toolbar,
-    ToolbarSection,
-    Pagination,
-    Notification,
-    Link,
-    Spinner,
-    InteractionGate,
-    PropertyName,
-    PropertyValue,
-    PropertyValuePair,
-    PropertyValueList,
-    Toast,
-    HelperClasses,
-    Select,
-    MultiSelect,
-    AutoCompleteField,
-    Iframe,
-    IframeModal,
-    Utilities,
-    LegacyReplacements,
-};
-
+export * from "./configuration/constants";
+export * from "./common";
 export * from "./components";
 export * from "./extensions";
 export * from "./cmem";
+
+export { ClassNames, HelperClasses, LegacyReplacements };

package/src/components/AutocompleteField/stories/AutoCompleteField.stories.tsx

@@ -1,86 +0,0 @@
-import React from "react";
-import {ComponentMeta, ComponentStory} from "@storybook/react";
-
-import {AutoCompleteField, IAutoCompleteFieldProps} from "../AutoCompleteField";
-import {extractSearchWords, matchesAllWords} from "../../Typography/Highlighter";
-import {createNewItemRendererFactory} from "../autoCompleteFieldUtils";
-
-const AutoCompleteFieldStory: ComponentMeta<typeof AutoCompleteField> = {
-    title: "Forms/AutoCompleteField",
-    component: AutoCompleteField,
-    argTypes: {
-    },
-}
-
-const Template: ComponentStory<typeof AutoCompleteField> = (args) => (
-    <AutoCompleteField {...args}></AutoCompleteField>
-);
-
-export const Default = Template.bind({});
-export const AdaptQueryAfterSelection = Template.bind({})
-export const AllowReset = Template.bind({})
-export const AllowCustomValues = Template.bind({})
-export const ReadOnlyState = Template.bind({})
-
-// Renders string values as string
-const defaultRenderer = (item: string) => item
-
-const defaultArgs: IAutoCompleteFieldProps<string, string> = {
-    itemRenderer: (item: string) => `Rendered item: ${item}`,
-    itemValueRenderer: (item: string) => `Selected item: ${item}`,
-    itemValueString: (item: string) => `Query: ${item}`,
-    onSearch: (query: string) => {
-        const multiWord = extractSearchWords(query, true)
-        return ["search item A", "search element B", "search object C"]
-            .filter(word => matchesAllWords(word.toLowerCase(), multiWord))
-    },
-    onChange: elem => {
-        console.log(`Entry '${elem}' selected!`)
-    },
-    itemValueSelector: defaultRenderer,
-    noResultText: "No result",
-}
-
-// Changes the search query for the selected item, e.g. when the rendered item text should be different from the query finding this item.
-const adaptQueryAfterSelection: IAutoCompleteFieldProps<string, string> = {
-    ...defaultArgs,
-    resetQueryToValue: (selectedValue: string) => selectedValue
-}
-
-// Allows to reset a selection
-const resetSelection: IAutoCompleteFieldProps<string, string> = {
-    ...defaultArgs,
-    reset: {
-        resetValue: "",
-        resetButtonText: "Clear selected value",
-        resettableValue: (value: string) => true
-    }
-}
-
-const allowCustomValues: IAutoCompleteFieldProps<string, string> = {
-    ...defaultArgs,
-    createNewItem: {
-        itemRenderer: createNewItemRendererFactory(
-            (query: string) => `Create new item: ${query}`,
-            "item-add-artefact"
-        ),
-        itemFromQuery: item => item,
-    }
-}
-
-// Changes the search query for the selected item, e.g. when the rendered item text should be different from the query finding this item.
-const readOnlyState: IAutoCompleteFieldProps<string, string> = {
-    ...defaultArgs,
-    initialValue: "search item B",
-    inputProps: {
-        readOnly: true
-    }
-}
-
-Default.args = defaultArgs;
-AdaptQueryAfterSelection.args = adaptQueryAfterSelection;
-AllowReset.args = resetSelection;
-AllowCustomValues.args = allowCustomValues;
-ReadOnlyState.args = readOnlyState;
-
-export default AutoCompleteFieldStory