@yamada-ui/react/dist/cjs/components/progress/progress.cjs.map

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

{"version":3,"file":"progress.cjs","names":["createSlotComponent","progressStyle","useProgress","styled","mergeCSS"],"sources":["../../../../src/components/progress/progress.tsx"],"sourcesContent":["\"use client\"\n\nimport type { CSSProps, HTMLStyledProps, ThemeProps } from \"../../core\"\nimport type { ProgressStyle } from \"./progress.style\"\nimport type { UseProgressProps } from \"./use-progress\"\nimport { createSlotComponent, mergeCSS, styled } from \"../../core\"\nimport { isNumber } from \"../../utils\"\nimport { progressStyle } from \"./progress.style\"\nimport { useProgress } from \"./use-progress\"\n\nexport interface ProgressProps\n  extends HTMLStyledProps,\n    UseProgressProps,\n    ThemeProps<ProgressStyle> {\n  /**\n   * The animation duration in seconds.\n   */\n  duration?: number | string\n  /**\n   * The color of the progress range.\n   */\n  rangeColor?: CSSProps[\"color\"]\n  /**\n   * The color of the progress track.\n   */\n  trackColor?: CSSProps[\"color\"]\n  /**\n   * Props for the progress range element.\n   */\n  rangeProps?: ProgressRangeProps\n}\n\nconst {\n  PropsContext: ProgressPropsContext,\n  usePropsContext: useProgressPropsContext,\n  withContext,\n  withProvider,\n} = createSlotComponent<ProgressProps, ProgressStyle>(\"progress\", progressStyle)\n\nexport { ProgressPropsContext, useProgressPropsContext }\n\n/**\n * `Progress` is a component for visually indicating progress.\n *\n * @see https://yamada-ui.com/docs/components/progress\n */\nexport const Progress = withProvider(\n  ({ css, max, min, rangeColor, trackColor, value, rangeProps, ...rest }) => {\n    const { percent, getRangeProps, getRootProps } = useProgress({\n      max,\n      min,\n      value,\n    })\n\n    return (\n      <styled.div\n        css={mergeCSS(css, { \"--width\": `${percent}%` })}\n        bg={trackColor}\n        {...getRootProps(rest)}\n      >\n        <ProgressRange bg={rangeColor} {...getRangeProps(rangeProps)} />\n      </styled.div>\n    )\n  },\n  \"root\",\n)(undefined, ({ duration, ...rest }) => ({\n  \"--duration\": isNumber(duration) ? `${duration}s` : duration,\n  ...rest,\n}))\n\ninterface ProgressRangeProps extends HTMLStyledProps {}\n\nconst ProgressRange = withContext<\"div\", ProgressRangeProps>(\"div\", \"range\")()\n"],"mappings":";;;;;;;;;;;;;;AAgCA,MAAM,EACJ,cAAc,sBACd,iBAAiB,yBACjB,aACA,iBACEA,6CAAkD,YAAYC,qCAAc;;;;;;AAShF,MAAa,WAAW,cACrB,EAAE,KAAK,KAAK,KAAK,YAAY,YAAY,OAAO,WAAY,GAAG,WAAW;CACzE,MAAM,EAAE,SAAS,eAAe,iBAAiBC,iCAAY;EAC3D;EACA;EACA;EACD,CAAC;AAEF,QACE,2CAACC,uBAAO;EACN,KAAKC,2BAAS,KAAK,EAAE,WAAW,GAAG,QAAQ,IAAI,CAAC;EAChD,IAAI;EACJ,GAAI,aAAa,KAAK;YAEtB,2CAAC;GAAc,IAAI;GAAY,GAAI,cAAc,WAAW;IAAI;GACrD;GAGjB,OACD,CAAC,SAAY,EAAE,SAAU,GAAG,YAAY;CACvC,8DAAuB,SAAS,GAAG,GAAG,SAAS,KAAK;CACpD,GAAG;CACJ,EAAE;AAIH,MAAM,gBAAgB,YAAuC,OAAO,QAAQ,EAAE"}