@spark-ui/components/dist/progress/index.mjs.map

Spark (Leboncoin design system) components.

{"version":3,"sources":["../../src/progress/Progress.tsx","../../src/progress/ProgressBar.styles.ts","../../src/progress/ProgressContext.tsx","../../src/progress/ProgressIndicator.tsx","../../src/progress/ProgressIndicator.styles.ts","../../src/progress/ProgressBar.tsx","../../src/progress/ProgressLabel.tsx","../../src/progress/index.ts"],"sourcesContent":["import { cx } from 'class-variance-authority'\nimport { Progress as RadixProgress } from 'radix-ui'\nimport { PropsWithChildren, Ref, useMemo, useState } from 'react'\n\nimport { ProgressBar } from './ProgressBar'\nimport { ProgressContext } from './ProgressContext'\nimport { ProgressIndicatorStylesProps } from './ProgressIndicator.styles'\n\nexport interface ProgressProps\n  extends RadixProgress.ProgressProps,\n    Pick<ProgressIndicatorStylesProps, 'intent'> {\n  shape?: 'square' | 'rounded'\n  isIndeterminate?: boolean\n  ref?: Ref<HTMLDivElement>\n}\n\nexport const Progress = ({\n  className,\n  value: valueProp,\n  max = 100,\n  shape = 'square',\n  intent = 'basic',\n  isIndeterminate = false,\n  children = <ProgressBar />,\n  ref,\n  ...others\n}: PropsWithChildren<ProgressProps>) => {\n  const [labelId, setLabelId] = useState<string>()\n\n  const value = useMemo(() => {\n    return { value: valueProp ?? 0, max, intent, shape, isIndeterminate, onLabelId: setLabelId }\n  }, [max, valueProp, intent, shape, isIndeterminate, setLabelId])\n\n  return (\n    <ProgressContext.Provider data-spark-component=\"progress\" value={value}>\n      <RadixProgress.Progress\n        data-spark-component=\"progress\"\n        ref={ref}\n        className={cx('gap-sm focus-visible:u-outline flex flex-col', className)}\n        value={valueProp}\n        aria-labelledby={labelId}\n        max={max}\n        tabIndex={-1}\n        {...others}\n      >\n        {children}\n      </RadixProgress.Progress>\n    </ProgressContext.Provider>\n  )\n}\n\nProgress.displayName = 'Progress'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const progressBarStyles = cva(\n  ['relative', 'h-sz-4 w-full', 'transform-gpu overflow-hidden', 'bg-on-background/dim-4'],\n  {\n    variants: {\n      shape: {\n        square: [],\n        rounded: ['rounded-sm'],\n      },\n    },\n  }\n)\n\nexport type ProgressBarStylesProps = VariantProps<typeof progressBarStyles>\n","import { createContext, useContext } from 'react'\n\nimport { ProgressIndicatorStylesProps } from './ProgressIndicator.styles'\n\nexport interface ProgressContextValue {\n  value: number\n  max: number\n  isIndeterminate: boolean\n  shape: 'square' | 'rounded'\n  intent: ProgressIndicatorStylesProps['intent']\n  onLabelId: (id?: string) => void\n}\n\nexport const ProgressContext = createContext<ProgressContextValue | null>(null)\n\nexport const ID_PREFIX = ':progress'\n\nexport const useProgress = () => {\n  const context = useContext(ProgressContext)\n\n  if (!context) {\n    throw new Error('useProgress must be used within a Progress provider')\n  }\n\n  return context\n}\n","import { Progress as RadixProgress } from 'radix-ui'\nimport { ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { useProgress } from './ProgressContext'\nimport { progressIndicatorStyles } from './ProgressIndicator.styles'\n\nexport type ProgressIndicatorProps = ComponentPropsWithRef<'div'>\n\nexport const ProgressIndicator = ({\n  className,\n  style,\n  ref,\n  ...others\n}: PropsWithChildren<ProgressIndicatorProps>) => {\n  const { value, max, intent, shape, isIndeterminate } = useProgress()\n  const x = ((max - value) / max) * 100\n\n  return (\n    <RadixProgress.ProgressIndicator\n      data-spark-component=\"progress-indicator\"\n      className={progressIndicatorStyles({ className, intent, shape, isIndeterminate })}\n      style={{ ...style, ...(!isIndeterminate && { transform: `translateX(-${x}%)` }) }}\n      ref={ref}\n      {...others}\n    />\n  )\n}\n\nProgressIndicator.displayName = 'Progress.Indicator'\n","import { cva, VariantProps } from 'class-variance-authority'\n\nexport const progressIndicatorStyles = cva(['h-full w-full', 'transition-transform duration-400'], {\n  variants: {\n    /**\n     * Color scheme of the progress component.\n     */\n    intent: {\n      basic: ['bg-basic'],\n      main: ['bg-main'],\n      support: ['bg-support'],\n      accent: ['bg-accent'],\n      success: ['bg-success'],\n      alert: ['bg-alert'],\n      danger: ['bg-error'],\n      info: ['bg-info'],\n      neutral: ['bg-neutral'],\n    },\n    /**\n     * Shape of the progress component.\n     */\n    shape: {\n      square: [],\n      rounded: ['rounded-sm'],\n    },\n    /**\n     * Sets if the progress value is not determinated.\n     */\n    isIndeterminate: {\n      true: ['absolute', '-translate-x-1/2', 'animate-standalone-indeterminate-bar'],\n      false: [],\n    },\n  },\n})\n\nexport type ProgressIndicatorStylesProps = VariantProps<typeof progressIndicatorStyles>\n","import { ComponentPropsWithRef, PropsWithChildren } from 'react'\n\nimport { progressBarStyles } from './ProgressBar.styles'\nimport { useProgress } from './ProgressContext'\nimport { ProgressIndicator } from './ProgressIndicator'\n\nexport type ProgressBarProps = ComponentPropsWithRef<'div'>\n\nexport const ProgressBar = ({\n  className,\n  children = <ProgressIndicator />,\n  ref,\n  ...others\n}: PropsWithChildren<ProgressBarProps>) => {\n  const { shape } = useProgress()\n\n  return (\n    <div\n      data-spark-component=\"progress-bar\"\n      className={progressBarStyles({ className, shape })}\n      ref={ref}\n      {...others}\n    >\n      {children}\n    </div>\n  )\n}\n\nProgressBar.displayName = 'Progress.Bar'\n","import { useMergeRefs } from '@spark-ui/hooks/use-merge-refs'\nimport { ComponentPropsWithRef, useCallback, useId } from 'react'\n\nimport { ID_PREFIX, useProgress } from './ProgressContext'\n\nexport type ProgressLabelProps = ComponentPropsWithRef<'span'>\n\nexport const ProgressLabel = ({\n  id: idProp,\n  children,\n  ref: forwardedRef,\n  ...others\n}: ProgressLabelProps) => {\n  const internalID = `${ID_PREFIX}-label-${useId()}`\n  const id = idProp || internalID\n\n  const { onLabelId } = useProgress()\n  const rootRef = useCallback(\n    (el: HTMLSpanElement) => {\n      onLabelId(el ? id : undefined)\n    },\n    [id, onLabelId]\n  )\n  const ref = useMergeRefs(forwardedRef, rootRef)\n\n  return (\n    <span\n      data-spark-component=\"progress-label\"\n      id={id}\n      className=\"text-body-2 text-on-surface\"\n      ref={ref}\n      {...others}\n    >\n      {children}\n    </span>\n  )\n}\n\nProgressLabel.displayName = 'Progress.Label'\n","import { Progress as Root } from './Progress'\nimport { ProgressBar } from './ProgressBar'\nimport { ProgressIndicator } from './ProgressIndicator'\nimport { ProgressLabel } from './ProgressLabel'\n\nexport const Progress: typeof Root & {\n  Label: typeof ProgressLabel\n  Bar: typeof ProgressBar\n  Indicator: typeof ProgressIndicator\n} = Object.assign(Root, {\n  Label: ProgressLabel,\n  Bar: ProgressBar,\n  Indicator: ProgressIndicator,\n})\n\nProgress.displayName = 'Progress'\nProgressBar.displayName = 'Progress.Bar'\nProgressIndicator.displayName = 'Progress.Indicator'\nProgressLabel.displayName = 'Progress.Label'\n\nexport { type ProgressProps } from './Progress'\nexport { type ProgressBarProps } from './ProgressBar'\nexport { type ProgressLabelProps } from './ProgressLabel'\nexport { type ProgressIndicatorProps } from './ProgressIndicator'\n"],"mappings":"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","names":["RadixProgress","cva","jsx","jsx","RadixProgress","jsx","Progress"]}