@webiny/admin-ui 6.3.0 → 6.4.0-beta.1

package/SegmentedControl/primitives/presenters/SegmentedControlPresenter.js

@@ -2,27 +2,25 @@ import { makeAutoObservable } from "mobx";
 import { SegmentedControlItem } from "../../domains/SegmentedControlItem.js";
 import { SegmentedControlItemFormatter } from "../../domains/SegmentedControlItemFormatter.js";
 class SegmentedControlPresenter {
-  params = undefined;
-  constructor() {
-    makeAutoObservable(this);
-  }
-  init = params => {
-    this.params = params;
-  };
-  get vm() {
-    return {
-      items: this.getSegmentedControlItems().map(item => SegmentedControlItemFormatter.format(item))
-    };
-  }
-  changeValue = value => {
-    this.params?.onValueChange?.(value);
-  };
-  getSegmentedControlItems() {
-    if (!this.params?.items) {
-      return [];
+    constructor(){
+        this.params = void 0;
+        this.init = (params)=>{
+            this.params = params;
+        };
+        this.changeValue = (value)=>{
+            this.params?.onValueChange?.(value);
+        };
+        makeAutoObservable(this);
+    }
+    get vm() {
+        return {
+            items: this.getSegmentedControlItems().map((item)=>SegmentedControlItemFormatter.format(item))
+        };
+    }
+    getSegmentedControlItems() {
+        if (!this.params?.items) return [];
+        return this.params.items.map((item)=>SegmentedControlItem.create(item));
     }
-    return this.params.items.map(item => SegmentedControlItem.create(item));
-  }
 }
 export { SegmentedControlPresenter };
 

package/SegmentedControl/primitives/presenters/SegmentedControlPresenter.js.map

@@ -1 +1 @@
-{"version":3,"names":["makeAutoObservable","SegmentedControlItem","SegmentedControlItemFormatter","SegmentedControlPresenter","params","undefined","constructor","init","vm","items","getSegmentedControlItems","map","item","format","changeValue","value","onValueChange","create"],"sources":["SegmentedControlPresenter.ts"],"sourcesContent":["import { makeAutoObservable } from \"mobx\";\nimport type { SegmentedControlVm } from \"../SegmentedControlPrimitive.js\";\nimport { SegmentedControlItem } from \"~/SegmentedControl/domains/SegmentedControlItem.js\";\nimport { SegmentedControlItemFormatter } from \"~/SegmentedControl/domains/SegmentedControlItemFormatter.js\";\nimport type { SegmentedControlItemParams } from \"~/SegmentedControl/domains/SegmentedControlItemParams.js\";\n\ninterface SegmentedControlPresenterParams<TValue = string> {\n    items: SegmentedControlItemParams[];\n    onValueChange?: (value: TValue) => void;\n}\n\ninterface ISegmentedControlPresenter<TValue = string> {\n    vm: SegmentedControlVm;\n    init: (props: SegmentedControlPresenterParams<TValue>) => void;\n    changeValue: (value: TValue) => void;\n}\n\nclass SegmentedControlPresenter<TValue = string> implements ISegmentedControlPresenter<TValue> {\n    private params?: SegmentedControlPresenterParams<TValue> = undefined;\n\n    constructor() {\n        makeAutoObservable(this);\n    }\n\n    public init = (params: SegmentedControlPresenterParams<TValue>) => {\n        this.params = params;\n    };\n\n    get vm() {\n        return {\n            items: this.getSegmentedControlItems().map(item =>\n                SegmentedControlItemFormatter.format(item)\n            )\n        };\n    }\n\n    public changeValue = (value: TValue) => {\n        this.params?.onValueChange?.(value);\n    };\n\n    private getSegmentedControlItems() {\n        if (!this.params?.items) {\n            return [];\n        }\n\n        return this.params.items.map(item => SegmentedControlItem.create(item));\n    }\n}\n\nexport {\n    SegmentedControlPresenter,\n    type SegmentedControlPresenterParams,\n    type ISegmentedControlPresenter\n};\n"],"mappings":"AAAA,SAASA,kBAAkB,QAAQ,MAAM;AAEzC,SAASC,oBAAoB;AAC7B,SAASC,6BAA6B;AActC,MAAMC,yBAAyB,CAAgE;EACnFC,MAAM,GAA6CC,SAAS;EAEpEC,WAAWA,CAAA,EAAG;IACVN,kBAAkB,CAAC,IAAI,CAAC;EAC5B;EAEOO,IAAI,GAAIH,MAA+C,IAAK;IAC/D,IAAI,CAACA,MAAM,GAAGA,MAAM;EACxB,CAAC;EAED,IAAII,EAAEA,CAAA,EAAG;IACL,OAAO;MACHC,KAAK,EAAE,IAAI,CAACC,wBAAwB,CAAC,CAAC,CAACC,GAAG,CAACC,IAAI,IAC3CV,6BAA6B,CAACW,MAAM,CAACD,IAAI,CAC7C;IACJ,CAAC;EACL;EAEOE,WAAW,GAAIC,KAAa,IAAK;IACpC,IAAI,CAACX,MAAM,EAAEY,aAAa,GAAGD,KAAK,CAAC;EACvC,CAAC;EAEOL,wBAAwBA,CAAA,EAAG;IAC/B,IAAI,CAAC,IAAI,CAACN,MAAM,EAAEK,KAAK,EAAE;MACrB,OAAO,EAAE;IACb;IAEA,OAAO,IAAI,CAACL,MAAM,CAACK,KAAK,CAACE,GAAG,CAACC,IAAI,IAAIX,oBAAoB,CAACgB,MAAM,CAACL,IAAI,CAAC,CAAC;EAC3E;AACJ;AAEA,SACIT,yBAAyB","ignoreList":[]}
+{"version":3,"file":"SegmentedControl/primitives/presenters/SegmentedControlPresenter.js","sources":["../../../../src/SegmentedControl/primitives/presenters/SegmentedControlPresenter.ts"],"sourcesContent":["import { makeAutoObservable } from \"mobx\";\nimport type { SegmentedControlVm } from \"../SegmentedControlPrimitive.js\";\nimport { SegmentedControlItem } from \"~/SegmentedControl/domains/SegmentedControlItem.js\";\nimport { SegmentedControlItemFormatter } from \"~/SegmentedControl/domains/SegmentedControlItemFormatter.js\";\nimport type { SegmentedControlItemParams } from \"~/SegmentedControl/domains/SegmentedControlItemParams.js\";\n\ninterface SegmentedControlPresenterParams<TValue = string> {\n    items: SegmentedControlItemParams[];\n    onValueChange?: (value: TValue) => void;\n}\n\ninterface ISegmentedControlPresenter<TValue = string> {\n    vm: SegmentedControlVm;\n    init: (props: SegmentedControlPresenterParams<TValue>) => void;\n    changeValue: (value: TValue) => void;\n}\n\nclass SegmentedControlPresenter<TValue = string> implements ISegmentedControlPresenter<TValue> {\n    private params?: SegmentedControlPresenterParams<TValue> = undefined;\n\n    constructor() {\n        makeAutoObservable(this);\n    }\n\n    public init = (params: SegmentedControlPresenterParams<TValue>) => {\n        this.params = params;\n    };\n\n    get vm() {\n        return {\n            items: this.getSegmentedControlItems().map(item =>\n                SegmentedControlItemFormatter.format(item)\n            )\n        };\n    }\n\n    public changeValue = (value: TValue) => {\n        this.params?.onValueChange?.(value);\n    };\n\n    private getSegmentedControlItems() {\n        if (!this.params?.items) {\n            return [];\n        }\n\n        return this.params.items.map(item => SegmentedControlItem.create(item));\n    }\n}\n\nexport {\n    SegmentedControlPresenter,\n    type SegmentedControlPresenterParams,\n    type ISegmentedControlPresenter\n};\n"],"names":["SegmentedControlPresenter","undefined","params","value","makeAutoObservable","item","SegmentedControlItemFormatter","SegmentedControlItem"],"mappings":";;;AAiBA,MAAMA;IAGF,aAAc;aAFN,MAAM,GAA6CC;aAMpD,IAAI,GAAG,CAACC;YACX,IAAI,CAAC,MAAM,GAAGA;QAClB;aAUO,WAAW,GAAG,CAACC;YAClB,IAAI,CAAC,MAAM,EAAE,gBAAgBA;QACjC;QAjBIC,mBAAmB,IAAI;IAC3B;IAMA,IAAI,KAAK;QACL,OAAO;YACH,OAAO,IAAI,CAAC,wBAAwB,GAAG,GAAG,CAACC,CAAAA,OACvCC,8BAA8B,MAAM,CAACD;QAE7C;IACJ;IAMQ,2BAA2B;QAC/B,IAAI,CAAC,IAAI,CAAC,MAAM,EAAE,OACd,OAAO,EAAE;QAGb,OAAO,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,GAAG,CAACA,CAAAA,OAAQE,qBAAqB,MAAM,CAACF;IACrE;AACJ"}

package/SegmentedControl/primitives/useSegmentedControl.js

@@ -1,27 +1,31 @@
 import { useEffect, useMemo, useState } from "react";
 import { autorun } from "mobx";
 import { SegmentedControlPresenter } from "./presenters/SegmentedControlPresenter.js";
-export const useSegmentedControl = props => {
-  const params = useMemo(() => ({
-    items: props.items,
-    onValueChange: props.onChange
-  }), [props.items, props.onChange]);
-  const presenter = useMemo(() => {
-    return new SegmentedControlPresenter();
-  }, []);
-  useEffect(() => {
-    presenter.init(params);
-  }, [params]);
-  const [vm, setVm] = useState(presenter.vm);
-  useEffect(() => {
-    return autorun(() => {
-      setVm(presenter.vm);
-    });
-  }, [presenter]);
-  return {
-    vm,
-    changeValue: presenter.changeValue
-  };
+const useSegmentedControl = (props)=>{
+    const params = useMemo(()=>({
+            items: props.items,
+            onValueChange: props.onChange
+        }), [
+        props.items,
+        props.onChange
+    ]);
+    const presenter = useMemo(()=>new SegmentedControlPresenter(), []);
+    useEffect(()=>{
+        presenter.init(params);
+    }, [
+        params
+    ]);
+    const [vm, setVm] = useState(presenter.vm);
+    useEffect(()=>autorun(()=>{
+            setVm(presenter.vm);
+        }), [
+        presenter
+    ]);
+    return {
+        vm,
+        changeValue: presenter.changeValue
+    };
 };
+export { useSegmentedControl };
 
 //# sourceMappingURL=useSegmentedControl.js.map

package/SegmentedControl/primitives/useSegmentedControl.js.map

@@ -1 +1 @@
-{"version":3,"names":["useEffect","useMemo","useState","autorun","SegmentedControlPresenter","useSegmentedControl","props","params","items","onValueChange","onChange","presenter","init","vm","setVm","changeValue"],"sources":["useSegmentedControl.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { autorun } from \"mobx\";\nimport type { SegmentedControlPrimitiveProps } from \"./SegmentedControlPrimitive.js\";\nimport type { SegmentedControlPresenterParams } from \"./presenters/SegmentedControlPresenter.js\";\nimport { SegmentedControlPresenter } from \"./presenters/SegmentedControlPresenter.js\";\n\nexport const useSegmentedControl = (props: SegmentedControlPrimitiveProps) => {\n    const params: SegmentedControlPresenterParams = useMemo(\n        () => ({\n            items: props.items,\n            onValueChange: props.onChange\n        }),\n        [props.items, props.onChange]\n    );\n\n    const presenter = useMemo(() => {\n        return new SegmentedControlPresenter();\n    }, []);\n\n    useEffect(() => {\n        presenter.init(params);\n    }, [params]);\n\n    const [vm, setVm] = useState(presenter.vm);\n\n    useEffect(() => {\n        return autorun(() => {\n            setVm(presenter.vm);\n        });\n    }, [presenter]);\n\n    return { vm, changeValue: presenter.changeValue };\n};\n"],"mappings":"AAAA,SAASA,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AACpD,SAASC,OAAO,QAAQ,MAAM;AAG9B,SAASC,yBAAyB;AAElC,OAAO,MAAMC,mBAAmB,GAAIC,KAAqC,IAAK;EAC1E,MAAMC,MAAuC,GAAGN,OAAO,CACnD,OAAO;IACHO,KAAK,EAAEF,KAAK,CAACE,KAAK;IAClBC,aAAa,EAAEH,KAAK,CAACI;EACzB,CAAC,CAAC,EACF,CAACJ,KAAK,CAACE,KAAK,EAAEF,KAAK,CAACI,QAAQ,CAChC,CAAC;EAED,MAAMC,SAAS,GAAGV,OAAO,CAAC,MAAM;IAC5B,OAAO,IAAIG,yBAAyB,CAAC,CAAC;EAC1C,CAAC,EAAE,EAAE,CAAC;EAENJ,SAAS,CAAC,MAAM;IACZW,SAAS,CAACC,IAAI,CAACL,MAAM,CAAC;EAC1B,CAAC,EAAE,CAACA,MAAM,CAAC,CAAC;EAEZ,MAAM,CAACM,EAAE,EAAEC,KAAK,CAAC,GAAGZ,QAAQ,CAACS,SAAS,CAACE,EAAE,CAAC;EAE1Cb,SAAS,CAAC,MAAM;IACZ,OAAOG,OAAO,CAAC,MAAM;MACjBW,KAAK,CAACH,SAAS,CAACE,EAAE,CAAC;IACvB,CAAC,CAAC;EACN,CAAC,EAAE,CAACF,SAAS,CAAC,CAAC;EAEf,OAAO;IAAEE,EAAE;IAAEE,WAAW,EAAEJ,SAAS,CAACI;EAAY,CAAC;AACrD,CAAC","ignoreList":[]}
+{"version":3,"file":"SegmentedControl/primitives/useSegmentedControl.js","sources":["../../../src/SegmentedControl/primitives/useSegmentedControl.ts"],"sourcesContent":["import { useEffect, useMemo, useState } from \"react\";\nimport { autorun } from \"mobx\";\nimport type { SegmentedControlPrimitiveProps } from \"./SegmentedControlPrimitive.js\";\nimport type { SegmentedControlPresenterParams } from \"./presenters/SegmentedControlPresenter.js\";\nimport { SegmentedControlPresenter } from \"./presenters/SegmentedControlPresenter.js\";\n\nexport const useSegmentedControl = (props: SegmentedControlPrimitiveProps) => {\n    const params: SegmentedControlPresenterParams = useMemo(\n        () => ({\n            items: props.items,\n            onValueChange: props.onChange\n        }),\n        [props.items, props.onChange]\n    );\n\n    const presenter = useMemo(() => {\n        return new SegmentedControlPresenter();\n    }, []);\n\n    useEffect(() => {\n        presenter.init(params);\n    }, [params]);\n\n    const [vm, setVm] = useState(presenter.vm);\n\n    useEffect(() => {\n        return autorun(() => {\n            setVm(presenter.vm);\n        });\n    }, [presenter]);\n\n    return { vm, changeValue: presenter.changeValue };\n};\n"],"names":["useSegmentedControl","props","params","useMemo","presenter","SegmentedControlPresenter","useEffect","vm","setVm","useState","autorun"],"mappings":";;;AAMO,MAAMA,sBAAsB,CAACC;IAChC,MAAMC,SAA0CC,QAC5C,IAAO;YACH,OAAOF,MAAM,KAAK;YAClB,eAAeA,MAAM,QAAQ;QACjC,IACA;QAACA,MAAM,KAAK;QAAEA,MAAM,QAAQ;KAAC;IAGjC,MAAMG,YAAYD,QAAQ,IACf,IAAIE,6BACZ,EAAE;IAELC,UAAU;QACNF,UAAU,IAAI,CAACF;IACnB,GAAG;QAACA;KAAO;IAEX,MAAM,CAACK,IAAIC,MAAM,GAAGC,SAASL,UAAU,EAAE;IAEzCE,UAAU,IACCI,QAAQ;YACXF,MAAMJ,UAAU,EAAE;QACtB,IACD;QAACA;KAAU;IAEd,OAAO;QAAEG;QAAI,aAAaH,UAAU,WAAW;IAAC;AACpD"}

package/Select/Select.js

@@ -1,44 +1,35 @@
-import React, { useMemo } from "react";
+import react, { useMemo } from "react";
 import { makeDecoratable } from "../utils.js";
 import { SelectPrimitive } from "./primitives/index.js";
 import { FormComponentDescription, FormComponentErrorMessage, FormComponentLabel, FormComponentNote } from "../FormComponent/index.js";
-const DecoratableSelect = ({
-  label,
-  description,
-  note,
-  hint,
-  required,
-  disabled,
-  validation,
-  ...props
-}) => {
-  const {
-    isValid: validationIsValid,
-    message: validationMessage
-  } = validation || {};
-  const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);
-  return /*#__PURE__*/React.createElement("div", {
-    className: "w-full"
-  }, /*#__PURE__*/React.createElement(FormComponentLabel, {
-    text: label,
-    hint: hint,
-    required: required,
-    disabled: disabled,
-    invalid: invalid
-  }), /*#__PURE__*/React.createElement(FormComponentDescription, {
-    text: description,
-    disabled: disabled
-  }), /*#__PURE__*/React.createElement(SelectPrimitive, Object.assign({}, props, {
-    disabled: disabled,
-    invalid: invalid
-  })), /*#__PURE__*/React.createElement(FormComponentErrorMessage, {
-    text: validationMessage,
-    invalid: invalid,
-    disabled: disabled
-  }), /*#__PURE__*/React.createElement(FormComponentNote, {
-    text: note,
-    disabled: disabled
-  }));
+const DecoratableSelect = ({ label, description, note, hint, required, disabled, validation, ...props })=>{
+    const { isValid: validationIsValid, message: validationMessage } = validation || {};
+    const invalid = useMemo(()=>false === validationIsValid, [
+        validationIsValid
+    ]);
+    return /*#__PURE__*/ react.createElement("div", {
+        className: "w-full"
+    }, /*#__PURE__*/ react.createElement(FormComponentLabel, {
+        text: label,
+        hint: hint,
+        required: required,
+        disabled: disabled,
+        invalid: invalid
+    }), /*#__PURE__*/ react.createElement(FormComponentDescription, {
+        text: description,
+        disabled: disabled
+    }), /*#__PURE__*/ react.createElement(SelectPrimitive, {
+        ...props,
+        disabled: disabled,
+        invalid: invalid
+    }), /*#__PURE__*/ react.createElement(FormComponentErrorMessage, {
+        text: validationMessage,
+        invalid: invalid,
+        disabled: disabled
+    }), /*#__PURE__*/ react.createElement(FormComponentNote, {
+        text: note,
+        disabled: disabled
+    }));
 };
 const Select = makeDecoratable("Select", DecoratableSelect);
 export { Select };

package/Select/Select.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useMemo","makeDecoratable","SelectPrimitive","FormComponentDescription","FormComponentErrorMessage","FormComponentLabel","FormComponentNote","DecoratableSelect","label","description","note","hint","required","disabled","validation","props","isValid","validationIsValid","message","validationMessage","invalid","createElement","className","text","Object","assign","Select"],"sources":["Select.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { makeDecoratable } from \"~/utils.js\";\nimport type { SelectPrimitiveProps } from \"./primitives/index.js\";\nimport { SelectPrimitive } from \"./primitives/index.js\";\nimport type { FormComponentProps } from \"~/FormComponent/index.js\";\nimport {\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    FormComponentLabel,\n    FormComponentNote\n} from \"~/FormComponent/index.js\";\n\ntype SelectProps = SelectPrimitiveProps & FormComponentProps;\n\nconst DecoratableSelect = ({\n    label,\n    description,\n    note,\n    hint,\n    required,\n    disabled,\n    validation,\n    ...props\n}: SelectProps) => {\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n    const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);\n\n    return (\n        <div className={\"w-full\"}>\n            <FormComponentLabel\n                text={label}\n                hint={hint}\n                required={required}\n                disabled={disabled}\n                invalid={invalid}\n            />\n            <FormComponentDescription text={description} disabled={disabled} />\n            <SelectPrimitive {...props} disabled={disabled} invalid={invalid} />\n            <FormComponentErrorMessage\n                text={validationMessage}\n                invalid={invalid}\n                disabled={disabled}\n            />\n            <FormComponentNote text={note} disabled={disabled} />\n        </div>\n    );\n};\nconst Select = makeDecoratable(\"Select\", DecoratableSelect);\n\nexport { Select, type SelectProps };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,OAAO,QAAQ,OAAO;AACtC,SAASC,eAAe;AAExB,SAASC,eAAe;AAExB,SACIC,wBAAwB,EACxBC,yBAAyB,EACzBC,kBAAkB,EAClBC,iBAAiB;AAKrB,MAAMC,iBAAiB,GAAGA,CAAC;EACvBC,KAAK;EACLC,WAAW;EACXC,IAAI;EACJC,IAAI;EACJC,QAAQ;EACRC,QAAQ;EACRC,UAAU;EACV,GAAGC;AACM,CAAC,KAAK;EACf,MAAM;IAAEC,OAAO,EAAEC,iBAAiB;IAAEC,OAAO,EAAEC;EAAkB,CAAC,GAAGL,UAAU,IAAI,CAAC,CAAC;EACnF,MAAMM,OAAO,GAAGpB,OAAO,CAAC,MAAMiB,iBAAiB,KAAK,KAAK,EAAE,CAACA,iBAAiB,CAAC,CAAC;EAE/E,oBACIlB,KAAA,CAAAsB,aAAA;IAAKC,SAAS,EAAE;EAAS,gBACrBvB,KAAA,CAAAsB,aAAA,CAAChB,kBAAkB;IACfkB,IAAI,EAAEf,KAAM;IACZG,IAAI,EAAEA,IAAK;IACXC,QAAQ,EAAEA,QAAS;IACnBC,QAAQ,EAAEA,QAAS;IACnBO,OAAO,EAAEA;EAAQ,CACpB,CAAC,eACFrB,KAAA,CAAAsB,aAAA,CAAClB,wBAAwB;IAACoB,IAAI,EAAEd,WAAY;IAACI,QAAQ,EAAEA;EAAS,CAAE,CAAC,eACnEd,KAAA,CAAAsB,aAAA,CAACnB,eAAe,EAAAsB,MAAA,CAAAC,MAAA,KAAKV,KAAK;IAAEF,QAAQ,EAAEA,QAAS;IAACO,OAAO,EAAEA;EAAQ,EAAE,CAAC,eACpErB,KAAA,CAAAsB,aAAA,CAACjB,yBAAyB;IACtBmB,IAAI,EAAEJ,iBAAkB;IACxBC,OAAO,EAAEA,OAAQ;IACjBP,QAAQ,EAAEA;EAAS,CACtB,CAAC,eACFd,KAAA,CAAAsB,aAAA,CAACf,iBAAiB;IAACiB,IAAI,EAAEb,IAAK;IAACG,QAAQ,EAAEA;EAAS,CAAE,CACnD,CAAC;AAEd,CAAC;AACD,MAAMa,MAAM,GAAGzB,eAAe,CAAC,QAAQ,EAAEM,iBAAiB,CAAC;AAE3D,SAASmB,MAAM","ignoreList":[]}
+{"version":3,"file":"Select/Select.js","sources":["../../src/Select/Select.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\nimport { makeDecoratable } from \"~/utils.js\";\nimport type { SelectPrimitiveProps } from \"./primitives/index.js\";\nimport { SelectPrimitive } from \"./primitives/index.js\";\nimport type { FormComponentProps } from \"~/FormComponent/index.js\";\nimport {\n    FormComponentDescription,\n    FormComponentErrorMessage,\n    FormComponentLabel,\n    FormComponentNote\n} from \"~/FormComponent/index.js\";\n\ntype SelectProps = SelectPrimitiveProps & FormComponentProps;\n\nconst DecoratableSelect = ({\n    label,\n    description,\n    note,\n    hint,\n    required,\n    disabled,\n    validation,\n    ...props\n}: SelectProps) => {\n    const { isValid: validationIsValid, message: validationMessage } = validation || {};\n    const invalid = useMemo(() => validationIsValid === false, [validationIsValid]);\n\n    return (\n        <div className={\"w-full\"}>\n            <FormComponentLabel\n                text={label}\n                hint={hint}\n                required={required}\n                disabled={disabled}\n                invalid={invalid}\n            />\n            <FormComponentDescription text={description} disabled={disabled} />\n            <SelectPrimitive {...props} disabled={disabled} invalid={invalid} />\n            <FormComponentErrorMessage\n                text={validationMessage}\n                invalid={invalid}\n                disabled={disabled}\n            />\n            <FormComponentNote text={note} disabled={disabled} />\n        </div>\n    );\n};\nconst Select = makeDecoratable(\"Select\", DecoratableSelect);\n\nexport { Select, type SelectProps };\n"],"names":["DecoratableSelect","label","description","note","hint","required","disabled","validation","props","validationIsValid","validationMessage","invalid","useMemo","FormComponentLabel","FormComponentDescription","SelectPrimitive","FormComponentErrorMessage","FormComponentNote","Select","makeDecoratable"],"mappings":";;;;AAcA,MAAMA,oBAAoB,CAAC,EACvBC,KAAK,EACLC,WAAW,EACXC,IAAI,EACJC,IAAI,EACJC,QAAQ,EACRC,QAAQ,EACRC,UAAU,EACV,GAAGC,OACO;IACV,MAAM,EAAE,SAASC,iBAAiB,EAAE,SAASC,iBAAiB,EAAE,GAAGH,cAAc,CAAC;IAClF,MAAMI,UAAUC,QAAQ,IAAMH,AAAsB,UAAtBA,mBAA6B;QAACA;KAAkB;IAE9E,OAAO,WAAP,GACI,oBAAC;QAAI,WAAW;qBACZ,oBAACI,oBAAkBA;QACf,MAAMZ;QACN,MAAMG;QACN,UAAUC;QACV,UAAUC;QACV,SAASK;sBAEb,oBAACG,0BAAwBA;QAAC,MAAMZ;QAAa,UAAUI;sBACvD,oBAACS,iBAAeA;QAAE,GAAGP,KAAK;QAAE,UAAUF;QAAU,SAASK;sBACzD,oBAACK,2BAAyBA;QACtB,MAAMN;QACN,SAASC;QACT,UAAUL;sBAEd,oBAACW,mBAAiBA;QAAC,MAAMd;QAAM,UAAUG;;AAGrD;AACA,MAAMY,SAASC,gBAAgB,UAAUnB"}

package/Select/Select.stories.js

@@ -1,170 +1,197 @@
-import React, { useState } from "react";
+import react, { useState } from "react";
 import { Select } from "./index.js";
 const meta = {
-  title: "Components/Form/Select",
-  component: Select,
-  argTypes: {
-    onChange: {
-      action: "onChange"
+    title: "Components/Form/Select",
+    component: Select,
+    argTypes: {
+        onChange: {
+            action: "onChange"
+        },
+        onOpenChange: {
+            action: "onOpenChange"
+        },
+        disabled: {
+            control: "boolean",
+            defaultValue: false
+        }
     },
-    onOpenChange: {
-      action: "onOpenChange"
+    parameters: {
+        layout: "padded"
     },
-    disabled: {
-      control: "boolean",
-      defaultValue: false
+    render: (args)=>{
+        const [value, setValue] = useState(args.value);
+        return /*#__PURE__*/ react.createElement(Select, {
+            ...args,
+            value: value,
+            onChange: setValue
+        });
     }
-  },
-  parameters: {
-    layout: "padded"
-  },
-  render: args => {
-    const [value, setValue] = useState(args.value);
-    return /*#__PURE__*/React.createElement(Select, Object.assign({}, args, {
-      value: value,
-      onChange: setValue
-    }));
-  }
 };
-export default meta;
-export const Default = {
-  args: {
-    options: [{
-      value: "EST",
-      label: "Eastern Standard Time (UTC-5)"
-    }, {
-      value: "CST",
-      label: "Central Standard Time (UTC-6)"
-    }, {
-      value: "PST",
-      label: "Pacific Standard Time (UTC-8)"
-    }, {
-      value: "GMT",
-      label: "Greenwich Mean Time (UTC+0)"
-    }, {
-      value: "CET",
-      label: "Central European Time (UTC+1)"
-    }, {
-      value: "CAT",
-      label: "Central Africa Time (UTC+2)"
-    }, {
-      value: "IST",
-      label: "India Standard Time (UTC+5:30)"
-    }, {
-      value: "CST_CHINA",
-      label: "China Standard Time (UTC+8)"
-    }, {
-      value: "JST",
-      label: "Japan Standard Time (UTC+9)"
-    }, {
-      value: "AWST",
-      label: "Australian Western Standard Time (UTC+8)"
-    }, {
-      value: "NZST",
-      label: "New Zealand Standard Time (UTC+12)"
-    }, {
-      value: "FJT",
-      label: "Fiji Time (UTC+12)"
-    }, {
-      value: "ART",
-      label: "Argentina Time (UTC-3)"
-    }, {
-      value: "BOT",
-      label: "Bolivia Time (UTC-4)"
-    }, {
-      value: "BRT",
-      label: "Brasilia Time (UTC-3)"
-    }]
-  }
+const Select_stories = meta;
+const Default = {
+    args: {
+        options: [
+            {
+                value: "EST",
+                label: "Eastern Standard Time (UTC-5)"
+            },
+            {
+                value: "CST",
+                label: "Central Standard Time (UTC-6)"
+            },
+            {
+                value: "PST",
+                label: "Pacific Standard Time (UTC-8)"
+            },
+            {
+                value: "GMT",
+                label: "Greenwich Mean Time (UTC+0)"
+            },
+            {
+                value: "CET",
+                label: "Central European Time (UTC+1)"
+            },
+            {
+                value: "CAT",
+                label: "Central Africa Time (UTC+2)"
+            },
+            {
+                value: "IST",
+                label: "India Standard Time (UTC+5:30)"
+            },
+            {
+                value: "CST_CHINA",
+                label: "China Standard Time (UTC+8)"
+            },
+            {
+                value: "JST",
+                label: "Japan Standard Time (UTC+9)"
+            },
+            {
+                value: "AWST",
+                label: "Australian Western Standard Time (UTC+8)"
+            },
+            {
+                value: "NZST",
+                label: "New Zealand Standard Time (UTC+12)"
+            },
+            {
+                value: "FJT",
+                label: "Fiji Time (UTC+12)"
+            },
+            {
+                value: "ART",
+                label: "Argentina Time (UTC-3)"
+            },
+            {
+                value: "BOT",
+                label: "Bolivia Time (UTC-4)"
+            },
+            {
+                value: "BRT",
+                label: "Brasilia Time (UTC-3)"
+            }
+        ]
+    }
 };
-export const WithLabel = {
-  args: {
-    ...Default.args,
-    label: "Any field label"
-  }
+const WithLabel = {
+    args: {
+        ...Default.args,
+        label: "Any field label"
+    }
 };
-export const WithRequiredLabel = {
-  args: {
-    ...Default.args,
-    label: "Any field label",
-    required: true
-  }
+const WithRequiredLabel = {
+    args: {
+        ...Default.args,
+        label: "Any field label",
+        required: true
+    }
 };
-export const WithDescription = {
-  args: {
-    ...Default.args,
-    description: "Provide the required information for processing your request."
-  }
+const WithDescription = {
+    args: {
+        ...Default.args,
+        description: "Provide the required information for processing your request."
+    }
 };
-export const WithNotes = {
-  args: {
-    ...Default.args,
-    note: "Note: Ensure your selection or input is accurate before proceeding."
-  }
+const WithNotes = {
+    args: {
+        ...Default.args,
+        note: "Note: Ensure your selection or input is accurate before proceeding."
+    }
 };
-export const WithErrors = {
-  args: {
-    ...Default.args,
-    validation: {
-      isValid: false,
-      message: "This field is required."
+const WithErrors = {
+    args: {
+        ...Default.args,
+        validation: {
+            isValid: false,
+            message: "This field is required."
+        }
     }
-  }
 };
-export const Disabled = {
-  args: {
-    ...Default.args,
-    label: "Any field label",
-    disabled: true
-  }
+const Disabled = {
+    args: {
+        ...Default.args,
+        label: "Any field label",
+        disabled: true
+    }
 };
-export const FullExample = {
-  args: {
-    ...Default.args,
-    label: "Any field label",
-    required: true,
-    description: "Provide the required information for processing your request.",
-    note: "Note: Ensure your selection or input is accurate before proceeding.",
-    validation: {
-      isValid: false,
-      message: "This field is required."
+const FullExample = {
+    args: {
+        ...Default.args,
+        label: "Any field label",
+        required: true,
+        description: "Provide the required information for processing your request.",
+        note: "Note: Ensure your selection or input is accurate before proceeding.",
+        validation: {
+            isValid: false,
+            message: "This field is required."
+        }
     }
-  }
 };
-export const Documentation = {
-  render: args => {
-    const [value, setValue] = useState("");
-    return /*#__PURE__*/React.createElement(Select, Object.assign({}, args, {
-      value: value,
-      onChange: newValue => setValue(newValue)
-    }));
-  },
-  args: {
-    label: "Time Zone",
-    description: "Select your preferred time zone",
-    note: "This setting will affect how times are displayed throughout the application",
-    required: true,
-    disabled: false,
-    options: [{
-      value: "EST",
-      label: "Eastern Standard Time (UTC-5)"
-    }, {
-      value: "CST",
-      label: "Central Standard Time (UTC-6)"
-    }, {
-      value: "PST",
-      label: "Pacific Standard Time (UTC-8)"
-    }, {
-      value: "GMT",
-      label: "Greenwich Mean Time (UTC+0)"
-    }, {
-      value: "CET",
-      label: "Central European Time (UTC+1)"
-    }, {
-      value: "IST",
-      label: "India Standard Time (UTC+5:30)"
-    }]
-  }
+const Documentation = {
+    render: (args)=>{
+        const [value, setValue] = useState("");
+        return /*#__PURE__*/ react.createElement(Select, {
+            ...args,
+            value: value,
+            onChange: (newValue)=>setValue(newValue)
+        });
+    },
+    args: {
+        label: "Time Zone",
+        description: "Select your preferred time zone",
+        note: "This setting will affect how times are displayed throughout the application",
+        required: true,
+        disabled: false,
+        options: [
+            {
+                value: "EST",
+                label: "Eastern Standard Time (UTC-5)"
+            },
+            {
+                value: "CST",
+                label: "Central Standard Time (UTC-6)"
+            },
+            {
+                value: "PST",
+                label: "Pacific Standard Time (UTC-8)"
+            },
+            {
+                value: "GMT",
+                label: "Greenwich Mean Time (UTC+0)"
+            },
+            {
+                value: "CET",
+                label: "Central European Time (UTC+1)"
+            },
+            {
+                value: "IST",
+                label: "India Standard Time (UTC+5:30)"
+            }
+        ]
+    }
 };
+export default Select_stories;
+export { Default, Disabled, Documentation, FullExample, WithDescription, WithErrors, WithLabel, WithNotes, WithRequiredLabel };
 
 //# sourceMappingURL=Select.stories.js.map

package/Select/Select.stories.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useState","Select","meta","title","component","argTypes","onChange","action","onOpenChange","disabled","control","defaultValue","parameters","layout","render","args","value","setValue","createElement","Object","assign","Default","options","label","WithLabel","WithRequiredLabel","required","WithDescription","description","WithNotes","note","WithErrors","validation","isValid","message","Disabled","FullExample","Documentation","newValue"],"sources":["Select.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Select } from \"~/Select/index.js\";\n\nconst meta: Meta<typeof Select> = {\n    title: \"Components/Form/Select\",\n    component: Select,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        onOpenChange: { action: \"onOpenChange\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <Select {...args} value={value} onChange={setValue} />;\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Select>;\n\nexport const Default: Story = {\n    args: {\n        options: [\n            { value: \"EST\", label: \"Eastern Standard Time (UTC-5)\" },\n            { value: \"CST\", label: \"Central Standard Time (UTC-6)\" },\n            { value: \"PST\", label: \"Pacific Standard Time (UTC-8)\" },\n            { value: \"GMT\", label: \"Greenwich Mean Time (UTC+0)\" },\n            { value: \"CET\", label: \"Central European Time (UTC+1)\" },\n            { value: \"CAT\", label: \"Central Africa Time (UTC+2)\" },\n            { value: \"IST\", label: \"India Standard Time (UTC+5:30)\" },\n            { value: \"CST_CHINA\", label: \"China Standard Time (UTC+8)\" },\n            { value: \"JST\", label: \"Japan Standard Time (UTC+9)\" },\n            { value: \"AWST\", label: \"Australian Western Standard Time (UTC+8)\" },\n            { value: \"NZST\", label: \"New Zealand Standard Time (UTC+12)\" },\n            { value: \"FJT\", label: \"Fiji Time (UTC+12)\" },\n            { value: \"ART\", label: \"Argentina Time (UTC-3)\" },\n            { value: \"BOT\", label: \"Bolivia Time (UTC-4)\" },\n            { value: \"BRT\", label: \"Brasilia Time (UTC-3)\" }\n        ]\n    }\n};\n\nexport const WithLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\"\n    }\n};\n\nexport const WithRequiredLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: \"Provide the required information for processing your request.\"\n    }\n};\n\nexport const WithNotes: Story = {\n    args: {\n        ...Default.args,\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\"\n    }\n};\n\nexport const WithErrors: Story = {\n    args: {\n        ...Default.args,\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        disabled: true\n    }\n};\n\nexport const FullExample: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true,\n        description: \"Provide the required information for processing your request.\",\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\",\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Documentation: Story = {\n    render: args => {\n        const [value, setValue] = useState(\"\");\n\n        return <Select {...args} value={value} onChange={newValue => setValue(newValue)} />;\n    },\n    args: {\n        label: \"Time Zone\",\n        description: \"Select your preferred time zone\",\n        note: \"This setting will affect how times are displayed throughout the application\",\n        required: true,\n        disabled: false,\n        options: [\n            { value: \"EST\", label: \"Eastern Standard Time (UTC-5)\" },\n            { value: \"CST\", label: \"Central Standard Time (UTC-6)\" },\n            { value: \"PST\", label: \"Pacific Standard Time (UTC-8)\" },\n            { value: \"GMT\", label: \"Greenwich Mean Time (UTC+0)\" },\n            { value: \"CET\", label: \"Central European Time (UTC+1)\" },\n            { value: \"IST\", label: \"India Standard Time (UTC+5:30)\" }\n        ]\n    }\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Select/Select.stories.js","sources":["../../src/Select/Select.stories.tsx"],"sourcesContent":["import React, { useState } from \"react\";\nimport type { Meta, StoryObj } from \"@storybook/react-webpack5\";\nimport { Select } from \"~/Select/index.js\";\n\nconst meta: Meta<typeof Select> = {\n    title: \"Components/Form/Select\",\n    component: Select,\n    argTypes: {\n        onChange: { action: \"onChange\" },\n        onOpenChange: { action: \"onOpenChange\" },\n        disabled: {\n            control: \"boolean\",\n            defaultValue: false\n        }\n    },\n    parameters: {\n        layout: \"padded\"\n    },\n    render: args => {\n        const [value, setValue] = useState(args.value);\n        return <Select {...args} value={value} onChange={setValue} />;\n    }\n};\n\nexport default meta;\ntype Story = StoryObj<typeof Select>;\n\nexport const Default: Story = {\n    args: {\n        options: [\n            { value: \"EST\", label: \"Eastern Standard Time (UTC-5)\" },\n            { value: \"CST\", label: \"Central Standard Time (UTC-6)\" },\n            { value: \"PST\", label: \"Pacific Standard Time (UTC-8)\" },\n            { value: \"GMT\", label: \"Greenwich Mean Time (UTC+0)\" },\n            { value: \"CET\", label: \"Central European Time (UTC+1)\" },\n            { value: \"CAT\", label: \"Central Africa Time (UTC+2)\" },\n            { value: \"IST\", label: \"India Standard Time (UTC+5:30)\" },\n            { value: \"CST_CHINA\", label: \"China Standard Time (UTC+8)\" },\n            { value: \"JST\", label: \"Japan Standard Time (UTC+9)\" },\n            { value: \"AWST\", label: \"Australian Western Standard Time (UTC+8)\" },\n            { value: \"NZST\", label: \"New Zealand Standard Time (UTC+12)\" },\n            { value: \"FJT\", label: \"Fiji Time (UTC+12)\" },\n            { value: \"ART\", label: \"Argentina Time (UTC-3)\" },\n            { value: \"BOT\", label: \"Bolivia Time (UTC-4)\" },\n            { value: \"BRT\", label: \"Brasilia Time (UTC-3)\" }\n        ]\n    }\n};\n\nexport const WithLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\"\n    }\n};\n\nexport const WithRequiredLabel: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true\n    }\n};\n\nexport const WithDescription: Story = {\n    args: {\n        ...Default.args,\n        description: \"Provide the required information for processing your request.\"\n    }\n};\n\nexport const WithNotes: Story = {\n    args: {\n        ...Default.args,\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\"\n    }\n};\n\nexport const WithErrors: Story = {\n    args: {\n        ...Default.args,\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Disabled: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        disabled: true\n    }\n};\n\nexport const FullExample: Story = {\n    args: {\n        ...Default.args,\n        label: \"Any field label\",\n        required: true,\n        description: \"Provide the required information for processing your request.\",\n        note: \"Note: Ensure your selection or input is accurate before proceeding.\",\n        validation: {\n            isValid: false,\n            message: \"This field is required.\"\n        }\n    }\n};\n\nexport const Documentation: Story = {\n    render: args => {\n        const [value, setValue] = useState(\"\");\n\n        return <Select {...args} value={value} onChange={newValue => setValue(newValue)} />;\n    },\n    args: {\n        label: \"Time Zone\",\n        description: \"Select your preferred time zone\",\n        note: \"This setting will affect how times are displayed throughout the application\",\n        required: true,\n        disabled: false,\n        options: [\n            { value: \"EST\", label: \"Eastern Standard Time (UTC-5)\" },\n            { value: \"CST\", label: \"Central Standard Time (UTC-6)\" },\n            { value: \"PST\", label: \"Pacific Standard Time (UTC-8)\" },\n            { value: \"GMT\", label: \"Greenwich Mean Time (UTC+0)\" },\n            { value: \"CET\", label: \"Central European Time (UTC+1)\" },\n            { value: \"IST\", label: \"India Standard Time (UTC+5:30)\" }\n        ]\n    }\n};\n"],"names":["meta","Select","args","value","setValue","useState","Default","WithLabel","WithRequiredLabel","WithDescription","WithNotes","WithErrors","Disabled","FullExample","Documentation","newValue"],"mappings":";;AAIA,MAAMA,OAA4B;IAC9B,OAAO;IACP,WAAWC;IACX,UAAU;QACN,UAAU;YAAE,QAAQ;QAAW;QAC/B,cAAc;YAAE,QAAQ;QAAe;QACvC,UAAU;YACN,SAAS;YACT,cAAc;QAClB;IACJ;IACA,YAAY;QACR,QAAQ;IACZ;IACA,QAAQC,CAAAA;QACJ,MAAM,CAACC,OAAOC,SAAS,GAAGC,SAASH,KAAK,KAAK;QAC7C,OAAO,WAAP,GAAO,oBAACD,QAAMA;YAAE,GAAGC,IAAI;YAAE,OAAOC;YAAO,UAAUC;;IACrD;AACJ;AAEA,uBAAeJ;AAGR,MAAMM,UAAiB;IAC1B,MAAM;QACF,SAAS;YACL;gBAAE,OAAO;gBAAO,OAAO;YAAgC;YACvD;gBAAE,OAAO;gBAAO,OAAO;YAAgC;YACvD;gBAAE,OAAO;gBAAO,OAAO;YAAgC;YACvD;gBAAE,OAAO;gBAAO,OAAO;YAA8B;YACrD;gBAAE,OAAO;gBAAO,OAAO;YAAgC;YACvD;gBAAE,OAAO;gBAAO,OAAO;YAA8B;YACrD;gBAAE,OAAO;gBAAO,OAAO;YAAiC;YACxD;gBAAE,OAAO;gBAAa,OAAO;YAA8B;YAC3D;gBAAE,OAAO;gBAAO,OAAO;YAA8B;YACrD;gBAAE,OAAO;gBAAQ,OAAO;YAA2C;YACnE;gBAAE,OAAO;gBAAQ,OAAO;YAAqC;YAC7D;gBAAE,OAAO;gBAAO,OAAO;YAAqB;YAC5C;gBAAE,OAAO;gBAAO,OAAO;YAAyB;YAChD;gBAAE,OAAO;gBAAO,OAAO;YAAuB;YAC9C;gBAAE,OAAO;gBAAO,OAAO;YAAwB;SAClD;IACL;AACJ;AAEO,MAAMC,YAAmB;IAC5B,MAAM;QACF,GAAGD,QAAQ,IAAI;QACf,OAAO;IACX;AACJ;AAEO,MAAME,oBAA2B;IACpC,MAAM;QACF,GAAGF,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMG,kBAAyB;IAClC,MAAM;QACF,GAAGH,QAAQ,IAAI;QACf,aAAa;IACjB;AACJ;AAEO,MAAMI,YAAmB;IAC5B,MAAM;QACF,GAAGJ,QAAQ,IAAI;QACf,MAAM;IACV;AACJ;AAEO,MAAMK,aAAoB;IAC7B,MAAM;QACF,GAAGL,QAAQ,IAAI;QACf,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMM,WAAkB;IAC3B,MAAM;QACF,GAAGN,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;IACd;AACJ;AAEO,MAAMO,cAAqB;IAC9B,MAAM;QACF,GAAGP,QAAQ,IAAI;QACf,OAAO;QACP,UAAU;QACV,aAAa;QACb,MAAM;QACN,YAAY;YACR,SAAS;YACT,SAAS;QACb;IACJ;AACJ;AAEO,MAAMQ,gBAAuB;IAChC,QAAQZ,CAAAA;QACJ,MAAM,CAACC,OAAOC,SAAS,GAAGC,SAAS;QAEnC,OAAO,WAAP,GAAO,oBAACJ,QAAMA;YAAE,GAAGC,IAAI;YAAE,OAAOC;YAAO,UAAUY,CAAAA,WAAYX,SAASW;;IAC1E;IACA,MAAM;QACF,OAAO;QACP,aAAa;QACb,MAAM;QACN,UAAU;QACV,UAAU;QACV,SAAS;YACL;gBAAE,OAAO;gBAAO,OAAO;YAAgC;YACvD;gBAAE,OAAO;gBAAO,OAAO;YAAgC;YACvD;gBAAE,OAAO;gBAAO,OAAO;YAAgC;YACvD;gBAAE,OAAO;gBAAO,OAAO;YAA8B;YACrD;gBAAE,OAAO;gBAAO,OAAO;YAAgC;YACvD;gBAAE,OAAO;gBAAO,OAAO;YAAiC;SAC3D;IACL;AACJ"}