From 80a1c2a5c81a9a55f9a6f519d9f26ef7e012b82a Mon Sep 17 00:00:00 2001
From: Ben Merckx <ben@codeurs.be>
Date: Tue, 7 Jun 2022 10:46:30 +0200
Subject: [PATCH] Update date field to latest api

---
 packages/input/date/src/DateField.tsx     | 8 ++++----
 packages/input/date/src/DateInput.tsx     | 9 +++------
 packages/input/select/src/SelectInput.tsx | 2 +-
 3 files changed, 8 insertions(+), 11 deletions(-)

diff --git a/packages/input/date/src/DateField.tsx b/packages/input/date/src/DateField.tsx
index d01219932..60dab981e 100644
--- a/packages/input/date/src/DateField.tsx
+++ b/packages/input/date/src/DateField.tsx
@@ -1,4 +1,4 @@
-import {Field, Label, Value} from '@alinea/core'
+import {Field, Label, Shape} from '@alinea/core'
 
 /** Optional settings to configure a text field */
 export type DateOptions = {
@@ -16,16 +16,16 @@ export type DateOptions = {
   autoFocus?: boolean
 }
 
-/** Internal representation of a text field */
+/** Internal representation of a date field */
 export interface DateField extends Field.Scalar<string> {
   label: Label
   options: DateOptions
 }
 
-/** Create a text field configuration */
+/** Create a date field configuration */
 export function createDate(label: Label, options: DateOptions = {}): DateField {
   return {
-    type: Value.Scalar(label),
+    shape: Shape.Scalar(label),
     label,
     options
   }
diff --git a/packages/input/date/src/DateInput.tsx b/packages/input/date/src/DateInput.tsx
index a55c034f0..54dbe4c1f 100644
--- a/packages/input/date/src/DateInput.tsx
+++ b/packages/input/date/src/DateInput.tsx
@@ -1,10 +1,8 @@
 import {InputLabel, InputState, useInput} from '@alinea/editor'
-
-import {DateField} from './DateField'
+import {fromModule} from '@alinea/ui'
 import {IcRoundDateRange} from '@alinea/ui/icons/IcRoundDateRange'
+import {DateField} from './DateField'
 import css from './DateInput.module.scss'
-import {fromModule} from '@alinea/ui'
-import {useState} from 'react'
 
 const styles = fromModule(css)
 
@@ -16,15 +14,14 @@ export type DateInputProps = {
 export function DateInput({state, field}: DateInputProps) {
   const {width, inline, optional, help, autoFocus, initialValue} = field.options
   const [value = initialValue, setValue] = useInput(state)
-  const [focus, setFocus] = useState(false)
   return (
     <InputLabel
       asLabel
       label={field.label}
+      help={help}
       optional={optional}
       inline={inline}
       width={width}
-      focused={focus}
       icon={IcRoundDateRange}
     >
       <input
diff --git a/packages/input/select/src/SelectInput.tsx b/packages/input/select/src/SelectInput.tsx
index 40499e3d8..c8227d339 100644
--- a/packages/input/select/src/SelectInput.tsx
+++ b/packages/input/select/src/SelectInput.tsx
@@ -49,11 +49,11 @@ export function SelectInput<T extends string>({
   })
   return (
     <InputLabel
-      width={width}
       label={field.label}
       help={help}
       optional={optional}
       inline={inline}
+      width={width}
       icon={IcRoundArrowDropDownCircle}
     >
       <div className={styles.root()}>