ish-ui 1.0.13 → 1.0.15

package/README.md

@@ -2,6 +2,7 @@
 
 UI elements for onCourse and other ish apps
 
+[![npm latest package](https://img.shields.io/npm/v/ish-ui/latest.svg)](https://www.npmjs.com/package/ish-ui)
 
 ## Installation
 
@@ -77,4 +78,4 @@ tools/webpack/webpack.config.dev.js
 
 # Production webpack config
 tools/webpack/webpack.config.prod.js
-```
+```

package/dist/Demo.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export declare const muiCache: import("@emotion/utils").EmotionCache;
+declare function Demo(): React.JSX.Element;
+export default Demo;

package/dist/Demo.js

@@ -0,0 +1,37 @@
+/*
+ * Copyright ish group pty ltd. All rights reserved. https://www.ish.com.au
+ * No copying or use of this code is allowed without permission in writing from ish.
+ */
+import React from 'react';
+import { CacheProvider } from '@emotion/react';
+import createCache from '@emotion/cache';
+import { ThemeProvider } from '@mui/material/styles';
+import { Box, Grid } from '@mui/material';
+import CssBaseline from '@mui/material/CssBaseline';
+import { defaultTheme } from './themes';
+import { GlobalStylesProvider } from './styles';
+import { DemoField } from './DemoField';
+export const muiCache = createCache({
+    key: 'mui',
+    prepend: true,
+});
+function Demo() {
+    return (React.createElement(CacheProvider, { value: muiCache },
+        React.createElement(ThemeProvider, { theme: defaultTheme },
+            React.createElement(CssBaseline, null),
+            React.createElement(GlobalStylesProvider, null,
+                React.createElement(Box, { sx: {
+                        width: '100vw',
+                        height: '100vh',
+                        padding: 4
+                    } },
+                    React.createElement(Grid, { container: true, columnSpacing: 3, rowSpacing: 2 },
+                        React.createElement(Grid, { item: true, xs: 6 },
+                            React.createElement(DemoField, { label: "Test phone", type: "phone" })),
+                        React.createElement(Grid, { item: true, xs: 6 },
+                            React.createElement(DemoField, { label: "Test text", type: "text" })),
+                        React.createElement(Grid, { item: true, xs: 6 }),
+                        React.createElement(Grid, { item: true, xs: 6 }),
+                        React.createElement(Grid, { item: true, xs: 6 })))))));
+}
+export default Demo;

package/dist/DemoField.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+import { FormFieldProps } from './model';
+export declare function DemoField(props: FormFieldProps): React.JSX.Element;

package/dist/DemoField.js

@@ -0,0 +1,87 @@
+/*
+ * Copyright ish group pty ltd 2023.
+ *
+ * This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License version 3 as published by the Free Software Foundation.
+ *
+ *  This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more details.
+ */
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React, { useMemo, useState } from 'react';
+import { stubFunction } from './utils';
+import { CheckboxField, CodeEditorField, ColoredCheckBox, EditInPlaceDateTimeField, EditInPlaceDurationField, EditInPlaceField, EditInPlaceFileField, EditInPlaceMoneyField, EditInPlacePhoneField, EditInPlaceSearchSelect, FormSwitch } from './formFields';
+import { TagInputList } from './tagsInput';
+const stubFieldMocks = { input: { onChange: stubFunction, onBlur: stubFunction }, format: null, debounced: null };
+export function DemoField(props) {
+    const { type } = props, rest = __rest(props, ["type"]);
+    const { input, format, debounced = true } = type !== 'stub'
+        ? props
+        : stubFieldMocks;
+    // const currencySymbol = useAppSelector(state => state.currency?.shortCurrencySymbol);
+    // const processActionId = useAppSelector(state => state.fieldProcessing[input?.name]);
+    //
+    // const entity = type === "remoteDataSelect" ? props.entity : null;
+    //
+    // const color = type === "coloredCheckbox" ? props.color : null;
+    //
+    // const rootEntity = type === "aql" ? props.rootEntity : null;
+    //
+    // const tags = type === "tags" ? props.tags : null;
+    const [value, setValue] = useState(undefined);
+    const inputProxy = useMemo(() => (Object.assign(Object.assign({}, input || {}), { value, onChange: e => {
+            const val = (e === null || e === void 0 ? void 0 : e.target) ? e.target.value : e;
+            setValue(format ? format(val) : val);
+        }, onBlur: e => {
+            const val = (e === null || e === void 0 ? void 0 : e.target) ? e.target.value : e;
+            setValue(format ? format(val) : val);
+        } })), [value, input]);
+    const sharedProps = Object.assign(Object.assign(Object.assign({}, rest), debounced ? { input: inputProxy } : {}), { meta: {} });
+    switch (type) {
+        case 'phone':
+            return React.createElement(EditInPlacePhoneField, Object.assign({}, sharedProps));
+        case 'duration':
+            return React.createElement(EditInPlaceDurationField, Object.assign({}, sharedProps));
+        case 'file':
+            return React.createElement(EditInPlaceFileField, Object.assign({}, sharedProps));
+        case 'money':
+            return React.createElement(EditInPlaceMoneyField, Object.assign({}, sharedProps, { currencySymbol: "$" }));
+        case 'select':
+            return React.createElement(EditInPlaceSearchSelect, Object.assign({}, sharedProps));
+        case 'number':
+            return React.createElement(EditInPlaceField, Object.assign({}, sharedProps, { type: "number" }));
+        case 'date':
+            return React.createElement(EditInPlaceDateTimeField, Object.assign({}, sharedProps, { type: "date" }));
+        case 'time':
+            return React.createElement(EditInPlaceDateTimeField, Object.assign({}, sharedProps, { type: "time" }));
+        case 'dateTime':
+            return React.createElement(EditInPlaceDateTimeField, Object.assign({}, sharedProps, { type: "datetime" }));
+        case 'code':
+            return React.createElement(CodeEditorField, Object.assign({}, sharedProps));
+        case 'coloredCheckbox':
+            return React.createElement(ColoredCheckBox, Object.assign({}, sharedProps, { color: "red" }));
+        case 'password':
+            return React.createElement(EditInPlaceField, Object.assign({}, sharedProps, { type: "password" }));
+        case 'switch':
+            return React.createElement(FormSwitch, Object.assign({}, sharedProps));
+        case 'checkbox':
+            return React.createElement(CheckboxField, Object.assign({}, sharedProps));
+        case 'multilineText':
+            return React.createElement(EditInPlaceField, Object.assign({}, sharedProps, { multiline: true }));
+        case 'stub':
+            return React.createElement("div", { className: "invisible" });
+        case 'tags':
+            return React.createElement(TagInputList, Object.assign({}, sharedProps, { tags: [] }));
+        case 'text':
+        default:
+            return React.createElement(EditInPlaceField, Object.assign({}, sharedProps));
+    }
+}

package/dist/colorPicker/ColorPicker.d.ts

@@ -7,5 +7,5 @@ interface ColorPickerWrapperProps {
     theme?: Theme;
     placement?: PopperPlacementType;
 }
-declare const _default: React.JSXElementConstructor<Omit<ColorPickerWrapperProps, "classes" | "theme"> & import("@mui/styles").StyledComponentProps<never>>;
+declare const _default: React.JSXElementConstructor<Omit<ColorPickerWrapperProps, "theme" | "classes"> & import("@mui/styles").StyledComponentProps<never>>;
 export default _default;

package/dist/colorPicker/ColorPicker.js

@@ -9,8 +9,8 @@ import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import ButtonBase from '@mui/material/ButtonBase';
 import Popper from '@mui/material/Popper';
 import { AlphaPicker, HuePicker } from 'react-color';
-import { ClickAwayListener } from '@mui/material';
 import { createStyles, withStyles } from '@mui/styles';
+import { ClickAwayListener } from '@mui/base';
 import Paper from '@mui/material/Paper';
 import Grow from '@mui/material/Grow';
 import clsx from 'clsx';

package/dist/dev.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/dev.js

@@ -0,0 +1,9 @@
+/*
+ * Copyright ish group pty ltd. All rights reserved. https://www.ish.com.au
+ * No copying or use of this code is allowed without permission in writing from ish.
+ */
+import React from 'react';
+import { createRoot } from 'react-dom/client';
+import Demo from './Demo';
+const root = createRoot(document.getElementById('dev-demo'));
+root.render(React.createElement(Demo, null));

package/dist/fieldMessage/ErrorMessage.d.ts

@@ -4,5 +4,5 @@ interface Props {
     className?: string;
     message: string;
 }
-declare const _default: React.JSXElementConstructor<Omit<Props, "classes"> & import("@mui/styles/withStyles").StyledComponentProps<"icon" | "root">>;
+declare const _default: React.JSXElementConstructor<Omit<Props, "classes"> & import("@mui/styles/withStyles").StyledComponentProps<"root" | "icon">>;
 export default _default;

package/dist/fieldMessage/WarningMessage.d.ts

@@ -4,5 +4,5 @@ interface Props {
     className?: string;
     warning: string;
 }
-declare const _default: React.JSXElementConstructor<Omit<Props, "classes"> & import("@mui/styles/withStyles").StyledComponentProps<"icon" | "root">>;
+declare const _default: React.JSXElementConstructor<Omit<Props, "classes"> & import("@mui/styles/withStyles").StyledComponentProps<"root" | "icon">>;
 export default _default;

package/dist/fieldMessage/styles.d.ts

@@ -1,3 +1,3 @@
 import { AppTheme } from '../model';
-declare const _default: (theme: AppTheme) => import("@mui/styles").StyleRules<{}, "icon" | "root">;
+declare const _default: (theme: AppTheme) => import("@mui/styles").StyleRules<{}, "root" | "icon">;
 export default _default;

package/dist/formFields/EditInPlacePhoneField.js

@@ -26,7 +26,7 @@ import { getPhoneMask } from '../utils';
 const NumberFormatCustom = React.forwardRef((props, ref) => {
     const { onChange } = props, other = __rest(props, ["onChange"]);
     const inputRef = useRef();
-    const [format, setFormat] = useState('');
+    const [format, setFormat] = useState(undefined);
     const [prefix, setPrefix] = useState(undefined);
     const processFormat = useCallback(debounce(data => {
         setFormat(getPhoneMask(data.value));

package/dist/formFields/FilePreview.d.ts

@@ -13,5 +13,5 @@ interface Props {
     disabled?: boolean;
     avatarSize?: number;
 }
-declare const _default: React.JSXElementConstructor<Omit<Props, "classes"> & import("@mui/styles").StyledComponentProps<"active" | "root" | "rounded" | "backdrop" | "actionButton" | "noValue" | "avatarRoot">>;
+declare const _default: React.JSXElementConstructor<Omit<Props, "classes"> & import("@mui/styles").StyledComponentProps<"root" | "active" | "rounded" | "backdrop" | "actionButton" | "noValue" | "avatarRoot">>;
 export default _default;

package/dist/formFields/SelectCustomComponents.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-export declare const selectStyles: (theme: any) => import("@mui/styles").StyleRules<{}, "label" | "inline" | "multiple" | "error" | "root" | "expandIcon" | "menuItem" | "inputWrapper" | "readonly" | "inputEndAdornment" | "editIcon" | "bottomMargin" | "bottomPadding" | "topMargin" | "editable" | "valid" | "autoWidthSelect" | "emptySelect" | "validUnderline" | "menuItemActive" | "menuList" | "hasPopup" | "hasClear">;
+export declare const selectStyles: (theme: any) => import("@mui/styles").StyleRules<{}, "root" | "label" | "expandIcon" | "error" | "inline" | "multiple" | "menuItem" | "inputWrapper" | "readonly" | "inputEndAdornment" | "editIcon" | "bottomMargin" | "bottomPadding" | "topMargin" | "editable" | "valid" | "autoWidthSelect" | "emptySelect" | "validUnderline" | "menuItemActive" | "menuList" | "hasPopup" | "hasClear">;
 export declare const ListRow: React.MemoExoticComponent<any>;
 export declare const ListboxComponent: React.ForwardRefExoticComponent<Omit<any, "ref"> & React.RefAttributes<any>>;
 export declare const NoWrapOption: (content: any, data: any, search: any, parentProps: any) => React.JSX.Element;

package/dist/formFields/Switch.d.ts

@@ -3,5 +3,5 @@
  * */
 import React from 'react';
 import { FieldInputProps, FormSwitchProps } from '../model';
-export declare const Switch: React.JSXElementConstructor<Omit<any, "classes"> & import("@mui/styles").StyledComponentProps<"default" | "icon" | "bar" | "inline" | "disabled" | "checked" | "root" | "focusVisible">>;
+export declare const Switch: React.JSXElementConstructor<Omit<any, "classes"> & import("@mui/styles").StyledComponentProps<"default" | "root" | "icon" | "disabled" | "inline" | "checked" | "focusVisible" | "bar">>;
 export declare function FormSwitch<InputProps extends FieldInputProps>({ input, color, disabled, stringValue, label, className, inline, onChangeHandler, onClick }: FormSwitchProps<InputProps>): React.JSX.Element;

package/dist/tagsInput/TagInputList.js

@@ -18,7 +18,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 };
 import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { InputAdornment, MenuItem, Select } from '@mui/material';
-import ClickAwayListener from '@mui/material/ClickAwayListener';
+import { ClickAwayListener } from '@mui/base';
 import Autocomplete from '@mui/material/Autocomplete';
 import clsx from 'clsx';
 import { Edit } from '@mui/icons-material';

package/ish-ui.iml

@@ -0,0 +1,8 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<module version="4">
+  <component name="NewModuleRootManager" inherit-compiler-output="true">
+    <exclude-output />
+    <content url="file://$MODULE_DIR$" />
+    <orderEntry type="sourceFolder" forTests="false" />
+  </component>
+</module>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ish-ui",
-  "version": "1.0.13",
+  "version": "1.0.15",
   "description": "UI elements for onCourse and other ish apps",
   "main": "main.ts",
   "devDependencies": {
@@ -82,7 +82,7 @@
     "react-color": "^2.19.3",
     "react-dom": "^18.2.0",
     "react-dropzone": "^14.2.3",
-    "react-number-format": "4.9.3",
+    "react-number-format": "4.9.4",
     "react-window": "^1.8.9",
     "react-window-infinite-loader": "^1.0.9",
     "redux": "^4.2.1"
@@ -105,8 +105,5 @@
   "bugs": {
     "url": "https://github.com/ishgroup/ish-ui/issues"
   },
-  "homepage": "https://github.com/ishgroup/ish-ui#readme",
-  "publishConfig": {
-    "@ishgroup:registry": "https://npm.pkg.github.com"
-  }
+  "homepage": "https://github.com/ishgroup/ish-ui#readme"
 }