@gisce/react-ooui 1.2.6-rc.2 → 1.2.6

package/dist/widgets/WidgetFactory.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WidgetFactory.d.ts","sourceRoot":"","sources":["WidgetFactory.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AA0H1B,QAAA,MAAM,iBAAiB,UAAW,GAAG,+DAWpC,CAAC;AAEF,OAAO,EAAE,iBAAiB,EAAE,CAAC"}
+{"version":3,"file":"WidgetFactory.d.ts","sourceRoot":"","sources":["WidgetFactory.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AA6H1B,QAAA,MAAM,iBAAiB,UAAW,GAAG,+DAWpC,CAAC;AAEF,OAAO,EAAE,iBAAiB,EAAE,CAAC"}

package/dist/widgets/base/Time.d.ts

@@ -0,0 +1,12 @@
+import React from "react";
+import { Time as TimeOoui } from "@gisce/ooui";
+import { WidgetProps } from '../../types';
+declare const Time: (props: WidgetProps) => React.JSX.Element;
+declare type TimeInputProps = {
+    ooui: TimeOoui;
+    value?: string;
+    onChange?: (value?: string) => void;
+};
+export declare const TimeInput: (props: TimeInputProps) => React.JSX.Element;
+export default Time;
+//# sourceMappingURL=Time.d.ts.map

package/dist/widgets/base/Time.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Time.d.ts","sourceRoot":"","sources":["Time.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAGvE,OAAO,EAAE,IAAI,IAAI,QAAQ,EAAE,MAAM,aAAa,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAQtC,QAAA,MAAM,IAAI,UAAW,WAAW,sBAQ/B,CAAC;AAEF,aAAK,cAAc,GAAG;IACpB,IAAI,EAAE,QAAQ,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,CAAC,KAAK,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;CACrC,CAAA;AAED,eAAO,MAAM,SAAS,UAAW,cAAc,sBAU9C,CAAA;AAED,eAAe,IAAI,CAAC"}

package/dist/widgets/views/Tree.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Tree.d.ts","sourceRoot":"","sources":["Tree.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAKvE,OAAO,EAAE,QAAQ,EAAU,MAAM,SAAS,CAAC;AAuB3C,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,QAAQ,CAAC;IACnB,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;IACrC,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,gBAAgB,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;IAC7C,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,GAAG,KAAK,IAAI,CAAC;IACtC,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,wBAAwB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC;IACzD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,GAAG,CAAC;CACf,CAAC;AAqHF,iBAAS,IAAI,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,CAAC,YAAY,CA2M9C;AAED,eAAe,IAAI,CAAC"}
+{"version":3,"file":"Tree.d.ts","sourceRoot":"","sources":["Tree.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAkD,MAAM,OAAO,CAAC;AAKvE,OAAO,EAAE,QAAQ,EAAU,MAAM,SAAS,CAAC;AAuB3C,aAAK,KAAK,GAAG;IACX,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,OAAO,CAAC;IACjB,QAAQ,EAAE,QAAQ,CAAC;IACnB,OAAO,EAAE,KAAK,CAAC,GAAG,CAAC,CAAC;IACpB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,mBAAmB,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAChE,YAAY,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,KAAK,IAAI,CAAC;IACrC,YAAY,CAAC,EAAE,GAAG,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,gBAAgB,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;IAC7C,YAAY,CAAC,EAAE,CAAC,OAAO,EAAE,GAAG,KAAK,IAAI,CAAC;IACtC,MAAM,CAAC,EAAE,GAAG,CAAC;IACb,wBAAwB,CAAC,EAAE,CAAC,IAAI,EAAE,GAAG,KAAK,OAAO,CAAC,GAAG,EAAE,CAAC,CAAC;IACzD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,GAAG,CAAC;CACf,CAAC;AAkHF,iBAAS,IAAI,CAAC,KAAK,EAAE,KAAK,GAAG,KAAK,CAAC,YAAY,CA4M9C;AAED,eAAe,IAAI,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gisce/react-ooui",
-  "version": "1.2.6-rc.2",
+  "version": "1.2.6",
   "files": [
     "dist",
     "src",
@@ -33,7 +33,7 @@
   "dependencies": {
     "@ant-design/plots": "^1.0.9",
     "@gisce/fiber-diagram": "^1.1.0-rc.3",
-    "@gisce/ooui": "^0.20.0",
+    "@gisce/ooui": "^0.21.0",
     "@gisce/react-formiga-components": "^1.0.9-rc.21",
     "@gisce/react-formiga-table": "^0.5.0",
     "@monaco-editor/react": "^4.4.5",

package/src/hooks/useSearch.ts

@@ -278,7 +278,6 @@ export const useSearch = (opts: UseSearchOpts) => {
 
   const changeSort = useCallback(
     (newSorter: any) => {
-      if (JSON.stringify(newSorter) === JSON.stringify(sorter)) return;
       setSorter?.(newSorter);
       const sortedResults =
         newSorter !== undefined

package/src/index.ts

@@ -23,6 +23,7 @@ import { ExportModal } from "@/widgets/modals/ExportModal";
 import { SearchModal } from "@/widgets/modals/SearchModal";
 import Date from "@/widgets/base/Date";
 import DateTime from "@/widgets/base/DateTime";
+import Time from "@/widgets/base/Time";
 import type {
   One2manyValue,
   One2manyItem,
@@ -122,6 +123,7 @@ export {
   One2manyValue,
   Date,
   DateTime,
+  Time,
   Reference,
   Binary,
   iconMapper,

package/src/stories/Time.stories.tsx

@@ -0,0 +1,32 @@
+// @ts-ignore
+import React, { useState } from "react";
+
+import { TimeInput } from "../widgets/base/Time";
+import { Time as TimeOoui } from "@gisce/ooui";
+
+
+import LocaleProvider from "../context/LocaleContext";
+
+export default {
+  title: "Components/Widgets/Base/Time",
+};
+
+export const Default = (): React.ReactElement => {
+  const ooui = new TimeOoui({
+    name: "field",
+    string: "Lorem ipsum",
+  });
+
+  const [value, setValue] = useState<string>('23:12:34');
+
+  const onChange = (value: string) => {
+    console.log(value);
+    setValue(value);
+  }
+
+  return (
+    <LocaleProvider lang="en_US">
+      <TimeInput ooui={ooui} onChange={onChange} value={value} />
+    </LocaleProvider>
+  );
+};

package/src/widgets/WidgetFactory.tsx

@@ -15,6 +15,7 @@ import {
   Float,
   Date,
   DateTime,
+  Time,
   One2many,
   Separator,
   Form,
@@ -75,6 +76,8 @@ const getWidgetType = (type: string) => {
       return Date;
     case "datetime":
       return DateTime;
+    case "time":
+      return Time;
     case "one2many":
     case "one2many_list":
     case "many2many":

package/src/widgets/base/Time.tsx

@@ -0,0 +1,41 @@
+import React, { useContext, useEffect, useRef, useState } from "react";
+import { TimePicker, theme } from "antd";
+import Field from "@/common/Field";
+import { Time as TimeOoui } from "@gisce/ooui";
+import { WidgetProps } from "@/types";
+import dayjs from "dayjs";
+import { Dayjs } from 'dayjs';
+import customParseFormat from 'dayjs/plugin/customParseFormat'
+
+
+dayjs.extend(customParseFormat)
+
+const Time = (props: WidgetProps) => {
+  const { ooui } = props;
+
+  return (
+    <Field {...props}>
+      <TimeInput ooui={ooui as TimeOoui} />
+    </Field>
+  );
+};
+
+type TimeInputProps = {
+  ooui: TimeOoui;
+  value?: string;
+  onChange?: (value?: string) => void;
+}
+
+export const TimeInput = (props: TimeInputProps) => {
+
+  const onChange = (time: Dayjs | null, timestring: string) => {
+    if (props.onChange) {
+      props.onChange(timestring)
+    }
+  }
+
+  return <TimePicker onChange={onChange} value={props.value ? dayjs(props.value, 'HH:mm:ss') : undefined} />
+
+}
+
+export default Time;

package/src/widgets/views/Tree.tsx

@@ -115,27 +115,27 @@ const imageComponent = (value: string): React.ReactElement => {
 };
 
 const TagComponent = (
-  value: any,
+value: any,
   key: string,
   ooui: any,
   context: any
 ): React.ReactElement => {
   return (
     <>
-      {value ? (
-        <Tag color={ooui.colors[value]}>{ooui.selectionValues.get(value)}</Tag>
-      ) : null}
+      {value ? <Tag color={ooui.colors[value]}>{ooui.selectionValues.get(value)}</Tag> : null}
     </>
   );
 };
 
 const SelectionComponent = (
-  value: any,
+value: any,
   key: string,
   ooui: any,
   context: any
 ): React.ReactElement => {
-  return <>{ooui.selectionValues.get(value)}</>;
+  return (
+    <>{ooui.selectionValues.get(value)}</>
+  );
 };
 
 const referenceComponent = (
@@ -155,12 +155,9 @@ const referenceComponent = (
   );
 };
 
-const AvatarFn = (
-  value: any,
-  key: string,
-  ooui: any,
-  context: any
-): React.ReactElement => <Avatar ooui={ooui} value={value} />;
+const AvatarFn = (value: any, key:string, ooui: any, context: any): React.ReactElement => (
+  <Avatar ooui={ooui} value={value} />
+)
 
 function Tree(props: Props): React.ReactElement {
   const {
@@ -310,7 +307,9 @@ function Tree(props: Props): React.ReactElement {
       summary.push(`${sumField.label}: ${Math.round(total * 100) / 100}`);
     });
 
-    return <div className="p-1 pb-0 pl-2 mt-2 ">{summary.join(", ")}</div>;
+    return (
+      <div className="p-1 pb-0 pl-2 mt-2 ">{summary.join(", ")}</div>
+    );
   }
 
   let dataTable;
@@ -333,12 +332,11 @@ function Tree(props: Props): React.ReactElement {
   ) : (
     <div>
       {pagination()}
-      {loading && <Spin className="pb-4" />}
       <GisceTable
         height={adjustedHeight!}
         columns={dataTable.columns}
         dataSource={items}
-        loading={false}
+        loading={loading}
         loadingComponent={<Spin />}
         onRowStyle={(record: any) => {
           if (colorsForResults![record.id]) {