// Copyright (c) Microsoft Corporation.
// Licensed under the MIT license.

import { useId } from "@coreai-ds/react-components";
import { Label } from "@coreai-ds/react-components";
import { Input } from "@coreai-ds/react-components";
import * as React from 'react';

export const Default = () => {
    const inputId = useId('input');
    const styles = /* css */ `
      .input-default-example {
        display: flex;
        flex-direction: column;
        gap: var(--spacingVerticalXXS);
        max-width: 400px;
      }
    `;
    return (<>
        <style>{styles}</style>
        <div className="input-default-example">
          <Label htmlFor={inputId}>Sample input</Label>
          <Input id={inputId}/>
        </div>
      </>);
};

export default Default;