@postenbring/hedwig-react/dist/chunk-GVO57ZWU.mjs.map

React components for [Hedwig Design System](https://github.com/bring/hedwig-design-system).

{"version":3,"sources":["../src/form/date-picker/date-picker.tsx"],"sourcesContent":["import { forwardRef, useRef, type InputHTMLAttributes } from \"react\";\nimport { clsx } from \"@postenbring/hedwig-css/typed-classname\";\nimport { InputGroup, type InputGroupProps } from \"../input-group\";\nimport { useMergeRefs } from \"../../utils/utils\";\n\nexport type DatePickerProps = Omit<\n  InputGroupProps & InputHTMLAttributes<HTMLInputElement>,\n  \"children\" | \"type\"\n> & {\n  /**\n   * Accessible title for the calendar button\n   *\n   * This button currently only shows in Chrome.\n   *\n   * @defaultValue \"Åpne kalender\"\n   */\n  calendarButtonTitle?: string;\n};\n\n/**\n * A basic implementation of a date picker\n *\n * This date picker is an implementation of native date picker, as you get\n * with `<input type=\"date\" />`, where the input field is dressed in Hedwig styling.\n *\n * Due to accessibility concerns you will only see the appropriate Hedwig calendar\n * icon in Chrome. Firefox will show built in icon and Safari will show no icon.\n * Not tested in Edge.\n */\nexport const DatePicker = forwardRef<HTMLInputElement, DatePickerProps>(function DatePicker(\n  {\n    className,\n    variant,\n    errorMessage,\n    labelProps,\n    label,\n    id,\n    style,\n    disabled,\n    readOnly,\n    calendarButtonTitle = \"Åpne kalender\",\n    ...rest\n  },\n  ref,\n) {\n  const inputRef = useRef<HTMLInputElement>(null);\n  const mergedRef = useMergeRefs([inputRef, ref]);\n\n  return (\n    <InputGroup\n      className={clsx(\"hds-date-picker\", className as undefined)}\n      disabled={disabled}\n      errorMessage={errorMessage}\n      id={id}\n      label={label}\n      labelProps={labelProps}\n      readOnly={readOnly}\n      style={style}\n      variant={variant}\n    >\n      {(inputProps) => (\n        <>\n          <input\n            {...rest}\n            {...inputProps}\n            disabled={disabled}\n            readOnly={readOnly}\n            ref={mergedRef}\n            type=\"date\"\n          />\n          <button\n            className={clsx(\"hds-date-picker__calendar-button\")}\n            type=\"button\"\n            title={calendarButtonTitle}\n            onClick={() => {\n              inputRef.current?.showPicker();\n            }}\n          />\n        </>\n      )}\n    </InputGroup>\n  );\n});\n\nDatePicker.displayName = \"DatePicker\";\n"],"mappings":";;;;;;;;;;;;;AAAA,SAAS,YAAY,cAAwC;AAC7D,SAAS,YAAY;AA4Db,mBACE,KADF;AAhCD,IAAM,aAAa,WAA8C,SAASA,YAC/E,IAaA,KACA;AAdA,eACE;AAAA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,sBAAsB;AAAA,EAxC1B,IA8BE,IAWK,iBAXL,IAWK;AAAA,IAVH;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAKF,QAAM,WAAW,OAAyB,IAAI;AAC9C,QAAM,YAAY,aAAa,CAAC,UAAU,GAAG,CAAC;AAE9C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,WAAW,KAAK,mBAAmB,SAAsB;AAAA,MACzD;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MAEC,WAAC,eACA,iCACE;AAAA;AAAA,UAAC;AAAA,0DACK,OACA,aAFL;AAAA,YAGC;AAAA,YACA;AAAA,YACA,KAAK;AAAA,YACL,MAAK;AAAA;AAAA,QACP;AAAA,QACA;AAAA,UAAC;AAAA;AAAA,YACC,WAAW,KAAK,kCAAkC;AAAA,YAClD,MAAK;AAAA,YACL,OAAO;AAAA,YACP,SAAS,MAAM;AA1E3B,kBAAAC;AA2Ec,eAAAA,MAAA,SAAS,YAAT,gBAAAA,IAAkB;AAAA,YACpB;AAAA;AAAA,QACF;AAAA,SACF;AAAA;AAAA,EAEJ;AAEJ,CAAC;AAED,WAAW,cAAc;","names":["DatePicker","_a"]}