@react-md/core 6.0.1 → 6.1.0

package/dist/files/useFileUpload.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/files/useFileUpload.ts"],"sourcesContent":["\"use client\";\n\nimport { nanoid } from \"nanoid\";\nimport {\n  type ChangeEvent,\n  type DragEvent,\n  useCallback,\n  useEffect,\n  useReducer,\n} from \"react\";\n\nimport {\n  type CompletedFileUploadStats,\n  type FileReaderResult,\n  type FileUploadHandlers,\n  type FileUploadStats,\n  type GetFileParser,\n  type ProcessingFileUploadStats,\n  getFileParser as defaultGetFileParser,\n} from \"./utils.js\";\nimport {\n  FileAccessError,\n  type FileValidationError,\n  type FileValidationOptions,\n  type FilesValidator,\n  isValidFileName as defaultIsValidFileName,\n  validateFiles as defaultValidateFiles,\n} from \"./validation.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n *\n * @typeParam CustomError - An optional error type that gets returned from the\n * {@link FilesValidator}.\n * @since 2.9.0\n */\nexport interface FileUploadState<CustomError = never> {\n  /**\n   * All the files that have been validated and are either:\n   * - pending upload\n   * - uploading\n   * - complete\n   *\n   * Each key in this object is the {@link BaseFileUploadStats.key} generated\n   * once the upload starts pending.\n   */\n  stats: Readonly<Record<string, Readonly<FileUploadStats>>>;\n\n  /**\n   * A list of validation errors that have occurred before starting the upload\n   * process.\n   *\n   * @see {@link FileAccessError}\n   * @see {@link TooManyFilesError}\n   * @see {@link FileValidationError}\n   */\n  errors: readonly FileValidationError<CustomError>[];\n}\n\n/**\n *\n * @typeParam CustomError - An optional error type that gets returned from the\n * {@link FilesValidator}.\n * @since 2.9.0\n * @internal\n */\nexport interface FileUploadHookState<CustomError = never>\n  extends FileUploadState<CustomError> {\n  /**\n   * All the current readers used for uploading files to the browser.\n   *\n   * Note: Once an upload has completed, the reader will be removed.\n   */\n  readers: Readonly<Record<string, FileReader>>;\n}\n\n/**\n *\n * @typeParam E - An optional HTMLElement type that is used for the\n * {@link FileUploadHandlers}.\n * @typeParam CustomError - An optional error type that gets returned from the\n * {@link FilesValidator}.\n * @since 2.9.0\n */\nexport interface FileUploadOptions<E extends HTMLElement, CustomError = never>\n  extends FileUploadHandlers<E>,\n    FileValidationOptions {\n  /**\n   * Setting this value to a number greater than `0` will update the browser\n   * upload process to queue the uploads in chunks instead of all at once. This\n   * can help prevent the browser from freezing if dealing with large files that\n   * are being converted to data urls.\n   *\n   * @defaultValue `-1`\n   */\n  concurrency?: number;\n\n  /** {@inheritDoc FilesValidator} */\n  validateFiles?: FilesValidator<CustomError>;\n  /** {@inheritDoc GetFileParser} */\n  getFileParser?: GetFileParser;\n}\n\n/** @internal */\ntype Action<E = never> =\n  | {\n      type: \"queue\";\n      errors: readonly FileValidationError<E>[];\n      files: readonly File[];\n    }\n  | { type: \"reset\" }\n  | { type: \"remove\"; files: readonly string[] }\n  | { type: \"start\"; key: string; reader: FileReader }\n  | { type: \"progress\"; key: string; progress: number }\n  | { type: \"complete\"; key: string; result: FileReaderResult }\n  | { type: \"clearErrors\" };\n\n/** @since 2.9.0 */\nexport interface FileUploadActions {\n  /**\n   * Reset everything related to uploads ensuring that all file readers have\n   * been aborted.\n   */\n  reset: () => void;\n\n  /**\n   * Removes all the errors that exist in state without canceling any of the\n   * uploads already in progress.\n   */\n  clearErrors: () => void;\n\n  /**\n   * This function is used to cancel pending and uploading files or removing\n   * completed files.\n   *\n   * @param keyOrKeys - A single or list of {@link BaseFileUploadStats.key} to\n   * remove from state.\n   */\n  remove: (keyOrKeys: string | readonly string[]) => void;\n}\n\n/**\n *\n * @typeParam E - An optional HTMLElement type that is used for the\n * {@link FileUploadHandlers}.\n * @typeParam CustomError - An optional error type that gets returned from the\n * {@link FilesValidator}.\n * @since 2.9.0\n */\nexport interface FileUploadHookReturnValue<\n  E extends HTMLElement = HTMLElement,\n  CustomError = never,\n> extends FileUploadActions,\n    Required<FileUploadHandlers<E>> {\n  /** {@inheritDoc FileUploadState.errors} */\n  errors: readonly FileValidationError<CustomError>[];\n\n  /**\n   * A list of all the {@link FileUploadStats}.\n   *\n   * @see {@link getSplitFileUploads} for separating by status\n   */\n  stats: readonly Readonly<FileUploadStats>[];\n\n  /**\n   * The total number of bytes for all the files that exist in the\n   * {@link stats} list.\n   */\n  totalBytes: number;\n\n  /**\n   * The total number of files in the {@link stats} list.\n   */\n  totalFiles: number;\n\n  /**\n   * An `accept` string that can be passed to the {@link FileInput} component\n   * when the {@link FileValidationOptions.extensions} list has been provided to\n   * limit which files the OS will _attempt_ to allow access to.\n   *\n   * @example Simple example\n   * ```ts\n   * const extensions = ['pdf', 'docx', 'ppt'];\n   * const { accept } = useFileUpload({ extensions, ...others });\n   *\n   * expect(accept).toBe(\"*.pdf,*.docx,*.ppt\")\n   * ```\n   *\n   * @defaultValue `\"*\"`\n   */\n  accept: string;\n}\n\n/** @internal */\nconst EMPTY_LIST = [] as const;\n/** @internal */\nconst EMPTY_OBJECT = {} as const;\n\n/**\n * This hook is generally used to upload files **to the browser** in different\n * formats to be previewed `<img>`, `<video>`, `<embed>`, etc tags. However, it\n * can also be used to upload the files as an `ArrayBuffer` and then uploaded to\n * a server.\n *\n * @see {@link https://next.react-md.dev/components/file-input | FileInput Demos}\n * @see {@link https://next.react-md.dev/hooks/use-file-input | useFileInput Demos}\n * @typeParam E - An optional HTMLElement type that is used for the\n * {@link FileUploadHandlers}.\n * @typeParam CustomError - An optional error type that gets returned from the\n * {@link FilesValidator}.\n * @param options - All the {@link FileUploadOptions}\n * @returns the {@link FileUploadHookReturnValue}\n * @since 2.9.0\n */\nexport function useFileUpload<E extends HTMLElement, CustomError = never>(\n  options: FileUploadOptions<E, CustomError> = {}\n): Readonly<FileUploadHookReturnValue<E, CustomError>> {\n  const {\n    maxFiles = -1,\n    extensions = EMPTY_LIST,\n    minFileSize = -1,\n    maxFileSize = -1,\n    totalFileSize = -1,\n    concurrency = -1,\n    onDrop: propOnDrop = noop,\n    onChange: propOnChange = noop,\n    validateFiles = defaultValidateFiles,\n    getFileParser = defaultGetFileParser,\n    isValidFileName = defaultIsValidFileName,\n  } = options;\n\n  const [state, dispatch] = useReducer(\n    function reducer(\n      state: FileUploadHookState<CustomError>,\n      action: Action<CustomError>\n    ): FileUploadHookState<CustomError> {\n      switch (action.type) {\n        case \"reset\":\n          // need to reuse constants so that calling reset doesn't cause an\n          // infinite loop in an effect\n          return {\n            stats: EMPTY_OBJECT,\n            errors: EMPTY_LIST,\n            readers: EMPTY_OBJECT,\n          };\n        case \"remove\": {\n          const stats: Record<string, FileUploadStats> = {};\n          for (const key in state.stats) {\n            if (!action.files.includes(key)) {\n              stats[key] = state.stats[key];\n            }\n          }\n\n          return {\n            ...state,\n            stats,\n          };\n        }\n        case \"queue\":\n          return {\n            ...state,\n            stats: {\n              ...state.stats,\n              ...action.files.reduce<Record<string, ProcessingFileUploadStats>>(\n                (files, file) => {\n                  const key = nanoid();\n                  files[key] = {\n                    key,\n                    file,\n                    progress: 0,\n                    status: \"pending\",\n                  };\n\n                  return files;\n                },\n                {}\n              ),\n            },\n            errors: [...state.errors, ...action.errors],\n          };\n        case \"start\": {\n          const { key, reader } = action;\n          const fileStats: ProcessingFileUploadStats = {\n            key,\n            file: state.stats[key].file,\n            progress: 0,\n            status: \"uploading\",\n          };\n\n          return {\n            ...state,\n            readers: {\n              ...state.readers,\n              [key]: reader,\n            },\n            stats: {\n              ...state.stats,\n              [key]: fileStats,\n            },\n          };\n        }\n        case \"progress\": {\n          const { key, progress } = action;\n          return {\n            ...state,\n            stats: {\n              ...state.stats,\n              [key]: {\n                ...state.stats[key],\n                progress,\n              },\n            },\n          };\n        }\n        case \"complete\": {\n          const { key, result } = action;\n          const file: CompletedFileUploadStats = {\n            key,\n            file: state.stats[key].file,\n            status: \"complete\",\n            result,\n            progress: 100,\n          };\n          const { [key]: _reader, ...readers } = state.readers;\n\n          return {\n            ...state,\n            readers,\n            stats: {\n              ...state.stats,\n              [key]: file,\n            },\n          };\n        }\n        case \"clearErrors\":\n          return { ...state, errors: [] };\n      }\n    },\n    {\n      stats: EMPTY_OBJECT,\n      errors: EMPTY_LIST,\n      readers: EMPTY_OBJECT,\n    }\n  );\n  const { stats, errors, readers } = state;\n\n  const statsList = Object.values(stats);\n  const totalFiles = statsList.length;\n  const totalBytes = statsList.reduce(\n    (result, { file: { size } }) => result + size,\n    0\n  );\n  const queueFiles = useCallback(\n    (files: readonly File[]) => {\n      const { pending, errors } = validateFiles(files, {\n        maxFiles,\n        extensions,\n        minFileSize,\n        maxFileSize,\n        totalBytes,\n        totalFiles,\n        totalFileSize,\n        isValidFileName,\n      });\n\n      dispatch({ type: \"queue\", errors, files: pending });\n    },\n    [\n      validateFiles,\n      maxFiles,\n      extensions,\n      minFileSize,\n      maxFileSize,\n      totalBytes,\n      totalFiles,\n      totalFileSize,\n      isValidFileName,\n    ]\n  );\n  const onDrop = useCallback(\n    (event: DragEvent<E>) => {\n      propOnDrop(event);\n      event.preventDefault();\n      event.stopPropagation();\n\n      try {\n        const files = event.dataTransfer.files;\n        if (files) {\n          queueFiles(Array.from(files));\n        }\n      } catch (e) {\n        dispatch({\n          type: \"queue\",\n          files: [],\n          errors: [\n            new FileAccessError(e instanceof Error ? e.message : undefined),\n          ],\n        });\n      }\n    },\n    [queueFiles, propOnDrop]\n  );\n  const onChange = useCallback(\n    (event: ChangeEvent<HTMLInputElement>) => {\n      propOnChange(event);\n      try {\n        const files = event.currentTarget.files;\n        if (files) {\n          queueFiles(Array.from(files));\n        } else {\n          throw new Error();\n        }\n      } catch (e) {\n        dispatch({\n          type: \"queue\",\n          files: [],\n          errors: [\n            new FileAccessError(e instanceof Error ? e.message : undefined),\n          ],\n        });\n      }\n    },\n    [queueFiles, propOnChange]\n  );\n\n  const remove = useCallback(\n    (keyOrKeys: string | readonly string[]) => {\n      const files = typeof keyOrKeys === \"string\" ? [keyOrKeys] : keyOrKeys;\n      files.forEach((fileKey) => {\n        readers[fileKey]?.abort();\n      });\n\n      dispatch({ type: \"remove\", files });\n    },\n    [readers]\n  );\n  const reset = useCallback(() => {\n    Object.values(readers).forEach((reader) => {\n      reader.abort();\n    });\n\n    dispatch({ type: \"reset\" });\n  }, [readers]);\n  const clearErrors = useCallback(() => {\n    dispatch({ type: \"clearErrors\" });\n  }, []);\n  const start = useCallback((key: string, reader: FileReader) => {\n    dispatch({ type: \"start\", key, reader });\n  }, []);\n  const complete = useCallback(\n    (key: string, result: FileReaderResult = null) => {\n      dispatch({ type: \"complete\", key, result });\n    },\n    []\n  );\n  const createProgressEventHandler = useCallback(\n    (key: string) => (event: ProgressEvent) => {\n      if (event.lengthComputable) {\n        const percentage = Math.round((event.loaded * 100) / event.total);\n        dispatch({ type: \"progress\", key, progress: percentage });\n      }\n    },\n    []\n  );\n\n  useEffect(() => {\n    const pending: ProcessingFileUploadStats[] = [];\n    const uploading: ProcessingFileUploadStats[] = [];\n    Object.values(stats).forEach((file) => {\n      if (file.status === \"pending\") {\n        pending.push(file);\n      } else if (file.status === \"uploading\") {\n        uploading.push(file);\n      }\n    });\n\n    const lastIndex =\n      concurrency === -1\n        ? pending.length\n        : Math.max(0, concurrency - uploading.length);\n    const queue = pending.slice(0, lastIndex);\n    if (!queue.length) {\n      return;\n    }\n\n    queue.forEach((stats) => {\n      const { key, file } = stats;\n      const reader = new FileReader();\n\n      // using `addEventListener` instead of directly setting to\n      // `reader.progress`/`reader.load` so it's easier to test\n      reader.addEventListener(\"progress\", createProgressEventHandler(key));\n      reader.addEventListener(\"load\", () => {\n        complete(key, reader.result);\n      });\n\n      start(key, reader);\n      const parser = getFileParser(file);\n      /* istanbul ignore next */\n      if (\n        process.env.NODE_ENV !== \"production\" &&\n        ![\"readAsText\", \"readAsDataURL\", \"readAsArrayBuffer\"].includes(parser)\n      ) {\n        throw new Error(\"Invalid file reader parser\");\n      }\n\n      reader[parser](file);\n    });\n  }, [\n    concurrency,\n    stats,\n    getFileParser,\n    createProgressEventHandler,\n    start,\n    complete,\n  ]);\n\n  let accept = \"\";\n  if (extensions.length) {\n    accept = extensions.reduce((s, ext) => `${s ? `${s},` : \"\"}.${ext}`, \"\");\n  }\n\n  return {\n    stats: statsList,\n    errors,\n    accept,\n    totalBytes,\n    totalFiles,\n    onDrop,\n    onChange,\n    reset,\n    remove,\n    clearErrors,\n  };\n}\n"],"names":["nanoid","useCallback","useEffect","useReducer","getFileParser","defaultGetFileParser","FileAccessError","isValidFileName","defaultIsValidFileName","validateFiles","defaultValidateFiles","noop","EMPTY_LIST","EMPTY_OBJECT","useFileUpload","options","maxFiles","extensions","minFileSize","maxFileSize","totalFileSize","concurrency","onDrop","propOnDrop","onChange","propOnChange","state","dispatch","reducer","action","type","stats","errors","readers","key","files","includes","reduce","file","progress","status","reader","fileStats","result","_reader","statsList","Object","values","totalFiles","length","totalBytes","size","queueFiles","pending","event","preventDefault","stopPropagation","dataTransfer","Array","from","e","Error","message","undefined","currentTarget","remove","keyOrKeys","forEach","fileKey","abort","reset","clearErrors","start","complete","createProgressEventHandler","lengthComputable","percentage","Math","round","loaded","total","uploading","push","lastIndex","max","queue","slice","FileReader","addEventListener","parser","process","env","NODE_ENV","accept","s","ext"],"mappings":"AAAA;AAEA,SAASA,MAAM,QAAQ,SAAS;AAChC,SAGEC,WAAW,EACXC,SAAS,EACTC,UAAU,QACL,QAAQ;AAEf,SAOEC,iBAAiBC,oBAAoB,QAChC,aAAa;AACpB,SACEC,eAAe,EAIfC,mBAAmBC,sBAAsB,EACzCC,iBAAiBC,oBAAoB,QAChC,kBAAkB;AAEzB,MAAMC,OAAO;AACX,aAAa;AACf;AAqKA,cAAc,GACd,MAAMC,aAAa,EAAE;AACrB,cAAc,GACd,MAAMC,eAAe,CAAC;AAEtB;;;;;;;;;;;;;;;CAeC,GACD,OAAO,SAASC,cACdC,UAA6C,CAAC,CAAC;IAE/C,MAAM,EACJC,WAAW,CAAC,CAAC,EACbC,aAAaL,UAAU,EACvBM,cAAc,CAAC,CAAC,EAChBC,cAAc,CAAC,CAAC,EAChBC,gBAAgB,CAAC,CAAC,EAClBC,cAAc,CAAC,CAAC,EAChBC,QAAQC,aAAaZ,IAAI,EACzBa,UAAUC,eAAed,IAAI,EAC7BF,gBAAgBC,oBAAoB,EACpCN,gBAAgBC,oBAAoB,EACpCE,kBAAkBC,sBAAsB,EACzC,GAAGO;IAEJ,MAAM,CAACW,OAAOC,SAAS,GAAGxB,WACxB,SAASyB,QACPF,KAAuC,EACvCG,MAA2B;QAE3B,OAAQA,OAAOC,IAAI;YACjB,KAAK;gBACH,iEAAiE;gBACjE,6BAA6B;gBAC7B,OAAO;oBACLC,OAAOlB;oBACPmB,QAAQpB;oBACRqB,SAASpB;gBACX;YACF,KAAK;gBAAU;oBACb,MAAMkB,QAAyC,CAAC;oBAChD,IAAK,MAAMG,OAAOR,MAAMK,KAAK,CAAE;wBAC7B,IAAI,CAACF,OAAOM,KAAK,CAACC,QAAQ,CAACF,MAAM;4BAC/BH,KAAK,CAACG,IAAI,GAAGR,MAAMK,KAAK,CAACG,IAAI;wBAC/B;oBACF;oBAEA,OAAO;wBACL,GAAGR,KAAK;wBACRK;oBACF;gBACF;YACA,KAAK;gBACH,OAAO;oBACL,GAAGL,KAAK;oBACRK,OAAO;wBACL,GAAGL,MAAMK,KAAK;wBACd,GAAGF,OAAOM,KAAK,CAACE,MAAM,CACpB,CAACF,OAAOG;4BACN,MAAMJ,MAAMlC;4BACZmC,KAAK,CAACD,IAAI,GAAG;gCACXA;gCACAI;gCACAC,UAAU;gCACVC,QAAQ;4BACV;4BAEA,OAAOL;wBACT,GACA,CAAC,EACF;oBACH;oBACAH,QAAQ;2BAAIN,MAAMM,MAAM;2BAAKH,OAAOG,MAAM;qBAAC;gBAC7C;YACF,KAAK;gBAAS;oBACZ,MAAM,EAAEE,GAAG,EAAEO,MAAM,EAAE,GAAGZ;oBACxB,MAAMa,YAAuC;wBAC3CR;wBACAI,MAAMZ,MAAMK,KAAK,CAACG,IAAI,CAACI,IAAI;wBAC3BC,UAAU;wBACVC,QAAQ;oBACV;oBAEA,OAAO;wBACL,GAAGd,KAAK;wBACRO,SAAS;4BACP,GAAGP,MAAMO,OAAO;4BAChB,CAACC,IAAI,EAAEO;wBACT;wBACAV,OAAO;4BACL,GAAGL,MAAMK,KAAK;4BACd,CAACG,IAAI,EAAEQ;wBACT;oBACF;gBACF;YACA,KAAK;gBAAY;oBACf,MAAM,EAAER,GAAG,EAAEK,QAAQ,EAAE,GAAGV;oBAC1B,OAAO;wBACL,GAAGH,KAAK;wBACRK,OAAO;4BACL,GAAGL,MAAMK,KAAK;4BACd,CAACG,IAAI,EAAE;gCACL,GAAGR,MAAMK,KAAK,CAACG,IAAI;gCACnBK;4BACF;wBACF;oBACF;gBACF;YACA,KAAK;gBAAY;oBACf,MAAM,EAAEL,GAAG,EAAES,MAAM,EAAE,GAAGd;oBACxB,MAAMS,OAAiC;wBACrCJ;wBACAI,MAAMZ,MAAMK,KAAK,CAACG,IAAI,CAACI,IAAI;wBAC3BE,QAAQ;wBACRG;wBACAJ,UAAU;oBACZ;oBACA,MAAM,EAAE,CAACL,IAAI,EAAEU,OAAO,EAAE,GAAGX,SAAS,GAAGP,MAAMO,OAAO;oBAEpD,OAAO;wBACL,GAAGP,KAAK;wBACRO;wBACAF,OAAO;4BACL,GAAGL,MAAMK,KAAK;4BACd,CAACG,IAAI,EAAEI;wBACT;oBACF;gBACF;YACA,KAAK;gBACH,OAAO;oBAAE,GAAGZ,KAAK;oBAAEM,QAAQ,EAAE;gBAAC;QAClC;IACF,GACA;QACED,OAAOlB;QACPmB,QAAQpB;QACRqB,SAASpB;IACX;IAEF,MAAM,EAAEkB,KAAK,EAAEC,MAAM,EAAEC,OAAO,EAAE,GAAGP;IAEnC,MAAMmB,YAAYC,OAAOC,MAAM,CAAChB;IAChC,MAAMiB,aAAaH,UAAUI,MAAM;IACnC,MAAMC,aAAaL,UAAUR,MAAM,CACjC,CAACM,QAAQ,EAAEL,MAAM,EAAEa,IAAI,EAAE,EAAE,GAAKR,SAASQ,MACzC;IAEF,MAAMC,aAAanD,YACjB,CAACkC;QACC,MAAM,EAAEkB,OAAO,EAAErB,MAAM,EAAE,GAAGvB,cAAc0B,OAAO;YAC/CnB;YACAC;YACAC;YACAC;YACA+B;YACAF;YACA5B;YACAb;QACF;QAEAoB,SAAS;YAAEG,MAAM;YAASE;YAAQG,OAAOkB;QAAQ;IACnD,GACA;QACE5C;QACAO;QACAC;QACAC;QACAC;QACA+B;QACAF;QACA5B;QACAb;KACD;IAEH,MAAMe,SAASrB,YACb,CAACqD;QACC/B,WAAW+B;QACXA,MAAMC,cAAc;QACpBD,MAAME,eAAe;QAErB,IAAI;YACF,MAAMrB,QAAQmB,MAAMG,YAAY,CAACtB,KAAK;YACtC,IAAIA,OAAO;gBACTiB,WAAWM,MAAMC,IAAI,CAACxB;YACxB;QACF,EAAE,OAAOyB,GAAG;YACVjC,SAAS;gBACPG,MAAM;gBACNK,OAAO,EAAE;gBACTH,QAAQ;oBACN,IAAI1B,gBAAgBsD,aAAaC,QAAQD,EAAEE,OAAO,GAAGC;iBACtD;YACH;QACF;IACF,GACA;QAACX;QAAY7B;KAAW;IAE1B,MAAMC,WAAWvB,YACf,CAACqD;QACC7B,aAAa6B;QACb,IAAI;YACF,MAAMnB,QAAQmB,MAAMU,aAAa,CAAC7B,KAAK;YACvC,IAAIA,OAAO;gBACTiB,WAAWM,MAAMC,IAAI,CAACxB;YACxB,OAAO;gBACL,MAAM,IAAI0B;YACZ;QACF,EAAE,OAAOD,GAAG;YACVjC,SAAS;gBACPG,MAAM;gBACNK,OAAO,EAAE;gBACTH,QAAQ;oBACN,IAAI1B,gBAAgBsD,aAAaC,QAAQD,EAAEE,OAAO,GAAGC;iBACtD;YACH;QACF;IACF,GACA;QAACX;QAAY3B;KAAa;IAG5B,MAAMwC,SAAShE,YACb,CAACiE;QACC,MAAM/B,QAAQ,OAAO+B,cAAc,WAAW;YAACA;SAAU,GAAGA;QAC5D/B,MAAMgC,OAAO,CAAC,CAACC;YACbnC,OAAO,CAACmC,QAAQ,EAAEC;QACpB;QAEA1C,SAAS;YAAEG,MAAM;YAAUK;QAAM;IACnC,GACA;QAACF;KAAQ;IAEX,MAAMqC,QAAQrE,YAAY;QACxB6C,OAAOC,MAAM,CAACd,SAASkC,OAAO,CAAC,CAAC1B;YAC9BA,OAAO4B,KAAK;QACd;QAEA1C,SAAS;YAAEG,MAAM;QAAQ;IAC3B,GAAG;QAACG;KAAQ;IACZ,MAAMsC,cAActE,YAAY;QAC9B0B,SAAS;YAAEG,MAAM;QAAc;IACjC,GAAG,EAAE;IACL,MAAM0C,QAAQvE,YAAY,CAACiC,KAAaO;QACtCd,SAAS;YAAEG,MAAM;YAASI;YAAKO;QAAO;IACxC,GAAG,EAAE;IACL,MAAMgC,WAAWxE,YACf,CAACiC,KAAaS,SAA2B,IAAI;QAC3ChB,SAAS;YAAEG,MAAM;YAAYI;YAAKS;QAAO;IAC3C,GACA,EAAE;IAEJ,MAAM+B,6BAA6BzE,YACjC,CAACiC,MAAgB,CAACoB;YAChB,IAAIA,MAAMqB,gBAAgB,EAAE;gBAC1B,MAAMC,aAAaC,KAAKC,KAAK,CAAC,AAACxB,MAAMyB,MAAM,GAAG,MAAOzB,MAAM0B,KAAK;gBAChErD,SAAS;oBAAEG,MAAM;oBAAYI;oBAAKK,UAAUqC;gBAAW;YACzD;QACF,GACA,EAAE;IAGJ1E,UAAU;QACR,MAAMmD,UAAuC,EAAE;QAC/C,MAAM4B,YAAyC,EAAE;QACjDnC,OAAOC,MAAM,CAAChB,OAAOoC,OAAO,CAAC,CAAC7B;YAC5B,IAAIA,KAAKE,MAAM,KAAK,WAAW;gBAC7Ba,QAAQ6B,IAAI,CAAC5C;YACf,OAAO,IAAIA,KAAKE,MAAM,KAAK,aAAa;gBACtCyC,UAAUC,IAAI,CAAC5C;YACjB;QACF;QAEA,MAAM6C,YACJ9D,gBAAgB,CAAC,IACbgC,QAAQJ,MAAM,GACd4B,KAAKO,GAAG,CAAC,GAAG/D,cAAc4D,UAAUhC,MAAM;QAChD,MAAMoC,QAAQhC,QAAQiC,KAAK,CAAC,GAAGH;QAC/B,IAAI,CAACE,MAAMpC,MAAM,EAAE;YACjB;QACF;QAEAoC,MAAMlB,OAAO,CAAC,CAACpC;YACb,MAAM,EAAEG,GAAG,EAAEI,IAAI,EAAE,GAAGP;YACtB,MAAMU,SAAS,IAAI8C;YAEnB,0DAA0D;YAC1D,yDAAyD;YACzD9C,OAAO+C,gBAAgB,CAAC,YAAYd,2BAA2BxC;YAC/DO,OAAO+C,gBAAgB,CAAC,QAAQ;gBAC9Bf,SAASvC,KAAKO,OAAOE,MAAM;YAC7B;YAEA6B,MAAMtC,KAAKO;YACX,MAAMgD,SAASrF,cAAckC;YAC7B,wBAAwB,GACxB,IACEoD,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBACzB,CAAC;gBAAC;gBAAc;gBAAiB;aAAoB,CAACxD,QAAQ,CAACqD,SAC/D;gBACA,MAAM,IAAI5B,MAAM;YAClB;YAEApB,MAAM,CAACgD,OAAO,CAACnD;QACjB;IACF,GAAG;QACDjB;QACAU;QACA3B;QACAsE;QACAF;QACAC;KACD;IAED,IAAIoB,SAAS;IACb,IAAI5E,WAAWgC,MAAM,EAAE;QACrB4C,SAAS5E,WAAWoB,MAAM,CAAC,CAACyD,GAAGC,MAAQ,GAAGD,IAAI,GAAGA,EAAE,CAAC,CAAC,GAAG,GAAG,CAAC,EAAEC,KAAK,EAAE;IACvE;IAEA,OAAO;QACLhE,OAAOc;QACPb;QACA6D;QACA3C;QACAF;QACA1B;QACAE;QACA8C;QACAL;QACAM;IACF;AACF"}
+{"version":3,"sources":["../../src/files/useFileUpload.ts"],"sourcesContent":["\"use client\";\n\nimport { nanoid } from \"nanoid\";\nimport {\n  type ChangeEvent,\n  type DragEvent,\n  useCallback,\n  useEffect,\n  useReducer,\n} from \"react\";\n\nimport {\n  type CompletedFileUploadStats,\n  type FileReaderResult,\n  type FileUploadHandlers,\n  type FileUploadStats,\n  type GetFileParser,\n  type ProcessingFileUploadStats,\n  getFileParser as defaultGetFileParser,\n} from \"./utils.js\";\nimport {\n  FileAccessError,\n  type FileValidationError,\n  type FileValidationOptions,\n  type FilesValidator,\n  isValidFileName as defaultIsValidFileName,\n  validateFiles as defaultValidateFiles,\n} from \"./validation.js\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\n/**\n *\n * @typeParam CustomError - An optional error type that gets returned from the\n * {@link FilesValidator}.\n * @since 2.9.0\n */\nexport interface FileUploadState<CustomError = never> {\n  /**\n   * All the files that have been validated and are either:\n   * - pending upload\n   * - uploading\n   * - complete\n   *\n   * Each key in this object is the {@link BaseFileUploadStats.key} generated\n   * once the upload starts pending.\n   */\n  stats: Readonly<Record<string, Readonly<FileUploadStats>>>;\n\n  /**\n   * A list of validation errors that have occurred before starting the upload\n   * process.\n   *\n   * @see {@link FileAccessError}\n   * @see {@link TooManyFilesError}\n   * @see {@link FileValidationError}\n   */\n  errors: readonly FileValidationError<CustomError>[];\n}\n\n/**\n *\n * @typeParam CustomError - An optional error type that gets returned from the\n * {@link FilesValidator}.\n * @since 2.9.0\n * @internal\n */\nexport interface FileUploadHookState<CustomError = never>\n  extends FileUploadState<CustomError> {\n  /**\n   * All the current readers used for uploading files to the browser.\n   *\n   * Note: Once an upload has completed, the reader will be removed.\n   */\n  readers: Readonly<Record<string, FileReader>>;\n}\n\n/**\n *\n * @typeParam E - An optional HTMLElement type that is used for the\n * {@link FileUploadHandlers}.\n * @typeParam CustomError - An optional error type that gets returned from the\n * {@link FilesValidator}.\n * @since 2.9.0\n */\nexport interface FileUploadOptions<E extends HTMLElement, CustomError = never>\n  extends FileUploadHandlers<E>,\n    FileValidationOptions {\n  /**\n   * Setting this value to a number greater than `0` will update the browser\n   * upload process to queue the uploads in chunks instead of all at once. This\n   * can help prevent the browser from freezing if dealing with large files that\n   * are being converted to data urls.\n   *\n   * @defaultValue `-1`\n   */\n  concurrency?: number;\n\n  /** {@inheritDoc FilesValidator} */\n  validateFiles?: FilesValidator<CustomError>;\n  /** {@inheritDoc GetFileParser} */\n  getFileParser?: GetFileParser;\n}\n\n/** @internal */\ntype Action<E = never> =\n  | {\n      type: \"queue\";\n      errors: readonly FileValidationError<E>[];\n      files: readonly File[];\n    }\n  | { type: \"reset\" }\n  | { type: \"remove\"; files: readonly string[] }\n  | { type: \"start\"; key: string; reader: FileReader }\n  | { type: \"progress\"; key: string; progress: number }\n  | { type: \"complete\"; key: string; result: FileReaderResult }\n  | { type: \"clearErrors\" };\n\n/** @since 2.9.0 */\nexport interface FileUploadActions {\n  /**\n   * Reset everything related to uploads ensuring that all file readers have\n   * been aborted.\n   */\n  reset: () => void;\n\n  /**\n   * Removes all the errors that exist in state without canceling any of the\n   * uploads already in progress.\n   */\n  clearErrors: () => void;\n\n  /**\n   * This function is used to cancel pending and uploading files or removing\n   * completed files.\n   *\n   * @param keyOrKeys - A single or list of {@link BaseFileUploadStats.key} to\n   * remove from state.\n   */\n  remove: (keyOrKeys: string | readonly string[]) => void;\n}\n\n/**\n *\n * @typeParam E - An optional HTMLElement type that is used for the\n * {@link FileUploadHandlers}.\n * @typeParam CustomError - An optional error type that gets returned from the\n * {@link FilesValidator}.\n * @since 2.9.0\n */\nexport interface FileUploadHookReturnValue<\n  E extends HTMLElement = HTMLElement,\n  CustomError = never,\n> extends FileUploadActions,\n    Required<FileUploadHandlers<E>> {\n  /** {@inheritDoc FileUploadState.errors} */\n  errors: readonly FileValidationError<CustomError>[];\n\n  /**\n   * A list of all the {@link FileUploadStats}.\n   *\n   * @see {@link getSplitFileUploads} for separating by status\n   */\n  stats: readonly Readonly<FileUploadStats>[];\n\n  /**\n   * The total number of bytes for all the files that exist in the\n   * {@link stats} list.\n   */\n  totalBytes: number;\n\n  /**\n   * The total number of files in the {@link stats} list.\n   */\n  totalFiles: number;\n\n  /**\n   * An `accept` string that can be passed to the {@link FileInput} component\n   * when the {@link FileValidationOptions.extensions} list has been provided to\n   * limit which files the OS will _attempt_ to allow access to.\n   *\n   * @example Simple example\n   * ```ts\n   * const extensions = ['pdf', 'docx', 'ppt'];\n   * const { accept } = useFileUpload({ extensions, ...others });\n   *\n   * expect(accept).toBe(\"*.pdf,*.docx,*.ppt\")\n   * ```\n   *\n   * @defaultValue `\"*\"`\n   */\n  accept: string;\n}\n\n/** @internal */\nconst EMPTY_LIST = [] as const;\n/** @internal */\nconst EMPTY_OBJECT = {} as const;\n\n/**\n * This hook is generally used to upload files **to the browser** in different\n * formats to be previewed `<img>`, `<video>`, `<embed>`, etc tags. However, it\n * can also be used to upload the files as an `ArrayBuffer` and then uploaded to\n * a server.\n *\n * @see {@link https://react-md.dev/components/file-input | FileInput Demos}\n * @see {@link https://react-md.dev/hooks/use-file-input | useFileInput Demos}\n * @typeParam E - An optional HTMLElement type that is used for the\n * {@link FileUploadHandlers}.\n * @typeParam CustomError - An optional error type that gets returned from the\n * {@link FilesValidator}.\n * @param options - All the {@link FileUploadOptions}\n * @returns the {@link FileUploadHookReturnValue}\n * @since 2.9.0\n */\nexport function useFileUpload<E extends HTMLElement, CustomError = never>(\n  options: FileUploadOptions<E, CustomError> = {}\n): Readonly<FileUploadHookReturnValue<E, CustomError>> {\n  const {\n    maxFiles = -1,\n    extensions = EMPTY_LIST,\n    minFileSize = -1,\n    maxFileSize = -1,\n    totalFileSize = -1,\n    concurrency = -1,\n    onDrop: propOnDrop = noop,\n    onChange: propOnChange = noop,\n    validateFiles = defaultValidateFiles,\n    getFileParser = defaultGetFileParser,\n    isValidFileName = defaultIsValidFileName,\n  } = options;\n\n  const [state, dispatch] = useReducer(\n    function reducer(\n      state: FileUploadHookState<CustomError>,\n      action: Action<CustomError>\n    ): FileUploadHookState<CustomError> {\n      switch (action.type) {\n        case \"reset\":\n          // need to reuse constants so that calling reset doesn't cause an\n          // infinite loop in an effect\n          return {\n            stats: EMPTY_OBJECT,\n            errors: EMPTY_LIST,\n            readers: EMPTY_OBJECT,\n          };\n        case \"remove\": {\n          const stats: Record<string, FileUploadStats> = {};\n          for (const key in state.stats) {\n            if (!action.files.includes(key)) {\n              stats[key] = state.stats[key];\n            }\n          }\n\n          return {\n            ...state,\n            stats,\n          };\n        }\n        case \"queue\":\n          return {\n            ...state,\n            stats: {\n              ...state.stats,\n              ...action.files.reduce<Record<string, ProcessingFileUploadStats>>(\n                (files, file) => {\n                  const key = nanoid();\n                  files[key] = {\n                    key,\n                    file,\n                    progress: 0,\n                    status: \"pending\",\n                  };\n\n                  return files;\n                },\n                {}\n              ),\n            },\n            errors: [...state.errors, ...action.errors],\n          };\n        case \"start\": {\n          const { key, reader } = action;\n          const fileStats: ProcessingFileUploadStats = {\n            key,\n            file: state.stats[key].file,\n            progress: 0,\n            status: \"uploading\",\n          };\n\n          return {\n            ...state,\n            readers: {\n              ...state.readers,\n              [key]: reader,\n            },\n            stats: {\n              ...state.stats,\n              [key]: fileStats,\n            },\n          };\n        }\n        case \"progress\": {\n          const { key, progress } = action;\n          return {\n            ...state,\n            stats: {\n              ...state.stats,\n              [key]: {\n                ...state.stats[key],\n                progress,\n              },\n            },\n          };\n        }\n        case \"complete\": {\n          const { key, result } = action;\n          const file: CompletedFileUploadStats = {\n            key,\n            file: state.stats[key].file,\n            status: \"complete\",\n            result,\n            progress: 100,\n          };\n          const { [key]: _reader, ...readers } = state.readers;\n\n          return {\n            ...state,\n            readers,\n            stats: {\n              ...state.stats,\n              [key]: file,\n            },\n          };\n        }\n        case \"clearErrors\":\n          return { ...state, errors: [] };\n      }\n    },\n    {\n      stats: EMPTY_OBJECT,\n      errors: EMPTY_LIST,\n      readers: EMPTY_OBJECT,\n    }\n  );\n  const { stats, errors, readers } = state;\n\n  const statsList = Object.values(stats);\n  const totalFiles = statsList.length;\n  const totalBytes = statsList.reduce(\n    (result, { file: { size } }) => result + size,\n    0\n  );\n  const queueFiles = useCallback(\n    (files: readonly File[]) => {\n      const { pending, errors } = validateFiles(files, {\n        maxFiles,\n        extensions,\n        minFileSize,\n        maxFileSize,\n        totalBytes,\n        totalFiles,\n        totalFileSize,\n        isValidFileName,\n      });\n\n      dispatch({ type: \"queue\", errors, files: pending });\n    },\n    [\n      validateFiles,\n      maxFiles,\n      extensions,\n      minFileSize,\n      maxFileSize,\n      totalBytes,\n      totalFiles,\n      totalFileSize,\n      isValidFileName,\n    ]\n  );\n  const onDrop = useCallback(\n    (event: DragEvent<E>) => {\n      propOnDrop(event);\n      event.preventDefault();\n      event.stopPropagation();\n\n      try {\n        const files = event.dataTransfer.files;\n        if (files) {\n          queueFiles(Array.from(files));\n        }\n      } catch (e) {\n        dispatch({\n          type: \"queue\",\n          files: [],\n          errors: [\n            new FileAccessError(e instanceof Error ? e.message : undefined),\n          ],\n        });\n      }\n    },\n    [queueFiles, propOnDrop]\n  );\n  const onChange = useCallback(\n    (event: ChangeEvent<HTMLInputElement>) => {\n      propOnChange(event);\n      try {\n        const files = event.currentTarget.files;\n        if (files) {\n          queueFiles(Array.from(files));\n        } else {\n          throw new Error();\n        }\n      } catch (e) {\n        dispatch({\n          type: \"queue\",\n          files: [],\n          errors: [\n            new FileAccessError(e instanceof Error ? e.message : undefined),\n          ],\n        });\n      }\n    },\n    [queueFiles, propOnChange]\n  );\n\n  const remove = useCallback(\n    (keyOrKeys: string | readonly string[]) => {\n      const files = typeof keyOrKeys === \"string\" ? [keyOrKeys] : keyOrKeys;\n      files.forEach((fileKey) => {\n        readers[fileKey]?.abort();\n      });\n\n      dispatch({ type: \"remove\", files });\n    },\n    [readers]\n  );\n  const reset = useCallback(() => {\n    Object.values(readers).forEach((reader) => {\n      reader.abort();\n    });\n\n    dispatch({ type: \"reset\" });\n  }, [readers]);\n  const clearErrors = useCallback(() => {\n    dispatch({ type: \"clearErrors\" });\n  }, []);\n  const start = useCallback((key: string, reader: FileReader) => {\n    dispatch({ type: \"start\", key, reader });\n  }, []);\n  const complete = useCallback(\n    (key: string, result: FileReaderResult = null) => {\n      dispatch({ type: \"complete\", key, result });\n    },\n    []\n  );\n  const createProgressEventHandler = useCallback(\n    (key: string) => (event: ProgressEvent) => {\n      if (event.lengthComputable) {\n        const percentage = Math.round((event.loaded * 100) / event.total);\n        dispatch({ type: \"progress\", key, progress: percentage });\n      }\n    },\n    []\n  );\n\n  useEffect(() => {\n    const pending: ProcessingFileUploadStats[] = [];\n    const uploading: ProcessingFileUploadStats[] = [];\n    Object.values(stats).forEach((file) => {\n      if (file.status === \"pending\") {\n        pending.push(file);\n      } else if (file.status === \"uploading\") {\n        uploading.push(file);\n      }\n    });\n\n    const lastIndex =\n      concurrency === -1\n        ? pending.length\n        : Math.max(0, concurrency - uploading.length);\n    const queue = pending.slice(0, lastIndex);\n    if (!queue.length) {\n      return;\n    }\n\n    queue.forEach((stats) => {\n      const { key, file } = stats;\n      const reader = new FileReader();\n\n      // using `addEventListener` instead of directly setting to\n      // `reader.progress`/`reader.load` so it's easier to test\n      reader.addEventListener(\"progress\", createProgressEventHandler(key));\n      reader.addEventListener(\"load\", () => {\n        complete(key, reader.result);\n      });\n\n      start(key, reader);\n      const parser = getFileParser(file);\n      /* istanbul ignore next */\n      if (\n        process.env.NODE_ENV !== \"production\" &&\n        ![\"readAsText\", \"readAsDataURL\", \"readAsArrayBuffer\"].includes(parser)\n      ) {\n        throw new Error(\"Invalid file reader parser\");\n      }\n\n      reader[parser](file);\n    });\n  }, [\n    concurrency,\n    stats,\n    getFileParser,\n    createProgressEventHandler,\n    start,\n    complete,\n  ]);\n\n  let accept = \"\";\n  if (extensions.length) {\n    accept = extensions.reduce((s, ext) => `${s ? `${s},` : \"\"}.${ext}`, \"\");\n  }\n\n  return {\n    stats: statsList,\n    errors,\n    accept,\n    totalBytes,\n    totalFiles,\n    onDrop,\n    onChange,\n    reset,\n    remove,\n    clearErrors,\n  };\n}\n"],"names":["nanoid","useCallback","useEffect","useReducer","getFileParser","defaultGetFileParser","FileAccessError","isValidFileName","defaultIsValidFileName","validateFiles","defaultValidateFiles","noop","EMPTY_LIST","EMPTY_OBJECT","useFileUpload","options","maxFiles","extensions","minFileSize","maxFileSize","totalFileSize","concurrency","onDrop","propOnDrop","onChange","propOnChange","state","dispatch","reducer","action","type","stats","errors","readers","key","files","includes","reduce","file","progress","status","reader","fileStats","result","_reader","statsList","Object","values","totalFiles","length","totalBytes","size","queueFiles","pending","event","preventDefault","stopPropagation","dataTransfer","Array","from","e","Error","message","undefined","currentTarget","remove","keyOrKeys","forEach","fileKey","abort","reset","clearErrors","start","complete","createProgressEventHandler","lengthComputable","percentage","Math","round","loaded","total","uploading","push","lastIndex","max","queue","slice","FileReader","addEventListener","parser","process","env","NODE_ENV","accept","s","ext"],"mappings":"AAAA;AAEA,SAASA,MAAM,QAAQ,SAAS;AAChC,SAGEC,WAAW,EACXC,SAAS,EACTC,UAAU,QACL,QAAQ;AAEf,SAOEC,iBAAiBC,oBAAoB,QAChC,aAAa;AACpB,SACEC,eAAe,EAIfC,mBAAmBC,sBAAsB,EACzCC,iBAAiBC,oBAAoB,QAChC,kBAAkB;AAEzB,MAAMC,OAAO;AACX,aAAa;AACf;AAqKA,cAAc,GACd,MAAMC,aAAa,EAAE;AACrB,cAAc,GACd,MAAMC,eAAe,CAAC;AAEtB;;;;;;;;;;;;;;;CAeC,GACD,OAAO,SAASC,cACdC,UAA6C,CAAC,CAAC;IAE/C,MAAM,EACJC,WAAW,CAAC,CAAC,EACbC,aAAaL,UAAU,EACvBM,cAAc,CAAC,CAAC,EAChBC,cAAc,CAAC,CAAC,EAChBC,gBAAgB,CAAC,CAAC,EAClBC,cAAc,CAAC,CAAC,EAChBC,QAAQC,aAAaZ,IAAI,EACzBa,UAAUC,eAAed,IAAI,EAC7BF,gBAAgBC,oBAAoB,EACpCN,gBAAgBC,oBAAoB,EACpCE,kBAAkBC,sBAAsB,EACzC,GAAGO;IAEJ,MAAM,CAACW,OAAOC,SAAS,GAAGxB,WACxB,SAASyB,QACPF,KAAuC,EACvCG,MAA2B;QAE3B,OAAQA,OAAOC,IAAI;YACjB,KAAK;gBACH,iEAAiE;gBACjE,6BAA6B;gBAC7B,OAAO;oBACLC,OAAOlB;oBACPmB,QAAQpB;oBACRqB,SAASpB;gBACX;YACF,KAAK;gBAAU;oBACb,MAAMkB,QAAyC,CAAC;oBAChD,IAAK,MAAMG,OAAOR,MAAMK,KAAK,CAAE;wBAC7B,IAAI,CAACF,OAAOM,KAAK,CAACC,QAAQ,CAACF,MAAM;4BAC/BH,KAAK,CAACG,IAAI,GAAGR,MAAMK,KAAK,CAACG,IAAI;wBAC/B;oBACF;oBAEA,OAAO;wBACL,GAAGR,KAAK;wBACRK;oBACF;gBACF;YACA,KAAK;gBACH,OAAO;oBACL,GAAGL,KAAK;oBACRK,OAAO;wBACL,GAAGL,MAAMK,KAAK;wBACd,GAAGF,OAAOM,KAAK,CAACE,MAAM,CACpB,CAACF,OAAOG;4BACN,MAAMJ,MAAMlC;4BACZmC,KAAK,CAACD,IAAI,GAAG;gCACXA;gCACAI;gCACAC,UAAU;gCACVC,QAAQ;4BACV;4BAEA,OAAOL;wBACT,GACA,CAAC,EACF;oBACH;oBACAH,QAAQ;2BAAIN,MAAMM,MAAM;2BAAKH,OAAOG,MAAM;qBAAC;gBAC7C;YACF,KAAK;gBAAS;oBACZ,MAAM,EAAEE,GAAG,EAAEO,MAAM,EAAE,GAAGZ;oBACxB,MAAMa,YAAuC;wBAC3CR;wBACAI,MAAMZ,MAAMK,KAAK,CAACG,IAAI,CAACI,IAAI;wBAC3BC,UAAU;wBACVC,QAAQ;oBACV;oBAEA,OAAO;wBACL,GAAGd,KAAK;wBACRO,SAAS;4BACP,GAAGP,MAAMO,OAAO;4BAChB,CAACC,IAAI,EAAEO;wBACT;wBACAV,OAAO;4BACL,GAAGL,MAAMK,KAAK;4BACd,CAACG,IAAI,EAAEQ;wBACT;oBACF;gBACF;YACA,KAAK;gBAAY;oBACf,MAAM,EAAER,GAAG,EAAEK,QAAQ,EAAE,GAAGV;oBAC1B,OAAO;wBACL,GAAGH,KAAK;wBACRK,OAAO;4BACL,GAAGL,MAAMK,KAAK;4BACd,CAACG,IAAI,EAAE;gCACL,GAAGR,MAAMK,KAAK,CAACG,IAAI;gCACnBK;4BACF;wBACF;oBACF;gBACF;YACA,KAAK;gBAAY;oBACf,MAAM,EAAEL,GAAG,EAAES,MAAM,EAAE,GAAGd;oBACxB,MAAMS,OAAiC;wBACrCJ;wBACAI,MAAMZ,MAAMK,KAAK,CAACG,IAAI,CAACI,IAAI;wBAC3BE,QAAQ;wBACRG;wBACAJ,UAAU;oBACZ;oBACA,MAAM,EAAE,CAACL,IAAI,EAAEU,OAAO,EAAE,GAAGX,SAAS,GAAGP,MAAMO,OAAO;oBAEpD,OAAO;wBACL,GAAGP,KAAK;wBACRO;wBACAF,OAAO;4BACL,GAAGL,MAAMK,KAAK;4BACd,CAACG,IAAI,EAAEI;wBACT;oBACF;gBACF;YACA,KAAK;gBACH,OAAO;oBAAE,GAAGZ,KAAK;oBAAEM,QAAQ,EAAE;gBAAC;QAClC;IACF,GACA;QACED,OAAOlB;QACPmB,QAAQpB;QACRqB,SAASpB;IACX;IAEF,MAAM,EAAEkB,KAAK,EAAEC,MAAM,EAAEC,OAAO,EAAE,GAAGP;IAEnC,MAAMmB,YAAYC,OAAOC,MAAM,CAAChB;IAChC,MAAMiB,aAAaH,UAAUI,MAAM;IACnC,MAAMC,aAAaL,UAAUR,MAAM,CACjC,CAACM,QAAQ,EAAEL,MAAM,EAAEa,IAAI,EAAE,EAAE,GAAKR,SAASQ,MACzC;IAEF,MAAMC,aAAanD,YACjB,CAACkC;QACC,MAAM,EAAEkB,OAAO,EAAErB,MAAM,EAAE,GAAGvB,cAAc0B,OAAO;YAC/CnB;YACAC;YACAC;YACAC;YACA+B;YACAF;YACA5B;YACAb;QACF;QAEAoB,SAAS;YAAEG,MAAM;YAASE;YAAQG,OAAOkB;QAAQ;IACnD,GACA;QACE5C;QACAO;QACAC;QACAC;QACAC;QACA+B;QACAF;QACA5B;QACAb;KACD;IAEH,MAAMe,SAASrB,YACb,CAACqD;QACC/B,WAAW+B;QACXA,MAAMC,cAAc;QACpBD,MAAME,eAAe;QAErB,IAAI;YACF,MAAMrB,QAAQmB,MAAMG,YAAY,CAACtB,KAAK;YACtC,IAAIA,OAAO;gBACTiB,WAAWM,MAAMC,IAAI,CAACxB;YACxB;QACF,EAAE,OAAOyB,GAAG;YACVjC,SAAS;gBACPG,MAAM;gBACNK,OAAO,EAAE;gBACTH,QAAQ;oBACN,IAAI1B,gBAAgBsD,aAAaC,QAAQD,EAAEE,OAAO,GAAGC;iBACtD;YACH;QACF;IACF,GACA;QAACX;QAAY7B;KAAW;IAE1B,MAAMC,WAAWvB,YACf,CAACqD;QACC7B,aAAa6B;QACb,IAAI;YACF,MAAMnB,QAAQmB,MAAMU,aAAa,CAAC7B,KAAK;YACvC,IAAIA,OAAO;gBACTiB,WAAWM,MAAMC,IAAI,CAACxB;YACxB,OAAO;gBACL,MAAM,IAAI0B;YACZ;QACF,EAAE,OAAOD,GAAG;YACVjC,SAAS;gBACPG,MAAM;gBACNK,OAAO,EAAE;gBACTH,QAAQ;oBACN,IAAI1B,gBAAgBsD,aAAaC,QAAQD,EAAEE,OAAO,GAAGC;iBACtD;YACH;QACF;IACF,GACA;QAACX;QAAY3B;KAAa;IAG5B,MAAMwC,SAAShE,YACb,CAACiE;QACC,MAAM/B,QAAQ,OAAO+B,cAAc,WAAW;YAACA;SAAU,GAAGA;QAC5D/B,MAAMgC,OAAO,CAAC,CAACC;YACbnC,OAAO,CAACmC,QAAQ,EAAEC;QACpB;QAEA1C,SAAS;YAAEG,MAAM;YAAUK;QAAM;IACnC,GACA;QAACF;KAAQ;IAEX,MAAMqC,QAAQrE,YAAY;QACxB6C,OAAOC,MAAM,CAACd,SAASkC,OAAO,CAAC,CAAC1B;YAC9BA,OAAO4B,KAAK;QACd;QAEA1C,SAAS;YAAEG,MAAM;QAAQ;IAC3B,GAAG;QAACG;KAAQ;IACZ,MAAMsC,cAActE,YAAY;QAC9B0B,SAAS;YAAEG,MAAM;QAAc;IACjC,GAAG,EAAE;IACL,MAAM0C,QAAQvE,YAAY,CAACiC,KAAaO;QACtCd,SAAS;YAAEG,MAAM;YAASI;YAAKO;QAAO;IACxC,GAAG,EAAE;IACL,MAAMgC,WAAWxE,YACf,CAACiC,KAAaS,SAA2B,IAAI;QAC3ChB,SAAS;YAAEG,MAAM;YAAYI;YAAKS;QAAO;IAC3C,GACA,EAAE;IAEJ,MAAM+B,6BAA6BzE,YACjC,CAACiC,MAAgB,CAACoB;YAChB,IAAIA,MAAMqB,gBAAgB,EAAE;gBAC1B,MAAMC,aAAaC,KAAKC,KAAK,CAAC,AAACxB,MAAMyB,MAAM,GAAG,MAAOzB,MAAM0B,KAAK;gBAChErD,SAAS;oBAAEG,MAAM;oBAAYI;oBAAKK,UAAUqC;gBAAW;YACzD;QACF,GACA,EAAE;IAGJ1E,UAAU;QACR,MAAMmD,UAAuC,EAAE;QAC/C,MAAM4B,YAAyC,EAAE;QACjDnC,OAAOC,MAAM,CAAChB,OAAOoC,OAAO,CAAC,CAAC7B;YAC5B,IAAIA,KAAKE,MAAM,KAAK,WAAW;gBAC7Ba,QAAQ6B,IAAI,CAAC5C;YACf,OAAO,IAAIA,KAAKE,MAAM,KAAK,aAAa;gBACtCyC,UAAUC,IAAI,CAAC5C;YACjB;QACF;QAEA,MAAM6C,YACJ9D,gBAAgB,CAAC,IACbgC,QAAQJ,MAAM,GACd4B,KAAKO,GAAG,CAAC,GAAG/D,cAAc4D,UAAUhC,MAAM;QAChD,MAAMoC,QAAQhC,QAAQiC,KAAK,CAAC,GAAGH;QAC/B,IAAI,CAACE,MAAMpC,MAAM,EAAE;YACjB;QACF;QAEAoC,MAAMlB,OAAO,CAAC,CAACpC;YACb,MAAM,EAAEG,GAAG,EAAEI,IAAI,EAAE,GAAGP;YACtB,MAAMU,SAAS,IAAI8C;YAEnB,0DAA0D;YAC1D,yDAAyD;YACzD9C,OAAO+C,gBAAgB,CAAC,YAAYd,2BAA2BxC;YAC/DO,OAAO+C,gBAAgB,CAAC,QAAQ;gBAC9Bf,SAASvC,KAAKO,OAAOE,MAAM;YAC7B;YAEA6B,MAAMtC,KAAKO;YACX,MAAMgD,SAASrF,cAAckC;YAC7B,wBAAwB,GACxB,IACEoD,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBACzB,CAAC;gBAAC;gBAAc;gBAAiB;aAAoB,CAACxD,QAAQ,CAACqD,SAC/D;gBACA,MAAM,IAAI5B,MAAM;YAClB;YAEApB,MAAM,CAACgD,OAAO,CAACnD;QACjB;IACF,GAAG;QACDjB;QACAU;QACA3B;QACAsE;QACAF;QACAC;KACD;IAED,IAAIoB,SAAS;IACb,IAAI5E,WAAWgC,MAAM,EAAE;QACrB4C,SAAS5E,WAAWoB,MAAM,CAAC,CAACyD,GAAGC,MAAQ,GAAGD,IAAI,GAAGA,EAAE,CAAC,CAAC,GAAG,GAAG,CAAC,EAAEC,KAAK,EAAE;IACvE;IAEA,OAAO;QACLhE,OAAOc;QACPb;QACA6D;QACA3C;QACAF;QACA1B;QACAE;QACA8C;QACAL;QACAM;IACF;AACF"}

package/dist/form/Checkbox.d.ts

@@ -15,6 +15,6 @@ import { type CheckboxProps } from "./InputToggle.js";
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/checkbox | Checkbox Demos}
+ * @see {@link https://react-md.dev/components/checkbox | Checkbox Demos}
  */
 export declare const Checkbox: import("react").ForwardRefExoticComponent<CheckboxProps & import("react").RefAttributes<HTMLInputElement>>;

package/dist/form/Checkbox.js

@@ -17,7 +17,7 @@ import { InputToggle } from "./InputToggle.js";
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/checkbox | Checkbox Demos}
+ * @see {@link https://react-md.dev/components/checkbox | Checkbox Demos}
  */ export const Checkbox = /*#__PURE__*/ forwardRef(function Checkbox(props, ref) {
     return /*#__PURE__*/ _jsx(InputToggle, {
         ...props,

package/dist/form/Checkbox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/Checkbox.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { type CheckboxProps, InputToggle } from \"./InputToggle.js\";\n\n/**\n * **Client Component**\n *\n * You'll generally want to use the `useCheckboxGroup` hook for managing the\n * checked state for groups of checkboxes and indeterminate checkbox behavior.\n *\n * @example Simple Example\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import { Checkbox } from \"@react-md/core/form/Checkbox\";\n *\n * function Example(): ReactElement {\n *   return <Checkbox label=\"Checkbox\" value=\"a\" />;\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/checkbox | Checkbox Demos}\n */\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  function Checkbox(props, ref) {\n    return <InputToggle {...props} ref={ref} type=\"checkbox\" />;\n  }\n);\n"],"names":["forwardRef","InputToggle","Checkbox","props","ref","type"],"mappings":";AAAA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAA6BC,WAAW,QAAQ,mBAAmB;AAEnE;;;;;;;;;;;;;;;;;CAiBC,GACD,OAAO,MAAMC,yBAAWF,WACtB,SAASE,SAASC,KAAK,EAAEC,GAAG;IAC1B,qBAAO,KAACH;QAAa,GAAGE,KAAK;QAAEC,KAAKA;QAAKC,MAAK;;AAChD,GACA"}
+{"version":3,"sources":["../../src/form/Checkbox.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { type CheckboxProps, InputToggle } from \"./InputToggle.js\";\n\n/**\n * **Client Component**\n *\n * You'll generally want to use the `useCheckboxGroup` hook for managing the\n * checked state for groups of checkboxes and indeterminate checkbox behavior.\n *\n * @example Simple Example\n * ```tsx\n * import type { ReactElement } from \"react\";\n * import { Checkbox } from \"@react-md/core/form/Checkbox\";\n *\n * function Example(): ReactElement {\n *   return <Checkbox label=\"Checkbox\" value=\"a\" />;\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/checkbox | Checkbox Demos}\n */\nexport const Checkbox = forwardRef<HTMLInputElement, CheckboxProps>(\n  function Checkbox(props, ref) {\n    return <InputToggle {...props} ref={ref} type=\"checkbox\" />;\n  }\n);\n"],"names":["forwardRef","InputToggle","Checkbox","props","ref","type"],"mappings":";AAAA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAA6BC,WAAW,QAAQ,mBAAmB;AAEnE;;;;;;;;;;;;;;;;;CAiBC,GACD,OAAO,MAAMC,yBAAWF,WACtB,SAASE,SAASC,KAAK,EAAEC,GAAG;IAC1B,qBAAO,KAACH;QAAa,GAAGE,KAAK;QAAEC,KAAKA;QAAKC,MAAK;;AAChD,GACA"}

package/dist/form/Fieldset.d.ts

@@ -26,6 +26,6 @@ export interface FieldsetProps extends FieldsetHTMLAttributes<HTMLFieldSetElemen
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/fieldset | Fieldset Demos}
+ * @see {@link https://react-md.dev/components/fieldset | Fieldset Demos}
  */
 export declare const Fieldset: import("react").ForwardRefExoticComponent<FieldsetProps & import("react").RefAttributes<HTMLFieldSetElement>>;

package/dist/form/Fieldset.js

@@ -20,7 +20,7 @@ import { fieldset } from "./fieldsetStyles.js";
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/fieldset | Fieldset Demos}
+ * @see {@link https://react-md.dev/components/fieldset | Fieldset Demos}
  */ export const Fieldset = /*#__PURE__*/ forwardRef(function Fieldset(props, ref) {
     const { className, fullWidth = false, browserStyles = false, children, ...remaining } = props;
     return /*#__PURE__*/ _jsx("fieldset", {

package/dist/form/Fieldset.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/Fieldset.tsx"],"sourcesContent":["import { type FieldsetHTMLAttributes, forwardRef } from \"react\";\n\nimport { type FieldsetClassNameOptions, fieldset } from \"./fieldsetStyles.js\";\n\n/**\n * @since 6.0.0 Removed the `legend`, `legendStyle`,\n * `legendClassName`, and `legendSROnly` props. You must provide a `Legend`\n * yourself manually instead of using a prop.\n */\nexport interface FieldsetProps\n  extends FieldsetHTMLAttributes<HTMLFieldSetElement>,\n    FieldsetClassNameOptions {}\n\n/**\n * @example Simple Example\n * ```tsx\n * import { Form } from \"@react-md/core/form/Form\";\n * import { Fieldset } from \"@react-md/core/form/Fieldset\";\n * import { Legend } from \"@react-md/core/form/Legend\";\n *\n * function Example(): ReactElement {\n *   return (\n *     <Form>\n *       <Fieldset>\n *         <Legend>Some Title</Legend>\n *         // form components\n *       </Fieldset>\n *     </Form>\n *   );\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/fieldset | Fieldset Demos}\n */\nexport const Fieldset = forwardRef<HTMLFieldSetElement, FieldsetProps>(\n  function Fieldset(props, ref) {\n    const {\n      className,\n      fullWidth = false,\n      browserStyles = false,\n      children,\n      ...remaining\n    } = props;\n\n    return (\n      <fieldset\n        {...remaining}\n        ref={ref}\n        className={fieldset({\n          className,\n          fullWidth,\n          browserStyles,\n        })}\n      >\n        {children}\n      </fieldset>\n    );\n  }\n);\n"],"names":["forwardRef","fieldset","Fieldset","props","ref","className","fullWidth","browserStyles","children","remaining"],"mappings":";AAAA,SAAsCA,UAAU,QAAQ,QAAQ;AAEhE,SAAwCC,QAAQ,QAAQ,sBAAsB;AAW9E;;;;;;;;;;;;;;;;;;;;CAoBC,GACD,OAAO,MAAMC,yBAAWF,WACtB,SAASE,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EACJC,SAAS,EACTC,YAAY,KAAK,EACjBC,gBAAgB,KAAK,EACrBC,QAAQ,EACR,GAAGC,WACJ,GAAGN;IAEJ,qBACE,KAACF;QACE,GAAGQ,SAAS;QACbL,KAAKA;QACLC,WAAWJ,SAAS;YAClBI;YACAC;YACAC;QACF;kBAECC;;AAGP,GACA"}
+{"version":3,"sources":["../../src/form/Fieldset.tsx"],"sourcesContent":["import { type FieldsetHTMLAttributes, forwardRef } from \"react\";\n\nimport { type FieldsetClassNameOptions, fieldset } from \"./fieldsetStyles.js\";\n\n/**\n * @since 6.0.0 Removed the `legend`, `legendStyle`,\n * `legendClassName`, and `legendSROnly` props. You must provide a `Legend`\n * yourself manually instead of using a prop.\n */\nexport interface FieldsetProps\n  extends FieldsetHTMLAttributes<HTMLFieldSetElement>,\n    FieldsetClassNameOptions {}\n\n/**\n * @example Simple Example\n * ```tsx\n * import { Form } from \"@react-md/core/form/Form\";\n * import { Fieldset } from \"@react-md/core/form/Fieldset\";\n * import { Legend } from \"@react-md/core/form/Legend\";\n *\n * function Example(): ReactElement {\n *   return (\n *     <Form>\n *       <Fieldset>\n *         <Legend>Some Title</Legend>\n *         // form components\n *       </Fieldset>\n *     </Form>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/fieldset | Fieldset Demos}\n */\nexport const Fieldset = forwardRef<HTMLFieldSetElement, FieldsetProps>(\n  function Fieldset(props, ref) {\n    const {\n      className,\n      fullWidth = false,\n      browserStyles = false,\n      children,\n      ...remaining\n    } = props;\n\n    return (\n      <fieldset\n        {...remaining}\n        ref={ref}\n        className={fieldset({\n          className,\n          fullWidth,\n          browserStyles,\n        })}\n      >\n        {children}\n      </fieldset>\n    );\n  }\n);\n"],"names":["forwardRef","fieldset","Fieldset","props","ref","className","fullWidth","browserStyles","children","remaining"],"mappings":";AAAA,SAAsCA,UAAU,QAAQ,QAAQ;AAEhE,SAAwCC,QAAQ,QAAQ,sBAAsB;AAW9E;;;;;;;;;;;;;;;;;;;;CAoBC,GACD,OAAO,MAAMC,yBAAWF,WACtB,SAASE,SAASC,KAAK,EAAEC,GAAG;IAC1B,MAAM,EACJC,SAAS,EACTC,YAAY,KAAK,EACjBC,gBAAgB,KAAK,EACrBC,QAAQ,EACR,GAAGC,WACJ,GAAGN;IAEJ,qBACE,KAACF;QACE,GAAGQ,SAAS;QACbL,KAAKA;QACLC,WAAWJ,SAAS;YAClBI;YACAC;YACAC;QACF;kBAECC;;AAGP,GACA"}

package/dist/form/Form.d.ts

@@ -16,6 +16,6 @@ export interface FormProps extends FormHTMLAttributes<HTMLFormElement> {
  * do much styling or logic. All this form component will do is add basic flex
  * behavior and prevent the default form submit behavior.
  *
- * @see {@link https://next.react-md.dev/components/form | Form Demos}
+ * @see {@link https://react-md.dev/components/form | Form Demos}
  */
 export declare const Form: import("react").ForwardRefExoticComponent<FormProps & import("react").RefAttributes<HTMLFormElement>>;

package/dist/form/Form.js

@@ -11,7 +11,7 @@ const noop = ()=>{
  * do much styling or logic. All this form component will do is add basic flex
  * behavior and prevent the default form submit behavior.
  *
- * @see {@link https://next.react-md.dev/components/form | Form Demos}
+ * @see {@link https://react-md.dev/components/form | Form Demos}
  */ export const Form = /*#__PURE__*/ forwardRef(function Form(props, ref) {
     const { children, onSubmit = noop, disablePreventDefault = false, ...remaining } = props;
     return /*#__PURE__*/ _jsx("form", {

package/dist/form/Form.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/Form.tsx"],"sourcesContent":["\"use client\";\n\nimport { type FormHTMLAttributes, forwardRef } from \"react\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\nexport interface FormProps extends FormHTMLAttributes<HTMLFormElement> {\n  /**\n   * Boolean if the form should no longer prevent default submit behavior. If\n   * you enable this prop you should honestly just use a `<form>` element\n   * instead\n   *\n   * @defaultValue `false`\n   */\n  disablePreventDefault?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * This is probably one of the least useful components available as it doesn't\n * do much styling or logic. All this form component will do is add basic flex\n * behavior and prevent the default form submit behavior.\n *\n * @see {@link https://next.react-md.dev/components/form | Form Demos}\n */\nexport const Form = forwardRef<HTMLFormElement, FormProps>(\n  function Form(props, ref) {\n    const {\n      children,\n      onSubmit = noop,\n      disablePreventDefault = false,\n      ...remaining\n    } = props;\n\n    return (\n      <form\n        {...remaining}\n        onSubmit={(event) => {\n          if (!disablePreventDefault) {\n            event.preventDefault();\n          }\n\n          onSubmit(event);\n        }}\n        ref={ref}\n      >\n        {children}\n      </form>\n    );\n  }\n);\n"],"names":["forwardRef","noop","Form","props","ref","children","onSubmit","disablePreventDefault","remaining","form","event","preventDefault"],"mappings":"AAAA;;AAEA,SAAkCA,UAAU,QAAQ,QAAQ;AAE5D,MAAMC,OAAO;AACX,aAAa;AACf;AAaA;;;;;;;;CAQC,GACD,OAAO,MAAMC,qBAAOF,WAClB,SAASE,KAAKC,KAAK,EAAEC,GAAG;IACtB,MAAM,EACJC,QAAQ,EACRC,WAAWL,IAAI,EACfM,wBAAwB,KAAK,EAC7B,GAAGC,WACJ,GAAGL;IAEJ,qBACE,KAACM;QACE,GAAGD,SAAS;QACbF,UAAU,CAACI;YACT,IAAI,CAACH,uBAAuB;gBAC1BG,MAAMC,cAAc;YACtB;YAEAL,SAASI;QACX;QACAN,KAAKA;kBAEJC;;AAGP,GACA"}
+{"version":3,"sources":["../../src/form/Form.tsx"],"sourcesContent":["\"use client\";\n\nimport { type FormHTMLAttributes, forwardRef } from \"react\";\n\nconst noop = (): void => {\n  // do nothing\n};\n\nexport interface FormProps extends FormHTMLAttributes<HTMLFormElement> {\n  /**\n   * Boolean if the form should no longer prevent default submit behavior. If\n   * you enable this prop you should honestly just use a `<form>` element\n   * instead\n   *\n   * @defaultValue `false`\n   */\n  disablePreventDefault?: boolean;\n}\n\n/**\n * **Client Component**\n *\n * This is probably one of the least useful components available as it doesn't\n * do much styling or logic. All this form component will do is add basic flex\n * behavior and prevent the default form submit behavior.\n *\n * @see {@link https://react-md.dev/components/form | Form Demos}\n */\nexport const Form = forwardRef<HTMLFormElement, FormProps>(\n  function Form(props, ref) {\n    const {\n      children,\n      onSubmit = noop,\n      disablePreventDefault = false,\n      ...remaining\n    } = props;\n\n    return (\n      <form\n        {...remaining}\n        onSubmit={(event) => {\n          if (!disablePreventDefault) {\n            event.preventDefault();\n          }\n\n          onSubmit(event);\n        }}\n        ref={ref}\n      >\n        {children}\n      </form>\n    );\n  }\n);\n"],"names":["forwardRef","noop","Form","props","ref","children","onSubmit","disablePreventDefault","remaining","form","event","preventDefault"],"mappings":"AAAA;;AAEA,SAAkCA,UAAU,QAAQ,QAAQ;AAE5D,MAAMC,OAAO;AACX,aAAa;AACf;AAaA;;;;;;;;CAQC,GACD,OAAO,MAAMC,qBAAOF,WAClB,SAASE,KAAKC,KAAK,EAAEC,GAAG;IACtB,MAAM,EACJC,QAAQ,EACRC,WAAWL,IAAI,EACfM,wBAAwB,KAAK,EAC7B,GAAGC,WACJ,GAAGL;IAEJ,qBACE,KAACM;QACE,GAAGD,SAAS;QACbF,UAAU,CAACI;YACT,IAAI,CAACH,uBAAuB;gBAC1BG,MAAMC,cAAc;YACtB;YAEAL,SAASI;QACX;QACAN,KAAKA;kBAEJC;;AAGP,GACA"}

package/dist/form/FormMessage.d.ts

@@ -8,6 +8,6 @@ import { type FormMessageInputLengthCounterProps, type FormMessageProps } from "
  * This component can also be used to create form-level validation messages by
  * setting the `role` prop to `"alert"`.
  *
- * @see {@link https://next.react-md.dev/components/form-message | FormMessage Demos}
+ * @see {@link https://react-md.dev/components/form-message | FormMessage Demos}
  */
 export declare const FormMessage: import("react").ForwardRefExoticComponent<FormMessageProps & Partial<FormMessageInputLengthCounterProps> & import("react").RefAttributes<HTMLDivElement>>;

package/dist/form/FormMessage.js

@@ -13,7 +13,7 @@ import { formMessage, formMessageText } from "./formMessageStyles.js";
  * This component can also be used to create form-level validation messages by
  * setting the `role` prop to `"alert"`.
  *
- * @see {@link https://next.react-md.dev/components/form-message | FormMessage Demos}
+ * @see {@link https://react-md.dev/components/form-message | FormMessage Demos}
  */ export const FormMessage = /*#__PURE__*/ forwardRef(function FormMessage(props, ref) {
     const { id: propId, role, className, counterStyle, counterClassName, messageStyle, messageClassName, error = false, disableWrap = false, theme: propTheme, children, length, maxLength, ...remaining } = props;
     const id = useEnsuredId(propId, "form-message");

package/dist/form/FormMessage.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/FormMessage.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { FormMessageCounter } from \"./FormMessageCounter.js\";\nimport { getFormConfig } from \"./formConfig.js\";\nimport { formMessage, formMessageText } from \"./formMessageStyles.js\";\nimport {\n  type FormMessageInputLengthCounterProps,\n  type FormMessageProps,\n} from \"./types.js\";\n\n/**\n * The `FormMessage` component is used to create additional helper messages or\n * error messages and generally placed below the related `TextField`. If a\n * `length` (of the `value`) and `maxLength` are provided, a counter will also\n * be displayed to the right of the `children`.\n *\n * This component can also be used to create form-level validation messages by\n * setting the `role` prop to `\"alert\"`.\n *\n * @see {@link https://next.react-md.dev/components/form-message | FormMessage Demos}\n */\nexport const FormMessage = forwardRef<\n  HTMLDivElement,\n  FormMessageProps & Partial<FormMessageInputLengthCounterProps>\n>(function FormMessage(props, ref) {\n  const {\n    id: propId,\n    role,\n    className,\n    counterStyle,\n    counterClassName,\n    messageStyle,\n    messageClassName,\n    error = false,\n    disableWrap = false,\n    theme: propTheme,\n    children,\n    length,\n    maxLength,\n    ...remaining\n  } = props;\n  const id = useEnsuredId(propId, \"form-message\");\n  const theme = getFormConfig(\"theme\", propTheme);\n\n  let message = children;\n  if (!disableWrap && children) {\n    message = (\n      <p\n        id={`${id}-message`}\n        style={messageStyle}\n        className={formMessageText({ className: messageClassName })}\n      >\n        {children}\n      </p>\n    );\n  }\n\n  return (\n    <div\n      {...remaining}\n      id={id}\n      ref={ref}\n      aria-live={role !== \"alert\" ? \"polite\" : undefined}\n      role={role}\n      className={formMessage({ error, theme, className })}\n    >\n      {message}\n      {typeof length === \"number\" && typeof maxLength === \"number\" && (\n        <FormMessageCounter\n          id={`${id}-counter`}\n          style={counterStyle}\n          className={counterClassName}\n        >\n          {`${length} / ${maxLength}`}\n        </FormMessageCounter>\n      )}\n    </div>\n  );\n});\n"],"names":["forwardRef","useEnsuredId","FormMessageCounter","getFormConfig","formMessage","formMessageText","FormMessage","props","ref","id","propId","role","className","counterStyle","counterClassName","messageStyle","messageClassName","error","disableWrap","theme","propTheme","children","length","maxLength","remaining","message","p","style","div","aria-live","undefined"],"mappings":";AAAA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,kBAAkB,QAAQ,0BAA0B;AAC7D,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,WAAW,EAAEC,eAAe,QAAQ,yBAAyB;AAMtE;;;;;;;;;;CAUC,GACD,OAAO,MAAMC,4BAAcN,WAGzB,SAASM,YAAYC,KAAK,EAAEC,GAAG;IAC/B,MAAM,EACJC,IAAIC,MAAM,EACVC,IAAI,EACJC,SAAS,EACTC,YAAY,EACZC,gBAAgB,EAChBC,YAAY,EACZC,gBAAgB,EAChBC,QAAQ,KAAK,EACbC,cAAc,KAAK,EACnBC,OAAOC,SAAS,EAChBC,QAAQ,EACRC,MAAM,EACNC,SAAS,EACT,GAAGC,WACJ,GAAGjB;IACJ,MAAME,KAAKR,aAAaS,QAAQ;IAChC,MAAMS,QAAQhB,cAAc,SAASiB;IAErC,IAAIK,UAAUJ;IACd,IAAI,CAACH,eAAeG,UAAU;QAC5BI,wBACE,KAACC;YACCjB,IAAI,GAAGA,GAAG,QAAQ,CAAC;YACnBkB,OAAOZ;YACPH,WAAWP,gBAAgB;gBAAEO,WAAWI;YAAiB;sBAExDK;;IAGP;IAEA,qBACE,MAACO;QACE,GAAGJ,SAAS;QACbf,IAAIA;QACJD,KAAKA;QACLqB,aAAWlB,SAAS,UAAU,WAAWmB;QACzCnB,MAAMA;QACNC,WAAWR,YAAY;YAAEa;YAAOE;YAAOP;QAAU;;YAEhDa;YACA,OAAOH,WAAW,YAAY,OAAOC,cAAc,0BAClD,KAACrB;gBACCO,IAAI,GAAGA,GAAG,QAAQ,CAAC;gBACnBkB,OAAOd;gBACPD,WAAWE;0BAEV,GAAGQ,OAAO,GAAG,EAAEC,WAAW;;;;AAKrC,GAAG"}
+{"version":3,"sources":["../../src/form/FormMessage.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { FormMessageCounter } from \"./FormMessageCounter.js\";\nimport { getFormConfig } from \"./formConfig.js\";\nimport { formMessage, formMessageText } from \"./formMessageStyles.js\";\nimport {\n  type FormMessageInputLengthCounterProps,\n  type FormMessageProps,\n} from \"./types.js\";\n\n/**\n * The `FormMessage` component is used to create additional helper messages or\n * error messages and generally placed below the related `TextField`. If a\n * `length` (of the `value`) and `maxLength` are provided, a counter will also\n * be displayed to the right of the `children`.\n *\n * This component can also be used to create form-level validation messages by\n * setting the `role` prop to `\"alert\"`.\n *\n * @see {@link https://react-md.dev/components/form-message | FormMessage Demos}\n */\nexport const FormMessage = forwardRef<\n  HTMLDivElement,\n  FormMessageProps & Partial<FormMessageInputLengthCounterProps>\n>(function FormMessage(props, ref) {\n  const {\n    id: propId,\n    role,\n    className,\n    counterStyle,\n    counterClassName,\n    messageStyle,\n    messageClassName,\n    error = false,\n    disableWrap = false,\n    theme: propTheme,\n    children,\n    length,\n    maxLength,\n    ...remaining\n  } = props;\n  const id = useEnsuredId(propId, \"form-message\");\n  const theme = getFormConfig(\"theme\", propTheme);\n\n  let message = children;\n  if (!disableWrap && children) {\n    message = (\n      <p\n        id={`${id}-message`}\n        style={messageStyle}\n        className={formMessageText({ className: messageClassName })}\n      >\n        {children}\n      </p>\n    );\n  }\n\n  return (\n    <div\n      {...remaining}\n      id={id}\n      ref={ref}\n      aria-live={role !== \"alert\" ? \"polite\" : undefined}\n      role={role}\n      className={formMessage({ error, theme, className })}\n    >\n      {message}\n      {typeof length === \"number\" && typeof maxLength === \"number\" && (\n        <FormMessageCounter\n          id={`${id}-counter`}\n          style={counterStyle}\n          className={counterClassName}\n        >\n          {`${length} / ${maxLength}`}\n        </FormMessageCounter>\n      )}\n    </div>\n  );\n});\n"],"names":["forwardRef","useEnsuredId","FormMessageCounter","getFormConfig","formMessage","formMessageText","FormMessage","props","ref","id","propId","role","className","counterStyle","counterClassName","messageStyle","messageClassName","error","disableWrap","theme","propTheme","children","length","maxLength","remaining","message","p","style","div","aria-live","undefined"],"mappings":";AAAA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,kBAAkB,QAAQ,0BAA0B;AAC7D,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,WAAW,EAAEC,eAAe,QAAQ,yBAAyB;AAMtE;;;;;;;;;;CAUC,GACD,OAAO,MAAMC,4BAAcN,WAGzB,SAASM,YAAYC,KAAK,EAAEC,GAAG;IAC/B,MAAM,EACJC,IAAIC,MAAM,EACVC,IAAI,EACJC,SAAS,EACTC,YAAY,EACZC,gBAAgB,EAChBC,YAAY,EACZC,gBAAgB,EAChBC,QAAQ,KAAK,EACbC,cAAc,KAAK,EACnBC,OAAOC,SAAS,EAChBC,QAAQ,EACRC,MAAM,EACNC,SAAS,EACT,GAAGC,WACJ,GAAGjB;IACJ,MAAME,KAAKR,aAAaS,QAAQ;IAChC,MAAMS,QAAQhB,cAAc,SAASiB;IAErC,IAAIK,UAAUJ;IACd,IAAI,CAACH,eAAeG,UAAU;QAC5BI,wBACE,KAACC;YACCjB,IAAI,GAAGA,GAAG,QAAQ,CAAC;YACnBkB,OAAOZ;YACPH,WAAWP,gBAAgB;gBAAEO,WAAWI;YAAiB;sBAExDK;;IAGP;IAEA,qBACE,MAACO;QACE,GAAGJ,SAAS;QACbf,IAAIA;QACJD,KAAKA;QACLqB,aAAWlB,SAAS,UAAU,WAAWmB;QACzCnB,MAAMA;QACNC,WAAWR,YAAY;YAAEa;YAAOE;YAAOP;QAAU;;YAEhDa;YACA,OAAOH,WAAW,YAAY,OAAOC,cAAc,0BAClD,KAACrB;gBACCO,IAAI,GAAGA,GAAG,QAAQ,CAAC;gBACnBkB,OAAOd;gBACPD,WAAWE;0BAEV,GAAGQ,OAAO,GAAG,EAAEC,WAAW;;;;AAKrC,GAAG"}

package/dist/form/FormMessageContainer.d.ts

@@ -16,7 +16,7 @@ export interface FormMessageContainerProps extends HTMLAttributes<HTMLDivElement
  * Conditionally wraps the `children` in a `.rmd-form-message-container` wrapper
  * and renders the {@link FormMessage} component.
  *
- * @see {@link https://next.react-md.dev/components/form-message | FormMessage Demos}
+ * @see {@link https://react-md.dev/components/form-message | FormMessage Demos}
  * @since 2.5.0
  */
 export declare const FormMessageContainer: import("react").ForwardRefExoticComponent<FormMessageContainerProps & import("react").RefAttributes<HTMLDivElement>>;

package/dist/form/FormMessageContainer.js

@@ -6,7 +6,7 @@ import { formMessageContainer } from "./formMessageContainerStyles.js";
  * Conditionally wraps the `children` in a `.rmd-form-message-container` wrapper
  * and renders the {@link FormMessage} component.
  *
- * @see {@link https://next.react-md.dev/components/form-message | FormMessage Demos}
+ * @see {@link https://react-md.dev/components/form-message | FormMessage Demos}
  * @since 2.5.0
  */ export const FormMessageContainer = /*#__PURE__*/ forwardRef(function FormMessageContainer(props, ref) {
     const { className, children, messageProps, ...remaining } = props;

package/dist/form/FormMessageContainer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/FormMessageContainer.tsx"],"sourcesContent":["import { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { type PropsWithRef } from \"../types.js\";\nimport { FormMessage } from \"./FormMessage.js\";\nimport { formMessageContainer } from \"./formMessageContainerStyles.js\";\nimport { type FormMessageProps } from \"./types.js\";\n\n/**\n * @since 2.5.0\n */\nexport interface FormMessageContainerProps\n  extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * If the extension doesn't actually want to render the `FormMessage`\n   * component, these props are optional. It kind of eliminates the whole\n   * purpose of this component though.\n   */\n  messageProps?: PropsWithRef<FormMessageProps, HTMLDivElement>;\n}\n\n/**\n * Conditionally wraps the `children` in a `.rmd-form-message-container` wrapper\n * and renders the {@link FormMessage} component.\n *\n * @see {@link https://next.react-md.dev/components/form-message | FormMessage Demos}\n * @since 2.5.0\n */\nexport const FormMessageContainer = forwardRef<\n  HTMLDivElement,\n  FormMessageContainerProps\n>(function FormMessageContainer(props, ref) {\n  const { className, children, messageProps, ...remaining } = props;\n  if (!messageProps) {\n    return <>{children}</>;\n  }\n\n  return (\n    <div\n      {...remaining}\n      ref={ref}\n      className={formMessageContainer({ className })}\n    >\n      {children}\n      <FormMessage {...messageProps} />\n    </div>\n  );\n});\n"],"names":["forwardRef","FormMessage","formMessageContainer","FormMessageContainer","props","ref","className","children","messageProps","remaining","div"],"mappings":";AAAA,SAA8BA,UAAU,QAAQ,QAAQ;AAGxD,SAASC,WAAW,QAAQ,mBAAmB;AAC/C,SAASC,oBAAoB,QAAQ,kCAAkC;AAgBvE;;;;;;CAMC,GACD,OAAO,MAAMC,qCAAuBH,WAGlC,SAASG,qBAAqBC,KAAK,EAAEC,GAAG;IACxC,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,YAAY,EAAE,GAAGC,WAAW,GAAGL;IAC5D,IAAI,CAACI,cAAc;QACjB,qBAAO;sBAAGD;;IACZ;IAEA,qBACE,MAACG;QACE,GAAGD,SAAS;QACbJ,KAAKA;QACLC,WAAWJ,qBAAqB;YAAEI;QAAU;;YAE3CC;0BACD,KAACN;gBAAa,GAAGO,YAAY;;;;AAGnC,GAAG"}
+{"version":3,"sources":["../../src/form/FormMessageContainer.tsx"],"sourcesContent":["import { type HTMLAttributes, forwardRef } from \"react\";\n\nimport { type PropsWithRef } from \"../types.js\";\nimport { FormMessage } from \"./FormMessage.js\";\nimport { formMessageContainer } from \"./formMessageContainerStyles.js\";\nimport { type FormMessageProps } from \"./types.js\";\n\n/**\n * @since 2.5.0\n */\nexport interface FormMessageContainerProps\n  extends HTMLAttributes<HTMLDivElement> {\n  /**\n   * If the extension doesn't actually want to render the `FormMessage`\n   * component, these props are optional. It kind of eliminates the whole\n   * purpose of this component though.\n   */\n  messageProps?: PropsWithRef<FormMessageProps, HTMLDivElement>;\n}\n\n/**\n * Conditionally wraps the `children` in a `.rmd-form-message-container` wrapper\n * and renders the {@link FormMessage} component.\n *\n * @see {@link https://react-md.dev/components/form-message | FormMessage Demos}\n * @since 2.5.0\n */\nexport const FormMessageContainer = forwardRef<\n  HTMLDivElement,\n  FormMessageContainerProps\n>(function FormMessageContainer(props, ref) {\n  const { className, children, messageProps, ...remaining } = props;\n  if (!messageProps) {\n    return <>{children}</>;\n  }\n\n  return (\n    <div\n      {...remaining}\n      ref={ref}\n      className={formMessageContainer({ className })}\n    >\n      {children}\n      <FormMessage {...messageProps} />\n    </div>\n  );\n});\n"],"names":["forwardRef","FormMessage","formMessageContainer","FormMessageContainer","props","ref","className","children","messageProps","remaining","div"],"mappings":";AAAA,SAA8BA,UAAU,QAAQ,QAAQ;AAGxD,SAASC,WAAW,QAAQ,mBAAmB;AAC/C,SAASC,oBAAoB,QAAQ,kCAAkC;AAgBvE;;;;;;CAMC,GACD,OAAO,MAAMC,qCAAuBH,WAGlC,SAASG,qBAAqBC,KAAK,EAAEC,GAAG;IACxC,MAAM,EAAEC,SAAS,EAAEC,QAAQ,EAAEC,YAAY,EAAE,GAAGC,WAAW,GAAGL;IAC5D,IAAI,CAACI,cAAc;QACjB,qBAAO;sBAAGD;;IACZ;IAEA,qBACE,MAACG;QACE,GAAGD,SAAS;QACbJ,KAAKA;QACLC,WAAWJ,qBAAqB;YAAEI;QAAU;;YAE3CC;0BACD,KAACN;gBAAa,GAAGO,YAAY;;;;AAGnC,GAAG"}

package/dist/form/FormMessageCounter.d.ts

@@ -36,8 +36,8 @@ export interface FormMessageCounterProps extends HTMLAttributes<HTMLSpanElement>
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/form-message | FormMessage Demos}
- * @see {@link https://next.react-md.dev/components/text-field | TextField Demos}
+ * @see {@link https://react-md.dev/components/form-message | FormMessage Demos}
+ * @see {@link https://react-md.dev/components/text-field | TextField Demos}
  * @since 2.9.0
  */
 export declare function FormMessageCounter(props: FormMessageCounterProps): ReactElement;

package/dist/form/FormMessageCounter.js

@@ -25,8 +25,8 @@ import { formMessageCounter } from "./formMessageStyles.js";
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/form-message | FormMessage Demos}
- * @see {@link https://next.react-md.dev/components/text-field | TextField Demos}
+ * @see {@link https://react-md.dev/components/form-message | FormMessage Demos}
+ * @see {@link https://react-md.dev/components/text-field | TextField Demos}
  * @since 2.9.0
  */ export function FormMessageCounter(props) {
     const { children, className, ...remaining } = props;

package/dist/form/FormMessageCounter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/FormMessageCounter.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactElement, type ReactNode } from \"react\";\n\nimport { formMessageCounter } from \"./formMessageStyles.js\";\n\n/** @since 2.9.0 */\nexport interface FormMessageCounterProps\n  extends HTMLAttributes<HTMLSpanElement> {\n  /**\n   * The children to display in the counter. This is normally a string like:\n   *\n   * @example String Example\n   * ```ts\n   * `${min} / ${max}`\n   * ```\n   */\n  children: ReactNode;\n}\n\n/**\n * This component can be used to create a \"counter\" within the\n * {@link FormMessage} component.\n *\n * Note: This is really only useful when using the {@link FormMessage} component\n * without a {@link TextField}.\n *\n * @example Example Usage\n * ```ts\n * interface ExampleProps {\n *   min: number;\n *   max: number;\n * }\n *\n * function Example({ min, max }: ExampleProps) {\n *   return (\n *     <FormMessage disableWrap>\n *       <FormMessageCounter>\n *         {`${min} / ${max}`}\n *       </FormMessageCounter>\n *     </FormMessage>\n *   );\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/form-message | FormMessage Demos}\n * @see {@link https://next.react-md.dev/components/text-field | TextField Demos}\n * @since 2.9.0\n */\nexport function FormMessageCounter(\n  props: FormMessageCounterProps\n): ReactElement {\n  const { children, className, ...remaining } = props;\n\n  return (\n    <span {...remaining} className={formMessageCounter({ className })}>\n      {children}\n    </span>\n  );\n}\n"],"names":["formMessageCounter","FormMessageCounter","props","children","className","remaining","span"],"mappings":";AAEA,SAASA,kBAAkB,QAAQ,yBAAyB;AAgB5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4BC,GACD,OAAO,SAASC,mBACdC,KAA8B;IAE9B,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,WAAW,GAAGH;IAE9C,qBACE,KAACI;QAAM,GAAGD,SAAS;QAAED,WAAWJ,mBAAmB;YAAEI;QAAU;kBAC5DD;;AAGP"}
+{"version":3,"sources":["../../src/form/FormMessageCounter.tsx"],"sourcesContent":["import { type HTMLAttributes, type ReactElement, type ReactNode } from \"react\";\n\nimport { formMessageCounter } from \"./formMessageStyles.js\";\n\n/** @since 2.9.0 */\nexport interface FormMessageCounterProps\n  extends HTMLAttributes<HTMLSpanElement> {\n  /**\n   * The children to display in the counter. This is normally a string like:\n   *\n   * @example String Example\n   * ```ts\n   * `${min} / ${max}`\n   * ```\n   */\n  children: ReactNode;\n}\n\n/**\n * This component can be used to create a \"counter\" within the\n * {@link FormMessage} component.\n *\n * Note: This is really only useful when using the {@link FormMessage} component\n * without a {@link TextField}.\n *\n * @example Example Usage\n * ```ts\n * interface ExampleProps {\n *   min: number;\n *   max: number;\n * }\n *\n * function Example({ min, max }: ExampleProps) {\n *   return (\n *     <FormMessage disableWrap>\n *       <FormMessageCounter>\n *         {`${min} / ${max}`}\n *       </FormMessageCounter>\n *     </FormMessage>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/form-message | FormMessage Demos}\n * @see {@link https://react-md.dev/components/text-field | TextField Demos}\n * @since 2.9.0\n */\nexport function FormMessageCounter(\n  props: FormMessageCounterProps\n): ReactElement {\n  const { children, className, ...remaining } = props;\n\n  return (\n    <span {...remaining} className={formMessageCounter({ className })}>\n      {children}\n    </span>\n  );\n}\n"],"names":["formMessageCounter","FormMessageCounter","props","children","className","remaining","span"],"mappings":";AAEA,SAASA,kBAAkB,QAAQ,yBAAyB;AAgB5D;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4BC,GACD,OAAO,SAASC,mBACdC,KAA8B;IAE9B,MAAM,EAAEC,QAAQ,EAAEC,SAAS,EAAE,GAAGC,WAAW,GAAGH;IAE9C,qBACE,KAACI;QAAM,GAAGD,SAAS;QAAED,WAAWJ,mBAAmB;YAAEI;QAAU;kBAC5DD;;AAGP"}

package/dist/form/InputToggle.d.ts

@@ -178,8 +178,8 @@ export type InputToggleProps = CheckboxInputToggleProps | RadioInputToggleProps;
 /**
  * **Client Component**
  *
- * @see {@link https://next.react-md.dev/components/checkbox | Checkbox Demos}
- * @see {@link https://next.react-md.dev/components/radio | Radio Demos}
+ * @see {@link https://react-md.dev/components/checkbox | Checkbox Demos}
+ * @see {@link https://react-md.dev/components/radio | Radio Demos}
  * @since 6.0.0 Now supports the `FormMessage` behavior and requires
  * different icons for each checked state.
  */

package/dist/form/InputToggle.js

@@ -10,8 +10,8 @@ import { Label } from "./Label.js";
 /**
  * **Client Component**
  *
- * @see {@link https://next.react-md.dev/components/checkbox | Checkbox Demos}
- * @see {@link https://next.react-md.dev/components/radio | Radio Demos}
+ * @see {@link https://react-md.dev/components/checkbox | Checkbox Demos}
+ * @see {@link https://react-md.dev/components/radio | Radio Demos}
  * @since 6.0.0 Now supports the `FormMessage` behavior and requires
  * different icons for each checked state.
  */ export const InputToggle = /*#__PURE__*/ forwardRef(function InputToggle(props, ref) {

package/dist/form/InputToggle.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/InputToggle.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport {\n  type CSSProperties,\n  type HTMLAttributes,\n  type InputHTMLAttributes,\n  type LabelHTMLAttributes,\n  type ReactNode,\n  forwardRef,\n} from \"react\";\n\nimport { type ComponentWithRippleProps } from \"../interaction/types.js\";\nimport { useElementInteraction } from \"../interaction/useElementInteraction.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { FormMessageContainer } from \"./FormMessageContainer.js\";\nimport { InputToggleIcon } from \"./InputToggleIcon.js\";\nimport { Label } from \"./Label.js\";\nimport { type InputToggleSize } from \"./inputToggleStyles.js\";\nimport {\n  type FormComponentStates,\n  type FormMessageContainerExtension,\n} from \"./types.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ConfigurableInputToggleIconProps {\n  /**\n   * @see {@link InputToggleSize}\n   * @defaultValue `\"normal\"`\n   */\n  size?: InputToggleSize;\n\n  /**\n   * The icon to use while unchecked. This defaults to the unchecked\n   * checkbox/radio icon from the `ICON_CONFIG`.\n   *\n   * @defaultValue `getIcon(props.type)`\n   */\n  icon?: ReactNode;\n\n  /**\n   * The icon to use while unchecked. This defaults to the unchecked\n   * checkbox/radio icon from the `ICON_CONFIG`.\n   *\n   * @defaultValue `getIcon(``${props.type}Checked``)`\n   */\n  checkedIcon?: ReactNode;\n\n  /**\n   * Any props that should be passed to the `<span>` that surrounds the current\n   * icon element.\n   */\n  iconProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;\n\n  /**\n   * Optional style to set on the `<span>` that surrounds the current icon\n   * element.\n   */\n  iconStyle?: CSSProperties;\n\n  /**\n   * Optional className to set on the `<span>` that surrounds the current icon\n   * element.\n   */\n  iconClassName?: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface InputToggleLabelProps {\n  /**\n   * An optional label to display with the checkbox. If this is omitted, it is\n   * recommended to provide an `aria-label` for accessibility.\n   */\n  label?: ReactNode;\n\n  /**\n   * Any props that should be passed to the `<Label>` component.\n   *\n   * Note: If `style` or `className` are provided in this object, they will be\n   * ignored. Use the top-level `style` and `className` props instead.\n   *\n   * @example\n   * ```\n   *  // bad\n   * labelProps={{\n   *   \"aria-label\": \"checkbox\",\n   *   style: { color: \"red\" },\n   *   className: \"custom\"\n   * }}\n   *\n   * // good\n   * style={{ color: \"red\" }}\n   * className=\"custom\"\n   * labelProps={{\n   *   \"aria-label\": \"checkbox\",\n   * }}\n   * ```\n   */\n  labelProps?: PropsWithRef<\n    LabelHTMLAttributes<HTMLLabelElement>,\n    HTMLLabelElement\n  >;\n\n  /**\n   * @see {@link LabelClassNameOptions.gap}\n   * @defaultValue `false`\n   */\n  disableLabelGap?: boolean;\n\n  /**\n   * Set this to `true` to swap the position of the {@link label} and the current\n   * icon. This prop can be used with the {@link stacked} prop to change the\n   * position if the icon and label:\n   *\n   * ____________________________________\n   * | stacked | iconAfter | position   |\n   * ____________________________________\n   * |         |           | icon label |\n   * ____________________________________\n   * |         | X         | label icon |\n   * ____________________________________\n   * | X       |           | icon       |\n   * |         |           | label      |\n   * ____________________________________\n   * | X       | X         | label      |\n   * |         |           | icon       |\n   * ____________________________________\n   *\n   *\n   * @defaultValue `false`\n   */\n  iconAfter?: boolean;\n\n  /**\n   * Set this to `true` if the label should be stacked instead of inline with\n   * the current icon.\n   *\n   * @see {@link iconAfter}\n   * @defaultValue `false`\n   */\n  stacked?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface BaseInputToggleProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, \"size\">,\n    FormMessageContainerExtension,\n    FormComponentStates,\n    ConfigurableInputToggleIconProps,\n    InputToggleLabelProps,\n    ComponentWithRippleProps {\n  /**\n   * @see https://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing\n   * @defaultValue `type === \"checkbox\" ? \"off\" : undefined`\n   */\n  autoComplete?: string;\n}\n\n/**\n * @since 2.8.5\n * @since 6.0.0 Removed the `aria-controls` prop and added the\n * `indeterminateIcon` prop.\n */\nexport interface IndeterminateCheckboxProps {\n  /**\n   * Set this value to `true` if the checkbox is in an \"indeterminate\" state:\n   *\n   * - this checkbox controls the select all/select none behavior of other\n   *   checkboxes in a group\n   * - at least one of the checkboxes have been checked\n   *   - the `checked` prop for this Checkbox should also be `true`\n   *\n   * You should normally use the `useCheckboxGroup` hook to handle this\n   * behavior.\n   *\n   * @defaultValue `false`\n   */\n  indeterminate?: boolean;\n\n  /**\n   * The icon to display when the checkbox is checked and the\n   * {@link indeterminate} prop is `true`.\n   *\n   * @defaultValue `getIcon(\"checkboxIndeterminate\")`\n   * @since 6.0.0\n   */\n  indeterminateIcon?: ReactNode;\n}\n\nexport interface CheckboxProps\n  extends BaseInputToggleProps,\n    IndeterminateCheckboxProps {}\n\n/** @since 6.0.0 */\nexport interface CheckboxInputToggleProps extends CheckboxProps {\n  type: \"checkbox\";\n}\n\nexport interface RadioProps extends BaseInputToggleProps {\n  /**\n   * The value for the radio button.\n   *\n   * @since 6.0.0 This is now optional and no longer supports\n   * `string[]` since there isn't much of a use case for array values.\n   */\n  value?: string | number;\n}\n\n/** @since 6.0.0 */\nexport interface RadioInputToggleProps extends RadioProps {\n  type: \"radio\";\n}\n\n/**\n * @since 6.0.0 Updated to be a union between\n * `CheckboxInputToggleProps` and `RadioInputToggleProps`\n */\nexport type InputToggleProps = CheckboxInputToggleProps | RadioInputToggleProps;\n\n/**\n * **Client Component**\n *\n * @see {@link https://next.react-md.dev/components/checkbox | Checkbox Demos}\n * @see {@link https://next.react-md.dev/components/radio | Radio Demos}\n * @since 6.0.0 Now supports the `FormMessage` behavior and requires\n * different icons for each checked state.\n */\nexport const InputToggle = forwardRef<HTMLInputElement, InputToggleProps>(\n  function InputToggle(props, ref) {\n    const {\n      id: propId,\n      type,\n      label,\n      labelProps,\n      style,\n      className,\n      autoComplete = type === \"checkbox\" ? \"off\" : undefined,\n      disableLabelGap = false,\n      stacked = false,\n      iconAfter = false,\n      size = \"normal\",\n      error = false,\n      active = false,\n      indeterminate = false,\n      messageProps,\n      messageContainerProps,\n      icon,\n      checkedIcon,\n      indeterminateIcon,\n      iconProps,\n      iconStyle,\n      iconClassName,\n      onBlur,\n      onClick,\n      onKeyDown,\n      onKeyUp,\n      onMouseDown,\n      onMouseLeave,\n      onDragStart,\n      onMouseUp,\n      onTouchEnd,\n      onTouchMove,\n      onTouchStart,\n      disableRipple,\n      ...remaining\n    } = props as CheckboxInputToggleProps;\n    const { disabled = false, checked } = props;\n\n    const id = useEnsuredId(propId, type);\n    const { pressedClassName, ripples, handlers } = useElementInteraction({\n      mode: disableRipple ? \"none\" : undefined,\n      disabled,\n      onBlur,\n      onClick,\n      onKeyDown,\n      onKeyUp,\n      onMouseDown,\n      onMouseLeave,\n      onDragStart,\n      onMouseUp,\n      onTouchEnd,\n      onTouchMove,\n      onTouchStart,\n    });\n\n    // set on the `remaining` object to bypass the eslint rule about\n    // aria-checked not being valid for textbox role\n    remaining[\"aria-checked\"] =\n      (remaining[\"aria-checked\"] ?? indeterminate) ? \"mixed\" : undefined;\n\n    return (\n      <FormMessageContainer\n        {...messageContainerProps}\n        messageProps={messageProps}\n      >\n        <Label\n          {...labelProps}\n          gap={!disableLabelGap}\n          style={style}\n          stacked={stacked}\n          reversed={!iconAfter}\n          active={active}\n          error={error}\n          disabled={disabled}\n          className={className}\n        >\n          {label}\n          <InputToggleIcon\n            style={iconStyle}\n            {...iconProps}\n            className={cnb(\n              pressedClassName,\n              iconClassName,\n              iconProps?.className\n            )}\n            error={error}\n            checked={checked}\n            disabled={disabled}\n            size={size}\n            type={type}\n            icon={icon}\n            checkedIcon={checkedIcon}\n            indeterminate={indeterminate}\n            indeterminateIcon={indeterminateIcon}\n          >\n            <input\n              {...remaining}\n              {...handlers}\n              autoComplete={autoComplete}\n              id={id}\n              ref={ref}\n              type={type}\n              className=\"rmd-hidden-input\"\n            />\n            {ripples}\n          </InputToggleIcon>\n        </Label>\n      </FormMessageContainer>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","useElementInteraction","useEnsuredId","FormMessageContainer","InputToggleIcon","Label","InputToggle","props","ref","id","propId","type","label","labelProps","style","className","autoComplete","undefined","disableLabelGap","stacked","iconAfter","size","error","active","indeterminate","messageProps","messageContainerProps","icon","checkedIcon","indeterminateIcon","iconProps","iconStyle","iconClassName","onBlur","onClick","onKeyDown","onKeyUp","onMouseDown","onMouseLeave","onDragStart","onMouseUp","onTouchEnd","onTouchMove","onTouchStart","disableRipple","remaining","disabled","checked","pressedClassName","ripples","handlers","mode","gap","reversed","input"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAMEC,UAAU,QACL,QAAQ;AAGf,SAASC,qBAAqB,QAAQ,0CAA0C;AAEhF,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,oBAAoB,QAAQ,4BAA4B;AACjE,SAASC,eAAe,QAAQ,uBAAuB;AACvD,SAASC,KAAK,QAAQ,aAAa;AAgNnC;;;;;;;CAOC,GACD,OAAO,MAAMC,4BAAcN,WACzB,SAASM,YAAYC,KAAK,EAAEC,GAAG;IAC7B,MAAM,EACJC,IAAIC,MAAM,EACVC,IAAI,EACJC,KAAK,EACLC,UAAU,EACVC,KAAK,EACLC,SAAS,EACTC,eAAeL,SAAS,aAAa,QAAQM,SAAS,EACtDC,kBAAkB,KAAK,EACvBC,UAAU,KAAK,EACfC,YAAY,KAAK,EACjBC,OAAO,QAAQ,EACfC,QAAQ,KAAK,EACbC,SAAS,KAAK,EACdC,gBAAgB,KAAK,EACrBC,YAAY,EACZC,qBAAqB,EACrBC,IAAI,EACJC,WAAW,EACXC,iBAAiB,EACjBC,SAAS,EACTC,SAAS,EACTC,aAAa,EACbC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,OAAO,EACPC,WAAW,EACXC,YAAY,EACZC,WAAW,EACXC,SAAS,EACTC,UAAU,EACVC,WAAW,EACXC,YAAY,EACZC,aAAa,EACb,GAAGC,WACJ,GAAGtC;IACJ,MAAM,EAAEuC,WAAW,KAAK,EAAEC,OAAO,EAAE,GAAGxC;IAEtC,MAAME,KAAKP,aAAaQ,QAAQC;IAChC,MAAM,EAAEqC,gBAAgB,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAGjD,sBAAsB;QACpEkD,MAAMP,gBAAgB,SAAS3B;QAC/B6B;QACAb;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,gEAAgE;IAChE,gDAAgD;IAChDE,SAAS,CAAC,eAAe,GACvB,AAACA,SAAS,CAAC,eAAe,IAAIrB,gBAAiB,UAAUP;IAE3D,qBACE,KAACd;QACE,GAAGuB,qBAAqB;QACzBD,cAAcA;kBAEd,cAAA,MAACpB;YACE,GAAGQ,UAAU;YACduC,KAAK,CAAClC;YACNJ,OAAOA;YACPK,SAASA;YACTkC,UAAU,CAACjC;YACXG,QAAQA;YACRD,OAAOA;YACPwB,UAAUA;YACV/B,WAAWA;;gBAEVH;8BACD,MAACR;oBACCU,OAAOiB;oBACN,GAAGD,SAAS;oBACbf,WAAWhB,IACTiD,kBACAhB,eACAF,WAAWf;oBAEbO,OAAOA;oBACPyB,SAASA;oBACTD,UAAUA;oBACVzB,MAAMA;oBACNV,MAAMA;oBACNgB,MAAMA;oBACNC,aAAaA;oBACbJ,eAAeA;oBACfK,mBAAmBA;;sCAEnB,KAACyB;4BACE,GAAGT,SAAS;4BACZ,GAAGK,QAAQ;4BACZlC,cAAcA;4BACdP,IAAIA;4BACJD,KAAKA;4BACLG,MAAMA;4BACNI,WAAU;;wBAEXkC;;;;;;AAKX,GACA"}
+{"version":3,"sources":["../../src/form/InputToggle.tsx"],"sourcesContent":["\"use client\";\n\nimport { cnb } from \"cnbuilder\";\nimport {\n  type CSSProperties,\n  type HTMLAttributes,\n  type InputHTMLAttributes,\n  type LabelHTMLAttributes,\n  type ReactNode,\n  forwardRef,\n} from \"react\";\n\nimport { type ComponentWithRippleProps } from \"../interaction/types.js\";\nimport { useElementInteraction } from \"../interaction/useElementInteraction.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { FormMessageContainer } from \"./FormMessageContainer.js\";\nimport { InputToggleIcon } from \"./InputToggleIcon.js\";\nimport { Label } from \"./Label.js\";\nimport { type InputToggleSize } from \"./inputToggleStyles.js\";\nimport {\n  type FormComponentStates,\n  type FormMessageContainerExtension,\n} from \"./types.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface ConfigurableInputToggleIconProps {\n  /**\n   * @see {@link InputToggleSize}\n   * @defaultValue `\"normal\"`\n   */\n  size?: InputToggleSize;\n\n  /**\n   * The icon to use while unchecked. This defaults to the unchecked\n   * checkbox/radio icon from the `ICON_CONFIG`.\n   *\n   * @defaultValue `getIcon(props.type)`\n   */\n  icon?: ReactNode;\n\n  /**\n   * The icon to use while unchecked. This defaults to the unchecked\n   * checkbox/radio icon from the `ICON_CONFIG`.\n   *\n   * @defaultValue `getIcon(``${props.type}Checked``)`\n   */\n  checkedIcon?: ReactNode;\n\n  /**\n   * Any props that should be passed to the `<span>` that surrounds the current\n   * icon element.\n   */\n  iconProps?: PropsWithRef<HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>;\n\n  /**\n   * Optional style to set on the `<span>` that surrounds the current icon\n   * element.\n   */\n  iconStyle?: CSSProperties;\n\n  /**\n   * Optional className to set on the `<span>` that surrounds the current icon\n   * element.\n   */\n  iconClassName?: string;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface InputToggleLabelProps {\n  /**\n   * An optional label to display with the checkbox. If this is omitted, it is\n   * recommended to provide an `aria-label` for accessibility.\n   */\n  label?: ReactNode;\n\n  /**\n   * Any props that should be passed to the `<Label>` component.\n   *\n   * Note: If `style` or `className` are provided in this object, they will be\n   * ignored. Use the top-level `style` and `className` props instead.\n   *\n   * @example\n   * ```\n   *  // bad\n   * labelProps={{\n   *   \"aria-label\": \"checkbox\",\n   *   style: { color: \"red\" },\n   *   className: \"custom\"\n   * }}\n   *\n   * // good\n   * style={{ color: \"red\" }}\n   * className=\"custom\"\n   * labelProps={{\n   *   \"aria-label\": \"checkbox\",\n   * }}\n   * ```\n   */\n  labelProps?: PropsWithRef<\n    LabelHTMLAttributes<HTMLLabelElement>,\n    HTMLLabelElement\n  >;\n\n  /**\n   * @see {@link LabelClassNameOptions.gap}\n   * @defaultValue `false`\n   */\n  disableLabelGap?: boolean;\n\n  /**\n   * Set this to `true` to swap the position of the {@link label} and the current\n   * icon. This prop can be used with the {@link stacked} prop to change the\n   * position if the icon and label:\n   *\n   * ____________________________________\n   * | stacked | iconAfter | position   |\n   * ____________________________________\n   * |         |           | icon label |\n   * ____________________________________\n   * |         | X         | label icon |\n   * ____________________________________\n   * | X       |           | icon       |\n   * |         |           | label      |\n   * ____________________________________\n   * | X       | X         | label      |\n   * |         |           | icon       |\n   * ____________________________________\n   *\n   *\n   * @defaultValue `false`\n   */\n  iconAfter?: boolean;\n\n  /**\n   * Set this to `true` if the label should be stacked instead of inline with\n   * the current icon.\n   *\n   * @see {@link iconAfter}\n   * @defaultValue `false`\n   */\n  stacked?: boolean;\n}\n\n/**\n * @since 6.0.0\n */\nexport interface BaseInputToggleProps\n  extends Omit<InputHTMLAttributes<HTMLInputElement>, \"size\">,\n    FormMessageContainerExtension,\n    FormComponentStates,\n    ConfigurableInputToggleIconProps,\n    InputToggleLabelProps,\n    ComponentWithRippleProps {\n  /**\n   * @see https://stackoverflow.com/questions/5985839/bug-with-firefox-disabled-attribute-of-input-not-resetting-when-refreshing\n   * @defaultValue `type === \"checkbox\" ? \"off\" : undefined`\n   */\n  autoComplete?: string;\n}\n\n/**\n * @since 2.8.5\n * @since 6.0.0 Removed the `aria-controls` prop and added the\n * `indeterminateIcon` prop.\n */\nexport interface IndeterminateCheckboxProps {\n  /**\n   * Set this value to `true` if the checkbox is in an \"indeterminate\" state:\n   *\n   * - this checkbox controls the select all/select none behavior of other\n   *   checkboxes in a group\n   * - at least one of the checkboxes have been checked\n   *   - the `checked` prop for this Checkbox should also be `true`\n   *\n   * You should normally use the `useCheckboxGroup` hook to handle this\n   * behavior.\n   *\n   * @defaultValue `false`\n   */\n  indeterminate?: boolean;\n\n  /**\n   * The icon to display when the checkbox is checked and the\n   * {@link indeterminate} prop is `true`.\n   *\n   * @defaultValue `getIcon(\"checkboxIndeterminate\")`\n   * @since 6.0.0\n   */\n  indeterminateIcon?: ReactNode;\n}\n\nexport interface CheckboxProps\n  extends BaseInputToggleProps,\n    IndeterminateCheckboxProps {}\n\n/** @since 6.0.0 */\nexport interface CheckboxInputToggleProps extends CheckboxProps {\n  type: \"checkbox\";\n}\n\nexport interface RadioProps extends BaseInputToggleProps {\n  /**\n   * The value for the radio button.\n   *\n   * @since 6.0.0 This is now optional and no longer supports\n   * `string[]` since there isn't much of a use case for array values.\n   */\n  value?: string | number;\n}\n\n/** @since 6.0.0 */\nexport interface RadioInputToggleProps extends RadioProps {\n  type: \"radio\";\n}\n\n/**\n * @since 6.0.0 Updated to be a union between\n * `CheckboxInputToggleProps` and `RadioInputToggleProps`\n */\nexport type InputToggleProps = CheckboxInputToggleProps | RadioInputToggleProps;\n\n/**\n * **Client Component**\n *\n * @see {@link https://react-md.dev/components/checkbox | Checkbox Demos}\n * @see {@link https://react-md.dev/components/radio | Radio Demos}\n * @since 6.0.0 Now supports the `FormMessage` behavior and requires\n * different icons for each checked state.\n */\nexport const InputToggle = forwardRef<HTMLInputElement, InputToggleProps>(\n  function InputToggle(props, ref) {\n    const {\n      id: propId,\n      type,\n      label,\n      labelProps,\n      style,\n      className,\n      autoComplete = type === \"checkbox\" ? \"off\" : undefined,\n      disableLabelGap = false,\n      stacked = false,\n      iconAfter = false,\n      size = \"normal\",\n      error = false,\n      active = false,\n      indeterminate = false,\n      messageProps,\n      messageContainerProps,\n      icon,\n      checkedIcon,\n      indeterminateIcon,\n      iconProps,\n      iconStyle,\n      iconClassName,\n      onBlur,\n      onClick,\n      onKeyDown,\n      onKeyUp,\n      onMouseDown,\n      onMouseLeave,\n      onDragStart,\n      onMouseUp,\n      onTouchEnd,\n      onTouchMove,\n      onTouchStart,\n      disableRipple,\n      ...remaining\n    } = props as CheckboxInputToggleProps;\n    const { disabled = false, checked } = props;\n\n    const id = useEnsuredId(propId, type);\n    const { pressedClassName, ripples, handlers } = useElementInteraction({\n      mode: disableRipple ? \"none\" : undefined,\n      disabled,\n      onBlur,\n      onClick,\n      onKeyDown,\n      onKeyUp,\n      onMouseDown,\n      onMouseLeave,\n      onDragStart,\n      onMouseUp,\n      onTouchEnd,\n      onTouchMove,\n      onTouchStart,\n    });\n\n    // set on the `remaining` object to bypass the eslint rule about\n    // aria-checked not being valid for textbox role\n    remaining[\"aria-checked\"] =\n      (remaining[\"aria-checked\"] ?? indeterminate) ? \"mixed\" : undefined;\n\n    return (\n      <FormMessageContainer\n        {...messageContainerProps}\n        messageProps={messageProps}\n      >\n        <Label\n          {...labelProps}\n          gap={!disableLabelGap}\n          style={style}\n          stacked={stacked}\n          reversed={!iconAfter}\n          active={active}\n          error={error}\n          disabled={disabled}\n          className={className}\n        >\n          {label}\n          <InputToggleIcon\n            style={iconStyle}\n            {...iconProps}\n            className={cnb(\n              pressedClassName,\n              iconClassName,\n              iconProps?.className\n            )}\n            error={error}\n            checked={checked}\n            disabled={disabled}\n            size={size}\n            type={type}\n            icon={icon}\n            checkedIcon={checkedIcon}\n            indeterminate={indeterminate}\n            indeterminateIcon={indeterminateIcon}\n          >\n            <input\n              {...remaining}\n              {...handlers}\n              autoComplete={autoComplete}\n              id={id}\n              ref={ref}\n              type={type}\n              className=\"rmd-hidden-input\"\n            />\n            {ripples}\n          </InputToggleIcon>\n        </Label>\n      </FormMessageContainer>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","useElementInteraction","useEnsuredId","FormMessageContainer","InputToggleIcon","Label","InputToggle","props","ref","id","propId","type","label","labelProps","style","className","autoComplete","undefined","disableLabelGap","stacked","iconAfter","size","error","active","indeterminate","messageProps","messageContainerProps","icon","checkedIcon","indeterminateIcon","iconProps","iconStyle","iconClassName","onBlur","onClick","onKeyDown","onKeyUp","onMouseDown","onMouseLeave","onDragStart","onMouseUp","onTouchEnd","onTouchMove","onTouchStart","disableRipple","remaining","disabled","checked","pressedClassName","ripples","handlers","mode","gap","reversed","input"],"mappings":"AAAA;;AAEA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAMEC,UAAU,QACL,QAAQ;AAGf,SAASC,qBAAqB,QAAQ,0CAA0C;AAEhF,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,oBAAoB,QAAQ,4BAA4B;AACjE,SAASC,eAAe,QAAQ,uBAAuB;AACvD,SAASC,KAAK,QAAQ,aAAa;AAgNnC;;;;;;;CAOC,GACD,OAAO,MAAMC,4BAAcN,WACzB,SAASM,YAAYC,KAAK,EAAEC,GAAG;IAC7B,MAAM,EACJC,IAAIC,MAAM,EACVC,IAAI,EACJC,KAAK,EACLC,UAAU,EACVC,KAAK,EACLC,SAAS,EACTC,eAAeL,SAAS,aAAa,QAAQM,SAAS,EACtDC,kBAAkB,KAAK,EACvBC,UAAU,KAAK,EACfC,YAAY,KAAK,EACjBC,OAAO,QAAQ,EACfC,QAAQ,KAAK,EACbC,SAAS,KAAK,EACdC,gBAAgB,KAAK,EACrBC,YAAY,EACZC,qBAAqB,EACrBC,IAAI,EACJC,WAAW,EACXC,iBAAiB,EACjBC,SAAS,EACTC,SAAS,EACTC,aAAa,EACbC,MAAM,EACNC,OAAO,EACPC,SAAS,EACTC,OAAO,EACPC,WAAW,EACXC,YAAY,EACZC,WAAW,EACXC,SAAS,EACTC,UAAU,EACVC,WAAW,EACXC,YAAY,EACZC,aAAa,EACb,GAAGC,WACJ,GAAGtC;IACJ,MAAM,EAAEuC,WAAW,KAAK,EAAEC,OAAO,EAAE,GAAGxC;IAEtC,MAAME,KAAKP,aAAaQ,QAAQC;IAChC,MAAM,EAAEqC,gBAAgB,EAAEC,OAAO,EAAEC,QAAQ,EAAE,GAAGjD,sBAAsB;QACpEkD,MAAMP,gBAAgB,SAAS3B;QAC/B6B;QACAb;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;QACAC;IACF;IAEA,gEAAgE;IAChE,gDAAgD;IAChDE,SAAS,CAAC,eAAe,GACvB,AAACA,SAAS,CAAC,eAAe,IAAIrB,gBAAiB,UAAUP;IAE3D,qBACE,KAACd;QACE,GAAGuB,qBAAqB;QACzBD,cAAcA;kBAEd,cAAA,MAACpB;YACE,GAAGQ,UAAU;YACduC,KAAK,CAAClC;YACNJ,OAAOA;YACPK,SAASA;YACTkC,UAAU,CAACjC;YACXG,QAAQA;YACRD,OAAOA;YACPwB,UAAUA;YACV/B,WAAWA;;gBAEVH;8BACD,MAACR;oBACCU,OAAOiB;oBACN,GAAGD,SAAS;oBACbf,WAAWhB,IACTiD,kBACAhB,eACAF,WAAWf;oBAEbO,OAAOA;oBACPyB,SAASA;oBACTD,UAAUA;oBACVzB,MAAMA;oBACNV,MAAMA;oBACNgB,MAAMA;oBACNC,aAAaA;oBACbJ,eAAeA;oBACfK,mBAAmBA;;sCAEnB,KAACyB;4BACE,GAAGT,SAAS;4BACZ,GAAGK,QAAQ;4BACZlC,cAAcA;4BACdP,IAAIA;4BACJD,KAAKA;4BACLG,MAAMA;4BACNI,WAAU;;wBAEXkC;;;;;;AAKX,GACA"}

package/dist/form/Label.d.ts

@@ -15,9 +15,9 @@ declare module "react" {
  * you need to separate the label from an existing form component or you need to
  * create a custom implementation of a form component.
  *
- * @see {@link https://next.react-md.dev/components/select | Select Demos}
- * @see {@link https://next.react-md.dev/components/text-field | TextField Demos}
- * @see {@link https://next.react-md.dev/components/text-field#simple-textarea | TextArea Demos}
+ * @see {@link https://react-md.dev/components/select | Select Demos}
+ * @see {@link https://react-md.dev/components/text-field | TextField Demos}
+ * @see {@link https://react-md.dev/components/text-field#simple-textarea | TextArea Demos}
  * @since 6.0.0 Updated to be usable externally and combines the
  * floating label styles instead of having separate components.
  */

package/dist/form/Label.js

@@ -7,9 +7,9 @@ import { label } from "./labelStyles.js";
  * you need to separate the label from an existing form component or you need to
  * create a custom implementation of a form component.
  *
- * @see {@link https://next.react-md.dev/components/select | Select Demos}
- * @see {@link https://next.react-md.dev/components/text-field | TextField Demos}
- * @see {@link https://next.react-md.dev/components/text-field#simple-textarea | TextArea Demos}
+ * @see {@link https://react-md.dev/components/select | Select Demos}
+ * @see {@link https://react-md.dev/components/text-field | TextField Demos}
+ * @see {@link https://react-md.dev/components/text-field#simple-textarea | TextArea Demos}
  * @since 6.0.0 Updated to be usable externally and combines the
  * floating label styles instead of having separate components.
  */ export const Label = /*#__PURE__*/ forwardRef(function Label(props, ref) {

package/dist/form/Label.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/Label.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { label } from \"./labelStyles.js\";\nimport { type LabelProps } from \"./types.js\";\n\ndeclare module \"react\" {\n  interface CSSProperties {\n    \"--rmd-label-floating-x\"?: string | number;\n    \"--rmd-label-floating-y\"?: string | number;\n    \"--rmd-label-floating-active-x\"?: string | number;\n    \"--rmd-label-floating-active-y\"?: string | number;\n    \"--rmd-label-active-padding\"?: string | number;\n    \"--rmd-label-active-background-color\"?: string;\n  }\n}\n\n/**\n * Most of the form components already use this `Label` internally when a\n * `label` prop has been provided. You should generally use this component if\n * you need to separate the label from an existing form component or you need to\n * create a custom implementation of a form component.\n *\n * @see {@link https://next.react-md.dev/components/select | Select Demos}\n * @see {@link https://next.react-md.dev/components/text-field | TextField Demos}\n * @see {@link https://next.react-md.dev/components/text-field#simple-textarea | TextArea Demos}\n * @since 6.0.0 Updated to be usable externally and combines the\n * floating label styles instead of having separate components.\n */\nexport const Label = forwardRef<HTMLLabelElement, LabelProps>(\n  function Label(props, ref) {\n    const {\n      gap,\n      error,\n      dense,\n      active,\n      stacked,\n      reversed,\n      disabled,\n      floating,\n      inactive,\n      floatingActive = active,\n      className,\n      children,\n      ...remaining\n    } = props;\n\n    return (\n      <label\n        ref={ref}\n        {...remaining}\n        className={label({\n          gap,\n          error,\n          dense,\n          active,\n          stacked,\n          reversed,\n          disabled,\n          floating,\n          floatingActive,\n          inactive,\n          className,\n        })}\n      >\n        {children}\n      </label>\n    );\n  }\n);\n"],"names":["forwardRef","label","Label","props","ref","gap","error","dense","active","stacked","reversed","disabled","floating","inactive","floatingActive","className","children","remaining"],"mappings":";AAAA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAASC,KAAK,QAAQ,mBAAmB;AAczC;;;;;;;;;;;CAWC,GACD,OAAO,MAAMC,sBAAQF,WACnB,SAASE,MAAMC,KAAK,EAAEC,GAAG;IACvB,MAAM,EACJC,GAAG,EACHC,KAAK,EACLC,KAAK,EACLC,MAAM,EACNC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,iBAAiBN,MAAM,EACvBO,SAAS,EACTC,QAAQ,EACR,GAAGC,WACJ,GAAGd;IAEJ,qBACE,KAACF;QACCG,KAAKA;QACJ,GAAGa,SAAS;QACbF,WAAWd,MAAM;YACfI;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAE;YACAD;YACAE;QACF;kBAECC;;AAGP,GACA"}
+{"version":3,"sources":["../../src/form/Label.tsx"],"sourcesContent":["import { forwardRef } from \"react\";\n\nimport { label } from \"./labelStyles.js\";\nimport { type LabelProps } from \"./types.js\";\n\ndeclare module \"react\" {\n  interface CSSProperties {\n    \"--rmd-label-floating-x\"?: string | number;\n    \"--rmd-label-floating-y\"?: string | number;\n    \"--rmd-label-floating-active-x\"?: string | number;\n    \"--rmd-label-floating-active-y\"?: string | number;\n    \"--rmd-label-active-padding\"?: string | number;\n    \"--rmd-label-active-background-color\"?: string;\n  }\n}\n\n/**\n * Most of the form components already use this `Label` internally when a\n * `label` prop has been provided. You should generally use this component if\n * you need to separate the label from an existing form component or you need to\n * create a custom implementation of a form component.\n *\n * @see {@link https://react-md.dev/components/select | Select Demos}\n * @see {@link https://react-md.dev/components/text-field | TextField Demos}\n * @see {@link https://react-md.dev/components/text-field#simple-textarea | TextArea Demos}\n * @since 6.0.0 Updated to be usable externally and combines the\n * floating label styles instead of having separate components.\n */\nexport const Label = forwardRef<HTMLLabelElement, LabelProps>(\n  function Label(props, ref) {\n    const {\n      gap,\n      error,\n      dense,\n      active,\n      stacked,\n      reversed,\n      disabled,\n      floating,\n      inactive,\n      floatingActive = active,\n      className,\n      children,\n      ...remaining\n    } = props;\n\n    return (\n      <label\n        ref={ref}\n        {...remaining}\n        className={label({\n          gap,\n          error,\n          dense,\n          active,\n          stacked,\n          reversed,\n          disabled,\n          floating,\n          floatingActive,\n          inactive,\n          className,\n        })}\n      >\n        {children}\n      </label>\n    );\n  }\n);\n"],"names":["forwardRef","label","Label","props","ref","gap","error","dense","active","stacked","reversed","disabled","floating","inactive","floatingActive","className","children","remaining"],"mappings":";AAAA,SAASA,UAAU,QAAQ,QAAQ;AAEnC,SAASC,KAAK,QAAQ,mBAAmB;AAczC;;;;;;;;;;;CAWC,GACD,OAAO,MAAMC,sBAAQF,WACnB,SAASE,MAAMC,KAAK,EAAEC,GAAG;IACvB,MAAM,EACJC,GAAG,EACHC,KAAK,EACLC,KAAK,EACLC,MAAM,EACNC,OAAO,EACPC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,QAAQ,EACRC,iBAAiBN,MAAM,EACvBO,SAAS,EACTC,QAAQ,EACR,GAAGC,WACJ,GAAGd;IAEJ,qBACE,KAACF;QACCG,KAAKA;QACJ,GAAGa,SAAS;QACbF,WAAWd,MAAM;YACfI;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAC;YACAE;YACAD;YACAE;QACF;kBAECC;;AAGP,GACA"}

package/dist/form/Legend.d.ts

@@ -11,7 +11,7 @@ export interface LegendProps extends TypographyProps {
 /**
  * This should be used within a `Fieldset` to apply a label.
  *
- * @see {@link https://next.react-md.dev/components/fieldset | Fieldset Demos}
+ * @see {@link https://react-md.dev/components/fieldset | Fieldset Demos}
  * @since 6.0.0
  */
 export declare const Legend: import("react").ForwardRefExoticComponent<LegendProps & import("react").RefAttributes<HTMLLegendElement>>;

package/dist/form/Legend.js

@@ -6,7 +6,7 @@ import { Typography } from "../typography/Typography.js";
 /**
  * This should be used within a `Fieldset` to apply a label.
  *
- * @see {@link https://next.react-md.dev/components/fieldset | Fieldset Demos}
+ * @see {@link https://react-md.dev/components/fieldset | Fieldset Demos}
  * @since 6.0.0
  */ export const Legend = /*#__PURE__*/ forwardRef(function Legend(props, ref) {
     const { srOnly = false, className, children, ...remaining } = props;

package/dist/form/Legend.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/Legend.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\n\nimport { cssUtils } from \"../cssUtils.js\";\nimport { Typography, type TypographyProps } from \"../typography/Typography.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface LegendProps extends TypographyProps {\n  /**\n   * @defaultValue `false`\n   */\n  srOnly?: boolean;\n}\n\n/**\n * This should be used within a `Fieldset` to apply a label.\n *\n * @see {@link https://next.react-md.dev/components/fieldset | Fieldset Demos}\n * @since 6.0.0\n */\nexport const Legend = forwardRef<HTMLLegendElement, LegendProps>(\n  function Legend(props, ref) {\n    const { srOnly = false, className, children, ...remaining } = props;\n\n    return (\n      <Typography\n        {...remaining}\n        as=\"legend\"\n        ref={ref}\n        className={cnb(\"rmd-legend\", cssUtils({ srOnly }), className)}\n      >\n        {children}\n      </Typography>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","cssUtils","Typography","Legend","props","ref","srOnly","className","children","remaining","as"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAQ,QAAQ;AAEnC,SAASC,QAAQ,QAAQ,iBAAiB;AAC1C,SAASC,UAAU,QAA8B,8BAA8B;AAY/E;;;;;CAKC,GACD,OAAO,MAAMC,uBAASH,WACpB,SAASG,OAAOC,KAAK,EAAEC,GAAG;IACxB,MAAM,EAAEC,SAAS,KAAK,EAAEC,SAAS,EAAEC,QAAQ,EAAE,GAAGC,WAAW,GAAGL;IAE9D,qBACE,KAACF;QACE,GAAGO,SAAS;QACbC,IAAG;QACHL,KAAKA;QACLE,WAAWR,IAAI,cAAcE,SAAS;YAAEK;QAAO,IAAIC;kBAElDC;;AAGP,GACA"}
+{"version":3,"sources":["../../src/form/Legend.tsx"],"sourcesContent":["import { cnb } from \"cnbuilder\";\nimport { forwardRef } from \"react\";\n\nimport { cssUtils } from \"../cssUtils.js\";\nimport { Typography, type TypographyProps } from \"../typography/Typography.js\";\n\n/**\n * @since 6.0.0\n */\nexport interface LegendProps extends TypographyProps {\n  /**\n   * @defaultValue `false`\n   */\n  srOnly?: boolean;\n}\n\n/**\n * This should be used within a `Fieldset` to apply a label.\n *\n * @see {@link https://react-md.dev/components/fieldset | Fieldset Demos}\n * @since 6.0.0\n */\nexport const Legend = forwardRef<HTMLLegendElement, LegendProps>(\n  function Legend(props, ref) {\n    const { srOnly = false, className, children, ...remaining } = props;\n\n    return (\n      <Typography\n        {...remaining}\n        as=\"legend\"\n        ref={ref}\n        className={cnb(\"rmd-legend\", cssUtils({ srOnly }), className)}\n      >\n        {children}\n      </Typography>\n    );\n  }\n);\n"],"names":["cnb","forwardRef","cssUtils","Typography","Legend","props","ref","srOnly","className","children","remaining","as"],"mappings":";AAAA,SAASA,GAAG,QAAQ,YAAY;AAChC,SAASC,UAAU,QAAQ,QAAQ;AAEnC,SAASC,QAAQ,QAAQ,iBAAiB;AAC1C,SAASC,UAAU,QAA8B,8BAA8B;AAY/E;;;;;CAKC,GACD,OAAO,MAAMC,uBAASH,WACpB,SAASG,OAAOC,KAAK,EAAEC,GAAG;IACxB,MAAM,EAAEC,SAAS,KAAK,EAAEC,SAAS,EAAEC,QAAQ,EAAE,GAAGC,WAAW,GAAGL;IAE9D,qBACE,KAACF;QACE,GAAGO,SAAS;QACbC,IAAG;QACHL,KAAKA;QACLE,WAAWR,IAAI,cAAcE,SAAS;YAAEK;QAAO,IAAIC;kBAElDC;;AAGP,GACA"}

package/dist/form/NativeSelect.d.ts

@@ -82,6 +82,6 @@ export interface NativeSelectProps extends Omit<SelectHTMLAttributes<HTMLSelectE
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/native-select | NativeSelect Demos}
+ * @see {@link https://react-md.dev/components/native-select | NativeSelect Demos}
  */
 export declare const NativeSelect: import("react").ForwardRefExoticComponent<NativeSelectProps & import("react").RefAttributes<HTMLSelectElement>>;

package/dist/form/NativeSelect.js

@@ -50,7 +50,7 @@ import { nativeSelect, nativeSelectContainer } from "./nativeSelectStyles.js";
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/native-select | NativeSelect Demos}
+ * @see {@link https://react-md.dev/components/native-select | NativeSelect Demos}
  */ export const NativeSelect = /*#__PURE__*/ forwardRef(function NativeSelect(props, ref) {
     const { id: propId, style, className, icon: propIcon, label, labelProps, labelStyle, labelClassName, selectStyle, selectClassName, autoCompleteValue, autoComplete = autoCompleteValue, name = autoCompleteValue, dense, error, active, inline, leftAddon, rightAddon: propRightAddon, leftAddonProps, rightAddonProps, disableLeftAddonStyles, disableRightAddonStyles, theme: propTheme, underlineDirection: propUnderlineDirection, messageProps, messageContainerProps, containerProps, children, ...remaining } = props;
     const { disabled, readOnly, multiple } = props;

package/dist/form/NativeSelect.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/form/NativeSelect.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type HTMLAttributes,\n  type ReactNode,\n  type SelectHTMLAttributes,\n  forwardRef,\n} from \"react\";\n\nimport { getIcon } from \"../icon/config.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { FormMessageContainer } from \"./FormMessageContainer.js\";\nimport { Label } from \"./Label.js\";\nimport { TextFieldContainer } from \"./TextFieldContainer.js\";\nimport { getFormConfig } from \"./formConfig.js\";\nimport { nativeSelect, nativeSelectContainer } from \"./nativeSelectStyles.js\";\nimport {\n  type FormFieldOptions,\n  type UserAgentAutocompleteProps,\n} from \"./types.js\";\n\n/**\n * @since 6.0.0 Added support for {@link UserAgentAutocompleteProps}\n */\nexport interface NativeSelectProps\n  extends Omit<SelectHTMLAttributes<HTMLSelectElement>, \"autoComplete\">,\n    UserAgentAutocompleteProps,\n    FormFieldOptions {\n  /**\n   * A custom dropdown icon to use instead of the browser's default select\n   * dropdown icon.\n   *\n   * Set this to `null` if the browser's default icon should be used instead.\n   *\n   * @defaultValue `getIcon(\"dropdown\")`\n   */\n  icon?: ReactNode;\n\n  /**\n   * This applies custom inline styles to the `<select>` element since the\n   * `style` prop is applied to the container element instead.\n   */\n  selectStyle?: CSSProperties;\n\n  /**\n   * This applies custom className to the `<select>` element since the\n   * `className` prop is applied to the container element instead.\n   */\n  selectClassName?: string;\n\n  /**\n   * This should be a list of `<option>` elements for specific values within the\n   * `<select>`.\n   *\n   * Check out the {@link NativeSelect} for examples around using \"placeholder\"\n   * text and requiring a value to be selected.\n   */\n  children: ReactNode;\n\n  /**\n   * Optional props to provide to the {@link TextFieldContainer} component.\n   * There probably isn't any real use for this prop other than if you need to\n   * add a `ref` for some DOM behavior.\n   */\n  containerProps?: PropsWithRef<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;\n}\n\n/**\n * This component is a wrapper for the native `<select>` field that applies the\n * same theming as `TextField` and `TextArea` components. This component might\n * not be used much since the `Select` offers more styling options.\n *\n * @example Simple Example\n * ```tsx\n * <NativeSelect label=\"Label\">\n *   <option value=\"a\">Value 1</option>\n *   <option value=\"b\">Value 2</option>\n *   <option value=\"c\">Value 3</option>\n *   <option value=\"d\">Value 4</option>\n * </NativeSelect>\n * ```\n *\n * @example Required Value Example\n * ```tsx\n * function Example(): ReactElement {\n *   // using `defaultValue=\"\"` makes it so the first option selected by default\n *   // and considered an \"invalid\" value since it is `disabled`\n *   //\n *   // a `name` must be set with `required` so that the form validation will\n *   // fire if the value is still the empty string when the form is submitted\n *   //\n *   // the first `<option>` is kind of like placeholder text since it doesn't\n *   // have a value and is disabled by default\n *\n *   return (\n *     <NativeSelect\n *       label=\"State\"\n *       name=\"state\"\n *       required\n *       defaultValue=\"\"\n *     >\n *       <option value=\"\" disabled>Choose a state</option>\n *       {states.map(({ name, code }) => (\n *         <option key={code} value={code}>{name}</option>\n *       ))}\n *     </NativeSelect>\n *   );\n * }\n * ```\n *\n * @see {@link https://next.react-md.dev/components/native-select | NativeSelect Demos}\n */\nexport const NativeSelect = forwardRef<HTMLSelectElement, NativeSelectProps>(\n  function NativeSelect(props, ref) {\n    const {\n      id: propId,\n      style,\n      className,\n      icon: propIcon,\n      label,\n      labelProps,\n      labelStyle,\n      labelClassName,\n      selectStyle,\n      selectClassName,\n      autoCompleteValue,\n      autoComplete = autoCompleteValue,\n      name = autoCompleteValue,\n      dense,\n      error,\n      active,\n      inline,\n      leftAddon,\n      rightAddon: propRightAddon,\n      leftAddonProps,\n      rightAddonProps,\n      disableLeftAddonStyles,\n      disableRightAddonStyles,\n      theme: propTheme,\n      underlineDirection: propUnderlineDirection,\n      messageProps,\n      messageContainerProps,\n      containerProps,\n      children,\n      ...remaining\n    } = props;\n    const { disabled, readOnly, multiple } = props;\n    const id = useEnsuredId(propId, \"select\");\n    const theme = getFormConfig(\"theme\", propTheme);\n    const underlineDirection = getFormConfig(\n      \"underlineDirection\",\n      propUnderlineDirection\n    );\n    const icon = getIcon(\"dropdown\", propIcon);\n    const underlined = theme === \"underline\" || theme === \"filled\";\n\n    let rightAddon = propRightAddon;\n    if (typeof propRightAddon === \"undefined\" && !multiple) {\n      rightAddon = icon;\n    }\n\n    return (\n      <FormMessageContainer\n        {...messageContainerProps}\n        messageProps={\n          messageProps && {\n            error,\n            theme,\n            ...messageProps,\n          }\n        }\n      >\n        <TextFieldContainer\n          {...containerProps}\n          style={style}\n          className={nativeSelectContainer({\n            label: !!label,\n            multiple,\n            underlined,\n            className,\n          })}\n          theme={theme}\n          label={!!label}\n          error={error}\n          dense={dense}\n          inline={inline}\n          active={active}\n          readOnly={readOnly}\n          disabled={disabled}\n          leftAddon={leftAddon}\n          leftAddonProps={leftAddonProps}\n          rightAddon={rightAddon}\n          rightAddonProps={rightAddonProps}\n          underlineDirection={underlineDirection}\n          disableLeftAddonStyles={disableLeftAddonStyles}\n          disableRightAddonStyles={disableRightAddonStyles}\n        >\n          <select\n            {...remaining}\n            id={id}\n            ref={ref}\n            autoComplete={autoComplete}\n            name={name}\n            disabled={disabled}\n            style={selectStyle}\n            className={nativeSelect({\n              icon: !!icon,\n              className: selectClassName,\n            })}\n          >\n            {children}\n          </select>\n          {label && (\n            <Label\n              {...labelProps}\n              htmlFor={id}\n              style={labelProps?.style ?? labelStyle}\n              className={labelProps?.className ?? labelClassName}\n              floating\n              dense={dense}\n              error={error}\n              active={active}\n              disabled={disabled}\n            >\n              {label}\n            </Label>\n          )}\n        </TextFieldContainer>\n      </FormMessageContainer>\n    );\n  }\n);\n"],"names":["forwardRef","getIcon","useEnsuredId","FormMessageContainer","Label","TextFieldContainer","getFormConfig","nativeSelect","nativeSelectContainer","NativeSelect","props","ref","id","propId","style","className","icon","propIcon","label","labelProps","labelStyle","labelClassName","selectStyle","selectClassName","autoCompleteValue","autoComplete","name","dense","error","active","inline","leftAddon","rightAddon","propRightAddon","leftAddonProps","rightAddonProps","disableLeftAddonStyles","disableRightAddonStyles","theme","propTheme","underlineDirection","propUnderlineDirection","messageProps","messageContainerProps","containerProps","children","remaining","disabled","readOnly","multiple","underlined","select","htmlFor","floating"],"mappings":";AAAA,SAKEA,UAAU,QACL,QAAQ;AAEf,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,oBAAoB,QAAQ,4BAA4B;AACjE,SAASC,KAAK,QAAQ,aAAa;AACnC,SAASC,kBAAkB,QAAQ,0BAA0B;AAC7D,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,YAAY,EAAEC,qBAAqB,QAAQ,0BAA0B;AAoD9E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4CC,GACD,OAAO,MAAMC,6BAAeT,WAC1B,SAASS,aAAaC,KAAK,EAAEC,GAAG;IAC9B,MAAM,EACJC,IAAIC,MAAM,EACVC,KAAK,EACLC,SAAS,EACTC,MAAMC,QAAQ,EACdC,KAAK,EACLC,UAAU,EACVC,UAAU,EACVC,cAAc,EACdC,WAAW,EACXC,eAAe,EACfC,iBAAiB,EACjBC,eAAeD,iBAAiB,EAChCE,OAAOF,iBAAiB,EACxBG,KAAK,EACLC,KAAK,EACLC,MAAM,EACNC,MAAM,EACNC,SAAS,EACTC,YAAYC,cAAc,EAC1BC,cAAc,EACdC,eAAe,EACfC,sBAAsB,EACtBC,uBAAuB,EACvBC,OAAOC,SAAS,EAChBC,oBAAoBC,sBAAsB,EAC1CC,YAAY,EACZC,qBAAqB,EACrBC,cAAc,EACdC,QAAQ,EACR,GAAGC,WACJ,GAAGpC;IACJ,MAAM,EAAEqC,QAAQ,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,GAAGvC;IACzC,MAAME,KAAKV,aAAaW,QAAQ;IAChC,MAAMyB,QAAQhC,cAAc,SAASiC;IACrC,MAAMC,qBAAqBlC,cACzB,sBACAmC;IAEF,MAAMzB,OAAOf,QAAQ,YAAYgB;IACjC,MAAMiC,aAAaZ,UAAU,eAAeA,UAAU;IAEtD,IAAIN,aAAaC;IACjB,IAAI,OAAOA,mBAAmB,eAAe,CAACgB,UAAU;QACtDjB,aAAahB;IACf;IAEA,qBACE,KAACb;QACE,GAAGwC,qBAAqB;QACzBD,cACEA,gBAAgB;YACdd;YACAU;YACA,GAAGI,YAAY;QACjB;kBAGF,cAAA,MAACrC;YACE,GAAGuC,cAAc;YAClB9B,OAAOA;YACPC,WAAWP,sBAAsB;gBAC/BU,OAAO,CAAC,CAACA;gBACT+B;gBACAC;gBACAnC;YACF;YACAuB,OAAOA;YACPpB,OAAO,CAAC,CAACA;YACTU,OAAOA;YACPD,OAAOA;YACPG,QAAQA;YACRD,QAAQA;YACRmB,UAAUA;YACVD,UAAUA;YACVhB,WAAWA;YACXG,gBAAgBA;YAChBF,YAAYA;YACZG,iBAAiBA;YACjBK,oBAAoBA;YACpBJ,wBAAwBA;YACxBC,yBAAyBA;;8BAEzB,KAACc;oBACE,GAAGL,SAAS;oBACblC,IAAIA;oBACJD,KAAKA;oBACLc,cAAcA;oBACdC,MAAMA;oBACNqB,UAAUA;oBACVjC,OAAOQ;oBACPP,WAAWR,aAAa;wBACtBS,MAAM,CAAC,CAACA;wBACRD,WAAWQ;oBACb;8BAECsB;;gBAEF3B,uBACC,KAACd;oBACE,GAAGe,UAAU;oBACdiC,SAASxC;oBACTE,OAAOK,YAAYL,SAASM;oBAC5BL,WAAWI,YAAYJ,aAAaM;oBACpCgC,QAAQ;oBACR1B,OAAOA;oBACPC,OAAOA;oBACPC,QAAQA;oBACRkB,UAAUA;8BAET7B;;;;;AAMb,GACA"}
+{"version":3,"sources":["../../src/form/NativeSelect.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type HTMLAttributes,\n  type ReactNode,\n  type SelectHTMLAttributes,\n  forwardRef,\n} from \"react\";\n\nimport { getIcon } from \"../icon/config.js\";\nimport { type PropsWithRef } from \"../types.js\";\nimport { useEnsuredId } from \"../useEnsuredId.js\";\nimport { FormMessageContainer } from \"./FormMessageContainer.js\";\nimport { Label } from \"./Label.js\";\nimport { TextFieldContainer } from \"./TextFieldContainer.js\";\nimport { getFormConfig } from \"./formConfig.js\";\nimport { nativeSelect, nativeSelectContainer } from \"./nativeSelectStyles.js\";\nimport {\n  type FormFieldOptions,\n  type UserAgentAutocompleteProps,\n} from \"./types.js\";\n\n/**\n * @since 6.0.0 Added support for {@link UserAgentAutocompleteProps}\n */\nexport interface NativeSelectProps\n  extends Omit<SelectHTMLAttributes<HTMLSelectElement>, \"autoComplete\">,\n    UserAgentAutocompleteProps,\n    FormFieldOptions {\n  /**\n   * A custom dropdown icon to use instead of the browser's default select\n   * dropdown icon.\n   *\n   * Set this to `null` if the browser's default icon should be used instead.\n   *\n   * @defaultValue `getIcon(\"dropdown\")`\n   */\n  icon?: ReactNode;\n\n  /**\n   * This applies custom inline styles to the `<select>` element since the\n   * `style` prop is applied to the container element instead.\n   */\n  selectStyle?: CSSProperties;\n\n  /**\n   * This applies custom className to the `<select>` element since the\n   * `className` prop is applied to the container element instead.\n   */\n  selectClassName?: string;\n\n  /**\n   * This should be a list of `<option>` elements for specific values within the\n   * `<select>`.\n   *\n   * Check out the {@link NativeSelect} for examples around using \"placeholder\"\n   * text and requiring a value to be selected.\n   */\n  children: ReactNode;\n\n  /**\n   * Optional props to provide to the {@link TextFieldContainer} component.\n   * There probably isn't any real use for this prop other than if you need to\n   * add a `ref` for some DOM behavior.\n   */\n  containerProps?: PropsWithRef<HTMLAttributes<HTMLDivElement>, HTMLDivElement>;\n}\n\n/**\n * This component is a wrapper for the native `<select>` field that applies the\n * same theming as `TextField` and `TextArea` components. This component might\n * not be used much since the `Select` offers more styling options.\n *\n * @example Simple Example\n * ```tsx\n * <NativeSelect label=\"Label\">\n *   <option value=\"a\">Value 1</option>\n *   <option value=\"b\">Value 2</option>\n *   <option value=\"c\">Value 3</option>\n *   <option value=\"d\">Value 4</option>\n * </NativeSelect>\n * ```\n *\n * @example Required Value Example\n * ```tsx\n * function Example(): ReactElement {\n *   // using `defaultValue=\"\"` makes it so the first option selected by default\n *   // and considered an \"invalid\" value since it is `disabled`\n *   //\n *   // a `name` must be set with `required` so that the form validation will\n *   // fire if the value is still the empty string when the form is submitted\n *   //\n *   // the first `<option>` is kind of like placeholder text since it doesn't\n *   // have a value and is disabled by default\n *\n *   return (\n *     <NativeSelect\n *       label=\"State\"\n *       name=\"state\"\n *       required\n *       defaultValue=\"\"\n *     >\n *       <option value=\"\" disabled>Choose a state</option>\n *       {states.map(({ name, code }) => (\n *         <option key={code} value={code}>{name}</option>\n *       ))}\n *     </NativeSelect>\n *   );\n * }\n * ```\n *\n * @see {@link https://react-md.dev/components/native-select | NativeSelect Demos}\n */\nexport const NativeSelect = forwardRef<HTMLSelectElement, NativeSelectProps>(\n  function NativeSelect(props, ref) {\n    const {\n      id: propId,\n      style,\n      className,\n      icon: propIcon,\n      label,\n      labelProps,\n      labelStyle,\n      labelClassName,\n      selectStyle,\n      selectClassName,\n      autoCompleteValue,\n      autoComplete = autoCompleteValue,\n      name = autoCompleteValue,\n      dense,\n      error,\n      active,\n      inline,\n      leftAddon,\n      rightAddon: propRightAddon,\n      leftAddonProps,\n      rightAddonProps,\n      disableLeftAddonStyles,\n      disableRightAddonStyles,\n      theme: propTheme,\n      underlineDirection: propUnderlineDirection,\n      messageProps,\n      messageContainerProps,\n      containerProps,\n      children,\n      ...remaining\n    } = props;\n    const { disabled, readOnly, multiple } = props;\n    const id = useEnsuredId(propId, \"select\");\n    const theme = getFormConfig(\"theme\", propTheme);\n    const underlineDirection = getFormConfig(\n      \"underlineDirection\",\n      propUnderlineDirection\n    );\n    const icon = getIcon(\"dropdown\", propIcon);\n    const underlined = theme === \"underline\" || theme === \"filled\";\n\n    let rightAddon = propRightAddon;\n    if (typeof propRightAddon === \"undefined\" && !multiple) {\n      rightAddon = icon;\n    }\n\n    return (\n      <FormMessageContainer\n        {...messageContainerProps}\n        messageProps={\n          messageProps && {\n            error,\n            theme,\n            ...messageProps,\n          }\n        }\n      >\n        <TextFieldContainer\n          {...containerProps}\n          style={style}\n          className={nativeSelectContainer({\n            label: !!label,\n            multiple,\n            underlined,\n            className,\n          })}\n          theme={theme}\n          label={!!label}\n          error={error}\n          dense={dense}\n          inline={inline}\n          active={active}\n          readOnly={readOnly}\n          disabled={disabled}\n          leftAddon={leftAddon}\n          leftAddonProps={leftAddonProps}\n          rightAddon={rightAddon}\n          rightAddonProps={rightAddonProps}\n          underlineDirection={underlineDirection}\n          disableLeftAddonStyles={disableLeftAddonStyles}\n          disableRightAddonStyles={disableRightAddonStyles}\n        >\n          <select\n            {...remaining}\n            id={id}\n            ref={ref}\n            autoComplete={autoComplete}\n            name={name}\n            disabled={disabled}\n            style={selectStyle}\n            className={nativeSelect({\n              icon: !!icon,\n              className: selectClassName,\n            })}\n          >\n            {children}\n          </select>\n          {label && (\n            <Label\n              {...labelProps}\n              htmlFor={id}\n              style={labelProps?.style ?? labelStyle}\n              className={labelProps?.className ?? labelClassName}\n              floating\n              dense={dense}\n              error={error}\n              active={active}\n              disabled={disabled}\n            >\n              {label}\n            </Label>\n          )}\n        </TextFieldContainer>\n      </FormMessageContainer>\n    );\n  }\n);\n"],"names":["forwardRef","getIcon","useEnsuredId","FormMessageContainer","Label","TextFieldContainer","getFormConfig","nativeSelect","nativeSelectContainer","NativeSelect","props","ref","id","propId","style","className","icon","propIcon","label","labelProps","labelStyle","labelClassName","selectStyle","selectClassName","autoCompleteValue","autoComplete","name","dense","error","active","inline","leftAddon","rightAddon","propRightAddon","leftAddonProps","rightAddonProps","disableLeftAddonStyles","disableRightAddonStyles","theme","propTheme","underlineDirection","propUnderlineDirection","messageProps","messageContainerProps","containerProps","children","remaining","disabled","readOnly","multiple","underlined","select","htmlFor","floating"],"mappings":";AAAA,SAKEA,UAAU,QACL,QAAQ;AAEf,SAASC,OAAO,QAAQ,oBAAoB;AAE5C,SAASC,YAAY,QAAQ,qBAAqB;AAClD,SAASC,oBAAoB,QAAQ,4BAA4B;AACjE,SAASC,KAAK,QAAQ,aAAa;AACnC,SAASC,kBAAkB,QAAQ,0BAA0B;AAC7D,SAASC,aAAa,QAAQ,kBAAkB;AAChD,SAASC,YAAY,EAAEC,qBAAqB,QAAQ,0BAA0B;AAoD9E;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4CC,GACD,OAAO,MAAMC,6BAAeT,WAC1B,SAASS,aAAaC,KAAK,EAAEC,GAAG;IAC9B,MAAM,EACJC,IAAIC,MAAM,EACVC,KAAK,EACLC,SAAS,EACTC,MAAMC,QAAQ,EACdC,KAAK,EACLC,UAAU,EACVC,UAAU,EACVC,cAAc,EACdC,WAAW,EACXC,eAAe,EACfC,iBAAiB,EACjBC,eAAeD,iBAAiB,EAChCE,OAAOF,iBAAiB,EACxBG,KAAK,EACLC,KAAK,EACLC,MAAM,EACNC,MAAM,EACNC,SAAS,EACTC,YAAYC,cAAc,EAC1BC,cAAc,EACdC,eAAe,EACfC,sBAAsB,EACtBC,uBAAuB,EACvBC,OAAOC,SAAS,EAChBC,oBAAoBC,sBAAsB,EAC1CC,YAAY,EACZC,qBAAqB,EACrBC,cAAc,EACdC,QAAQ,EACR,GAAGC,WACJ,GAAGpC;IACJ,MAAM,EAAEqC,QAAQ,EAAEC,QAAQ,EAAEC,QAAQ,EAAE,GAAGvC;IACzC,MAAME,KAAKV,aAAaW,QAAQ;IAChC,MAAMyB,QAAQhC,cAAc,SAASiC;IACrC,MAAMC,qBAAqBlC,cACzB,sBACAmC;IAEF,MAAMzB,OAAOf,QAAQ,YAAYgB;IACjC,MAAMiC,aAAaZ,UAAU,eAAeA,UAAU;IAEtD,IAAIN,aAAaC;IACjB,IAAI,OAAOA,mBAAmB,eAAe,CAACgB,UAAU;QACtDjB,aAAahB;IACf;IAEA,qBACE,KAACb;QACE,GAAGwC,qBAAqB;QACzBD,cACEA,gBAAgB;YACdd;YACAU;YACA,GAAGI,YAAY;QACjB;kBAGF,cAAA,MAACrC;YACE,GAAGuC,cAAc;YAClB9B,OAAOA;YACPC,WAAWP,sBAAsB;gBAC/BU,OAAO,CAAC,CAACA;gBACT+B;gBACAC;gBACAnC;YACF;YACAuB,OAAOA;YACPpB,OAAO,CAAC,CAACA;YACTU,OAAOA;YACPD,OAAOA;YACPG,QAAQA;YACRD,QAAQA;YACRmB,UAAUA;YACVD,UAAUA;YACVhB,WAAWA;YACXG,gBAAgBA;YAChBF,YAAYA;YACZG,iBAAiBA;YACjBK,oBAAoBA;YACpBJ,wBAAwBA;YACxBC,yBAAyBA;;8BAEzB,KAACc;oBACE,GAAGL,SAAS;oBACblC,IAAIA;oBACJD,KAAKA;oBACLc,cAAcA;oBACdC,MAAMA;oBACNqB,UAAUA;oBACVjC,OAAOQ;oBACPP,WAAWR,aAAa;wBACtBS,MAAM,CAAC,CAACA;wBACRD,WAAWQ;oBACb;8BAECsB;;gBAEF3B,uBACC,KAACd;oBACE,GAAGe,UAAU;oBACdiC,SAASxC;oBACTE,OAAOK,YAAYL,SAASM;oBAC5BL,WAAWI,YAAYJ,aAAaM;oBACpCgC,QAAQ;oBACR1B,OAAOA;oBACPC,OAAOA;oBACPC,QAAQA;oBACRkB,UAAUA;8BAET7B;;;;;AAMb,GACA"}

package/dist/form/OptGroup.d.ts

@@ -55,7 +55,7 @@ export interface OptGroupProps extends Omit<ListProps, "role"> {
  * }
  * ```
  *
- * @see {@link https://next.react-md.dev/components/select | Select Demos}
+ * @see {@link https://react-md.dev/components/select | Select Demos}
  * @since 6.0.0
  */
 export declare const OptGroup: import("react").ForwardRefExoticComponent<OptGroupProps & import("react").RefAttributes<ListElement>>;