@headless-adminapp/fluent 1.2.0 → 1.2.1

package/PageEntityForm/StandardControl.js

@@ -18,6 +18,7 @@ const DateTimeControl_1 = require("../form/controls/DateTimeControl");
 const DecimalControl_1 = require("../form/controls/DecimalControl");
 const DurationControl_1 = require("../form/controls/DurationControl");
 const EmailControl_1 = require("../form/controls/EmailControl");
+const IdControl_1 = require("../form/controls/IdControl");
 const IntegerControl_1 = require("../form/controls/IntegerControl");
 const LookupControl_1 = require("../form/controls/LookupControl");
 const MultiSelectControl_1 = __importDefault(require("../form/controls/MultiSelectControl"));
@@ -56,6 +57,21 @@ const StandardControl = (props) => {
     const { schemaStore, experienceStore } = (0, hooks_1.useMetadata)();
     // const { openQuickCreate } = useQuickCreateForm();
     switch (attribute.type) {
+        case 'id': {
+            const controlProps = {
+                name,
+                placeholder,
+                value,
+                onChange,
+                onBlur,
+                error: isError,
+                disabled: readOnly,
+                readOnly,
+            };
+            const Control = componentStore_1.componentStore.getComponent('Form.IdControl') ??
+                IdControl_1.IdControl;
+            return (0, jsx_runtime_1.jsx)(Control, { ...controlProps, idTypes: attribute });
+        }
         case 'string': {
             const controlProps = {
                 name,

package/form/controls/IdControl.d.ts

@@ -0,0 +1,7 @@
+import { Id } from '@headless-adminapp/core';
+import { IdTypes } from '@headless-adminapp/core/attributes/IdAttribute';
+import { ControlProps } from './types';
+export interface IdControlProps extends ControlProps<Id> {
+    idTypes: IdTypes;
+}
+export declare function IdControl({ idTypes, ...props }: Readonly<IdControlProps>): import("react/jsx-runtime").JSX.Element;

package/form/controls/IdControl.js

@@ -0,0 +1,68 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.IdControl = IdControl;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const IntegerControl_1 = require("./IntegerControl");
+const TextControl_1 = require("./TextControl");
+function formatGuid(value) {
+    if (!value) {
+        return '';
+    }
+    value = value.replace(/[^0-9a-fA-F]/g, '');
+    const part1 = value.substring(0, 8);
+    const part2 = value.substring(8, 12);
+    const part3 = value.substring(12, 16);
+    const part4 = value.substring(16, 20);
+    const part5 = value.substring(20, 32);
+    let formattedValue = '';
+    formattedValue += part1;
+    if (part2) {
+        formattedValue += `-${part2}`;
+    }
+    if (part3) {
+        formattedValue += `-${part3}`;
+    }
+    if (part4) {
+        formattedValue += `-${part4}`;
+    }
+    if (part5) {
+        formattedValue += `-${part5}`;
+    }
+    return formattedValue.toLowerCase();
+}
+function formatObjectId(value) {
+    if (!value) {
+        return '';
+    }
+    value = value.replace(/[^0-9a-fA-F]/g, '');
+    return value.substring(0, 24).toLowerCase();
+}
+function IdControl({ idTypes, ...props }) {
+    if ('string' in idTypes && idTypes.string) {
+        return (0, jsx_runtime_1.jsx)(TextControl_1.TextControl, { ...props, value: props.value });
+    }
+    else if ('number' in idTypes && idTypes.number) {
+        return (0, jsx_runtime_1.jsx)(IntegerControl_1.IntegerControl, { ...props, value: props.value });
+    }
+    else if ('guid' in idTypes && idTypes.guid) {
+        return ((0, jsx_runtime_1.jsx)(TextControl_1.TextControl, { ...props, maxLength: 36, value: formatGuid(props.value), onChange: (value) => {
+                if (!value) {
+                    props.onChange?.(null);
+                }
+                else {
+                    props.onChange?.(formatGuid(value));
+                }
+            } }));
+    }
+    else if ('objectId' in idTypes && idTypes.objectId) {
+        return ((0, jsx_runtime_1.jsx)(TextControl_1.TextControl, { ...props, maxLength: 24, value: props.value, onChange: (value) => {
+                if (!value) {
+                    props.onChange?.(null);
+                }
+                else {
+                    props.onChange?.(formatObjectId(value));
+                }
+            } }));
+    }
+    return ((0, jsx_runtime_1.jsx)(TextControl_1.TextControl, { ...props, value: props.value ? String(props.value) : null, onChange: () => { }, placeholder: "Unsupported ID type", disabled: true }));
+}

package/form/controls/TextControl.d.ts

@@ -6,5 +6,6 @@ export interface TextControlProps extends ControlProps<string> {
     autoCorrect?: string;
     textTransform?: 'capitalize' | 'uppercase' | 'lowercase' | 'none';
     appearance?: InputProps['appearance'];
+    maxLength?: number;
 }
-export declare function TextControl({ value, onChange, id, name, onBlur, onFocus, placeholder, disabled, autoComplete, autoFocus, autoCapitalize, autoCorrect, textTransform, readOnly, appearance, }: TextControlProps): import("react/jsx-runtime").JSX.Element;
+export declare function TextControl({ value, onChange, id, name, onBlur, onFocus, placeholder, disabled, autoComplete, autoFocus, autoCapitalize, autoCorrect, textTransform, readOnly, appearance, maxLength, }: TextControlProps): import("react/jsx-runtime").JSX.Element;

package/form/controls/TextControl.js

@@ -7,7 +7,7 @@ function TextControl({ value, onChange, id, name, onBlur, onFocus,
 // error,
 placeholder, disabled, autoComplete, autoFocus, autoCapitalize, autoCorrect, textTransform, 
 // borderOnFocusOnly,
-readOnly, appearance = 'filled-darker', }) {
+readOnly, appearance = 'filled-darker', maxLength, }) {
     const readonly = disabled || readOnly;
     return ((0, jsx_runtime_1.jsx)(react_components_1.Input, { placeholder: placeholder, id: id, name: name, autoFocus: autoFocus, appearance: appearance, value: value || '', onChange: (e) => {
             textTransform === 'uppercase'
@@ -20,5 +20,5 @@ readOnly, appearance = 'filled-darker', }) {
         // readOnly={readOnly || disabled}
         readOnly: readonly, autoComplete: autoComplete, autoCorrect: autoCorrect, autoCapitalize: autoCapitalize, className: (0, react_components_1.mergeClasses)(readonly && 'TextControl_readonly'), style: {
             width: '100%',
-        } }));
+        }, maxLength: maxLength }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@headless-adminapp/fluent",
-  "version": "1.2.0",
+  "version": "1.2.1",
   "description": "",
   "main": "index.js",
   "types": "index.d.ts",
@@ -50,5 +50,5 @@
     "uuid": "11.0.3",
     "yup": "^1.4.0"
   },
-  "gitHead": "3c59cbbf000e71e39b81c9440a71363b729e6e3c"
+  "gitHead": "1cf9322dda84c1898cc90f1e92278b79ed9f2902"
 }