Merge pull request #2468 from dxc-technology/jialecl/timeInputpreview

[doc] TimeInput previews added to theme generator

Author: PelayoFelgueroso

apps/website/screens/theme-generator/componentsRegistry.tsx

@@ -31,6 +31,7 @@ import {
   TabsPreview,
   TextareaPreview,
   TextInputPreview,
+  TimeInputPreview,
   ToastPreview,
   ToggleGroupPreview,
   TooltipPreview,
@@ -64,6 +65,7 @@ export const componentsRegistry = {
   "/components/switch": SwitchPreview,
   "/components/text-input": TextInputPreview,
   "/components/textarea": TextareaPreview,
+  "/components/time-input": TimeInputPreview,
   "/components/toggle-group": ToggleGroupPreview,
   "/components/breadcrumbs": BreadcrumbsPreview,
   "/components/contextual-menu": ContextualMenuPreview,

apps/website/screens/theme-generator/previews/components/TimeInputPreview.tsx

@@ -0,0 +1,15 @@
+import { DxcFlex, DxcTimeInput } from "@dxc-technology/halstack-react";
+const TimeInputPreview = () => {
+  return (
+    <DxcFlex gap="var(--spacing-gap-ml)">
+      <DxcTimeInput label="Start time" helperText="We'll use this time to schedule your appointment." />
+      <DxcTimeInput
+        label="End time"
+        helperText="We'll use this time to schedule your appointment."
+        error="Incorrect time"
+      />
+    </DxcFlex>
+  );
+};
+
+export default TimeInputPreview;

apps/website/screens/theme-generator/previews/components/index.ts

@@ -30,6 +30,7 @@ export { default as TablePreview } from "./TablePreview";
 export { default as TabsPreview } from "./TabsPreview";
 export { default as TextareaPreview } from "./TextareaPreview";
 export { default as TextInputPreview } from "./TextInputPreview";
+export { default as TimeInputPreview } from "./TimeInputPreview";
 export { default as ToastPreview } from "./ToastPreview";
 export { default as ToggleGroupPreview } from "./ToggleGroupPreview";
 export { default as TooltipPreview } from "./TooltipPreview";