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

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

"use client";


const require_rolldown_runtime = require('../../_virtual/rolldown_runtime.cjs');
const require_utils_index = require('../../utils/index.cjs');
const require_factory = require('../../core/system/factory.cjs');
const require_merge_css = require('../../core/css/merge-css.cjs');
const require_create_component = require('../../core/components/create-component.cjs');
const require_progress_style = require('./progress.style.cjs');
const require_use_progress = require('./use-progress.cjs');
let react_jsx_runtime = require("react/jsx-runtime");
react_jsx_runtime = require_rolldown_runtime.__toESM(react_jsx_runtime);

//#region src/components/progress/progress.tsx
const { PropsContext: ProgressPropsContext, usePropsContext: useProgressPropsContext, withContext, withProvider } = require_create_component.createSlotComponent("progress", require_progress_style.progressStyle);
/**
* `Progress` is a component for visually indicating progress.
*
* @see https://yamada-ui.com/docs/components/progress
*/
const Progress = withProvider(({ css, max, min, rangeColor, trackColor, value, rangeProps,...rest }) => {
	const { percent, getRangeProps, getRootProps } = require_use_progress.useProgress({
		max,
		min,
		value
	});
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_factory.styled.div, {
		css: require_merge_css.mergeCSS(css, { "--width": `${percent}%` }),
		bg: trackColor,
		...getRootProps(rest),
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(ProgressRange, {
			bg: rangeColor,
			...getRangeProps(rangeProps)
		})
	});
}, "root")(void 0, ({ duration,...rest }) => ({
	"--duration": (0, require_utils_index.utils_exports.isNumber)(duration) ? `${duration}s` : duration,
	...rest
}));
const ProgressRange = withContext("div", "range")();

//#endregion
exports.Progress = Progress;
exports.ProgressPropsContext = ProgressPropsContext;
exports.useProgressPropsContext = useProgressPropsContext;
//# sourceMappingURL=progress.cjs.map