@asafarim/progress-bars 1.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (27) hide show
  1. package/README.md +287 -0
  2. package/dist/components/CircularProgress/CircularProgress.d.ts +11 -0
  3. package/dist/components/CircularProgress/index.d.ts +2 -0
  4. package/dist/components/LinearProgress/LinearProgress.d.ts +46 -0
  5. package/dist/components/LinearProgress/index.d.ts +1 -0
  6. package/dist/components/ProgressLabel/ProgressLabel.d.ts +9 -0
  7. package/dist/components/ProgressLabel/index.d.ts +2 -0
  8. package/dist/components/ProgressLegend/ProgressLegend.d.ts +11 -0
  9. package/dist/components/ProgressLegend/index.d.ts +2 -0
  10. package/dist/components/ProgressStack/ProgressStack.d.ts +12 -0
  11. package/dist/components/ProgressStack/index.d.ts +2 -0
  12. package/dist/components/ProgressTrack/ProgressTrack.d.ts +14 -0
  13. package/dist/components/ProgressTrack/index.d.ts +2 -0
  14. package/dist/components/SegmentedProgress/SegmentedProgress.d.ts +15 -0
  15. package/dist/components/SegmentedProgress/index.d.ts +2 -0
  16. package/dist/components/Spinner/Spinner.d.ts +8 -0
  17. package/dist/components/Spinner/index.d.ts +2 -0
  18. package/dist/components/StepProgress/StepProgress.d.ts +12 -0
  19. package/dist/components/StepProgress/index.d.ts +2 -0
  20. package/dist/components/VerticalProgress/VerticalProgress.d.ts +9 -0
  21. package/dist/components/VerticalProgress/index.d.ts +2 -0
  22. package/dist/components/index.d.ts +10 -0
  23. package/dist/index.cjs +30 -0
  24. package/dist/index.d.ts +1 -0
  25. package/dist/index.js +1072 -0
  26. package/dist/style.css +1 -0
  27. package/package.json +62 -0
package/dist/style.css ADDED
@@ -0,0 +1 @@
1
+ @import"https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Figtree:ital,wght@0,300..900;1,300..900&family=Jost:ital,wght@0,100..900;1,100..900&family=Karla:ital,wght@0,200..800;1,200..800&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&family=Lexend:wght@100..900&family=Manrope:wght@200..800&family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Open+Sans:ital,wght@0,300..800;1,300..800&family=Outfit:wght@100..900&family=Overpass:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Public+Sans:ital,wght@0,100..900;1,100..900&family=Quicksand:wght@300..700&family=Red+Hat+Display:ital,wght@0,300..900;1,300..900&family=Roboto:ital,wght@0,100..900;1,100..900&family=Rubik:ital,wght@0,300..900;1,300..900&family=Sora:wght@100..800&family=Space+Grotesk:wght@300..700&family=Work+Sans:ital,wght@0,100..900;1,100..900&display=swap";@import"https://fonts.googleapis.com/css2?family=Barriecito&family=Borel&family=DynaPuff:wght@400..700&family=Gabarito:wght@400..900&family=Kranky&family=Macondo&family=Playpen+Sans:wght@100..800&family=Rubik+Spray+Paint&family=Shadows+Into+Light+Two&family=Zalando+Sans:ital,wght@0,200..900;1,200..900&display=swap";:root{--asm-font-family-base: "Inter", "Lato", "Open Sans", "Roboto";--asm-font-family-inter: "Inter", ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";--asm-font-family-primary: "Inter", "Lato", "Open Sans", "Roboto";--asm-font-family-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--asm-font-family-poppins: "Poppins", ui-sans-serif, system-ui, sans-serif;--asm-font-family-open-sans: "Open Sans", ui-sans-serif, system-ui, sans-serif;--asm-font-family-lato: "Lato", ui-sans-serif, system-ui, sans-serif;--asm-font-family-rubik: "Rubik", ui-sans-serif, system-ui, sans-serif;--asm-font-family-nunito: "Nunito", ui-sans-serif, system-ui, sans-serif;--asm-font-family-work-sans: "Work Sans", ui-sans-serif, system-ui, sans-serif;--asm-font-family-manrope: "Manrope", ui-sans-serif, system-ui, sans-serif;--asm-font-family-figtree: "Figtree", ui-sans-serif, system-ui, sans-serif;--asm-font-family-sora: "Sora", ui-sans-serif, system-ui, sans-serif;--asm-font-family-outfit: "Outfit", ui-sans-serif, system-ui, sans-serif;--asm-font-family-lexend: "Lexend", ui-sans-serif, system-ui, sans-serif;--asm-font-family-public-sans: "Public Sans", ui-sans-serif, system-ui, sans-serif;--asm-font-family-dm-sans: "DM Sans", ui-sans-serif, system-ui, sans-serif;--asm-font-family-overpass: "Overpass", ui-sans-serif, system-ui, sans-serif;--asm-font-family-quicksand: "Quicksand", ui-sans-serif, system-ui, sans-serif;--asm-font-family-karla: "Karla", ui-sans-serif, system-ui, sans-serif;--asm-font-family-barlow: "Barlow", ui-sans-serif, system-ui, sans-serif;--asm-font-family-space-grotesk: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;--asm-font-family-red-hat: "Red Hat Display", ui-sans-serif, system-ui, sans-serif;--asm-font-family-jost: "Jost", ui-sans-serif, system-ui, sans-serif;--asm-font-family-barriecito: "Barriecito", cursive, sans-serif;--asm-font-family-borel: "Borel", cursive, sans-serif;--asm-font-family-dynapuff: "DynaPuff", cursive, sans-serif;--asm-font-family-gabarito: "Gabarito", sans-serif;--asm-font-family-kranky: "Kranky", cursive, sans-serif;--asm-font-family-macondo: "Macondo", cursive, sans-serif;--asm-font-family-playpen-sans: "Playpen Sans", cursive, sans-serif;--asm-font-family-rubik-spray: "Rubik Spray Paint", cursive, sans-serif;--asm-font-family-shadows-light: "Shadows Into Light Two", cursive, sans-serif;--asm-font-family-zalando: "Zalando Sans", ui-sans-serif, system-ui, sans-serif;--asm-font-weight-100: 100;--asm-font-weight-200: 200;--asm-font-weight-300: 300;--asm-font-weight-400: 400;--asm-font-weight-500: 500;--asm-font-weight-600: 600;--asm-font-weight-700: 700;--asm-font-weight-800: 800;--asm-font-weight-900: 900;--asm-font-size-xs: .75rem;--asm-font-size-sm: .875rem;--asm-font-size-md: 1rem;--asm-font-size-lg: 1.125rem;--asm-font-size-xl: 1.25rem;--asm-font-size-2xl: 1.5rem;--asm-font-size-3xl: 1.875rem;--asm-font-size-4xl: 2.25rem;--asm-font-size-5xl: 3rem;--asm-font-size-6xl: 3.75rem;--asm-line-height-tight: 1.1;--asm-line-height-normal: 1.4;--asm-line-height-relaxed: 1.6;--asm-line-height-h1: 1.05;--asm-line-height-h2: 1.1;--asm-line-height-h3: 1.15;--asm-line-height-h4: 1.2;--asm-line-height-h5: 1.25;--asm-line-height-h6: 1.25;--asm-letter-spacing-tight: -.01em;--asm-letter-spacing-normal: 0em;--asm-letter-spacing-wide: .02em;--asm-space-0: 0px;--asm-space-1: 4px;--asm-space-2: 8px;--asm-space-3: 12px;--asm-space-4: 16px;--asm-space-5: 20px;--asm-space-6: 24px;--asm-space-8: 32px;--asm-space-10: 40px;--asm-space-12: 48px;--asm-space-16: 64px;--asm-space-page-padding-x: clamp(16px, 3vw, 32px);--asm-space-page-padding-y: clamp(16px, 3vw, 40px);--asm-space-section-gap: clamp(24px, 4vw, 64px);--asm-space-component-gap: 16px;--asm-grid-columns: 12;--asm-grid-gutter: 24px;--asm-container-xs: 480px;--asm-container-sm: 640px;--asm-container-md: 768px;--asm-container-lg: 1024px;--asm-container-xl: 1280px;--asm-container-2xl: 1360px;--asm-radius-sm: 6px;--asm-radius-md: 10px;--asm-radius-lg: 12px;--asm-radius-xl: 16px;--asm-radius-full: 9999px;--asm-border-hairline: 1px;--asm-border-thin: 2px;--asm-border-thick: 3px;--asm-effect-shadow-sm: 0 1px 2px rgba(17, 24, 39, .06);--asm-effect-shadow-md: 0 6px 20px rgba(17, 24, 39, .1);--asm-effect-shadow-lg: 0 16px 40px rgba(17, 24, 39, .14);--asm-effect-shadow-xl: 0 24px 60px rgba(17, 24, 39, .18);--asm-effect-blur-sm: 4px;--asm-effect-blur-md: 8px;--asm-effect-blur-lg: 16px;--asm-motion-duration-fast: .12s;--asm-motion-duration-normal: .2s;--asm-motion-duration-slow: .32s;--asm-motion-easing-standard: cubic-bezier(.2, 0, 0, 1);--asm-motion-easing-emphasized: cubic-bezier(.2, 0, 0, 1.2);--asm-motion-easing-entrance: cubic-bezier(0, 0, 0, 1);--asm-motion-easing-exit: cubic-bezier(.4, 0, 1, 1);--asm-transition-fade: opacity var(--asm-motion-duration-normal) var(--asm-motion-easing-standard);--asm-transition-slide: transform var(--asm-motion-duration-normal) var(--asm-motion-easing-standard);--asm-transition-scale: transform var(--asm-motion-duration-fast) var(--asm-motion-easing-emphasized);--asm-z-base: 0;--asm-z-dropdown: 100;--asm-z-sticky: 200;--asm-z-overlay: 300;--asm-z-modal: 400;--asm-z-popover: 450;--asm-z-tooltip: 500;--asm-z-toast: 600;--asm-icon-size-xs: 12px;--asm-icon-size-sm: 16px;--asm-icon-size-md: 20px;--asm-icon-size-lg: 24px;--asm-icon-size-xl: 28px;--asm-icon-stroke-thin: 1;--asm-icon-stroke-regular: 1.5;--asm-icon-stroke-bold: 2;--asm-density-factor: 1;--asm-space-control-padding-y: 8px;--asm-space-control-padding-x: 12px}:root{--asm-color-bg: #F9FAFB;--asm-color-surface: #FFFFFF;--asm-color-surface-muted: #F3F4F6;--asm-color-panel: #FFFFFF;--asm-color-modal: #FFFFFF;--asm-color-text: #111827;--asm-color-text-muted: #6B7280;--asm-color-border: #D1D5DB;--asm-color-primary-0: #FFFFFF;--asm-color-primary-50: #EEF2FF;--asm-color-primary-100: #E0E7FF;--asm-color-primary-200: #C7D2FE;--asm-color-primary-300: #A5B4FC;--asm-color-primary-400: #818CF8;--asm-color-primary-500: #3A5AFE;--asm-color-primary-600: #304FFE;--asm-color-primary-700: #1E40FF;--asm-color-primary-800: #1E3A8A;--asm-color-primary-900: #1E293B;--asm-color-primary-950: #0F172A;--asm-color-brand-primary-50: #EEF2FF;--asm-color-brand-primary-500: #3A5AFE;--asm-color-brand-primary-600: #304FFE;--asm-color-brand-primary-700: #1E40FF;--asm-color-warning-0: #FFFFFF;--asm-color-warning-50: #FFFBEB;--asm-color-warning-100: #FEF3C7;--asm-color-warning-200: #FDE68A;--asm-color-warning-300: #FCD34D;--asm-color-warning-400: #FBBF24;--asm-color-warning-500: #F59E0B;--asm-color-warning-600: #D97706;--asm-color-warning-700: #B45309;--asm-color-warning-800: #92400E;--asm-color-warning-900: #78350F;--asm-color-warning-950: #451A03;--asm-color-danger-0: #FFFFFF;--asm-color-danger-50: #FEF2F2;--asm-color-danger-100: #FEE2E2;--asm-color-danger-200: #FECACA;--asm-color-danger-300: #FCA5A5;--asm-color-danger-400: #F87171;--asm-color-danger-500: #EF4444;--asm-color-danger-600: #DC2626;--asm-color-danger-700: #B91C1C;--asm-color-danger-800: #991B1B;--asm-color-danger-900: #7F1D1D;--asm-color-danger-950: #450A0A;--asm-color-info-0: #FFFFFF;--asm-color-info-50: #F0F9FF;--asm-color-info-100: #E0F2FE;--asm-color-info-200: #BAE6FD;--asm-color-info-300: #7DD3FC;--asm-color-info-400: #38BDF8;--asm-color-info-500: #0EA5E9;--asm-color-info-600: #0284C7;--asm-color-info-700: #0369A1;--asm-color-info-800: #075985;--asm-color-info-900: #0C4A6E;--asm-color-info-950: #082F49;--asm-color-success-0: #FFFFFF;--asm-color-success-50: #F0FDF4;--asm-color-success-100: #DCFCE7;--asm-color-success-200: #BBF7D0;--asm-color-success-300: #86EFAC;--asm-color-success-400: #4ADE80;--asm-color-success-500: #16A34A;--asm-color-success-600: #16A34A;--asm-color-success-700: #15803D;--asm-color-success-800: #166534;--asm-color-success-900: #14532D;--asm-color-success-950: #052E16;--asm-color-purple-0: #FFFFFF;--asm-color-purple-50: #FAF5FF;--asm-color-purple-100: #F3E8FF;--asm-color-purple-200: #E9D5FF;--asm-color-purple-300: #D8B4FE;--asm-color-purple-400: #C084FC;--asm-color-purple-500: #A855F7;--asm-color-purple-600: #9333EA;--asm-color-purple-700: #7E22CE;--asm-color-purple-800: #6B21A8;--asm-color-purple-900: #581C87;--asm-color-purple-950: #3B0764;--asm-color-neutral-0: #FFFFFF;--asm-color-neutral-50: #F9FAFB;--asm-color-neutral-100: #F3F4F6;--asm-color-neutral-200: #E5E7EB;--asm-color-neutral-300: #D1D5DB;--asm-color-neutral-400: #9CA3AF;--asm-color-neutral-500: #6B7280;--asm-color-neutral-600: #4B5563;--asm-color-neutral-700: #374151;--asm-color-neutral-800: #1F2937;--asm-color-neutral-900: #111827;--asm-color-neutral-950: #030712;--asm-color-secondary-0: #FFFFFF;--asm-color-secondary-50: #F0FDFA;--asm-color-secondary-100: #CCFBF1;--asm-color-secondary-200: #99F6E4;--asm-color-secondary-300: #5EEAD4;--asm-color-secondary-400: #2DD4BF;--asm-color-secondary-500: #14B8A6;--asm-color-secondary-600: #0D9488;--asm-color-secondary-700: #0F766E;--asm-color-secondary-800: #115E59;--asm-color-secondary-900: #134E4A;--asm-color-secondary-950: #042F2E;--asm-color-semantic-success: #16A34A;--asm-color-semantic-warning: #F59E0B;--asm-color-semantic-error: #EF4444;--asm-color-semantic-info: #0EA5E9;--asm-color-button-primary-bg: #304FFE;--asm-color-button-primary-bg-hover: #1E40FF;--asm-color-button-primary-bg-active: #1E40FF;--asm-color-button-primary-text: #FFFFFF;--asm-color-button-secondary-bg: #FFFFFF;--asm-color-button-secondary-text: #111827;--asm-color-button-ghost-bg-hover: rgba(17, 24, 39, .06);--asm-color-button-destructive-bg: #EF4444;--asm-color-button-destructive-text: #FFFFFF;--asm-color-button-disabled-bg: #D1D5DB;--asm-color-button-disabled-text: #374151;--asm-color-input-bg: #FFFFFF;--asm-color-input-text: #111827;--asm-color-input-border: #D1D5DB;--asm-color-input-border-hover: #6B7280;--asm-color-input-border-focus: #304FFE;--asm-color-input-placeholder: #6B7280;--asm-color-input-error-border: #EF4444;--asm-color-input-success-border: #16A34A;--asm-color-focus-ring: #3A5AFE;--asm-color-overlay-scrim: rgba(17, 24, 39, .48)}[data-theme=dark]{--asm-color-bg: #0B1220;--asm-color-surface: #0F172A;--asm-color-surface-muted: #111B2E;--asm-color-panel: #0F172A;--asm-color-modal: #0F172A;--asm-color-text: #E5E7EB;--asm-color-text-muted: #9CA3AF;--asm-color-border: #1F2937;--asm-color-primary-0: #0F172A;--asm-color-primary-50: #1E293B;--asm-color-primary-100: #1E3A8A;--asm-color-primary-200: #1E40FF;--asm-color-primary-300: #304FFE;--asm-color-primary-400: #3A5AFE;--asm-color-primary-500: #4F6BFF;--asm-color-primary-600: #6B82FF;--asm-color-primary-700: #818CF8;--asm-color-primary-800: #A5B4FC;--asm-color-primary-900: #C7D2FE;--asm-color-primary-950: #E0E7FF;--asm-color-brand-primary-50: #EEF2FF;--asm-color-brand-primary-500: #3A5AFE;--asm-color-brand-primary-600: #3A5AFE;--asm-color-brand-primary-700: #304FFE;--asm-color-warning-0: #451A03;--asm-color-warning-50: #78350F;--asm-color-warning-100: #92400E;--asm-color-warning-200: #B45309;--asm-color-warning-300: #D97706;--asm-color-warning-400: #F59E0B;--asm-color-warning-500: #FBBF24;--asm-color-warning-600: #FCD34D;--asm-color-warning-700: #FDE68A;--asm-color-warning-800: #FEF3C7;--asm-color-warning-900: #FFFBEB;--asm-color-warning-950: #FFFEF5;--asm-color-danger-0: #450A0A;--asm-color-danger-50: #7F1D1D;--asm-color-danger-100: #991B1B;--asm-color-danger-200: #B91C1C;--asm-color-danger-300: #DC2626;--asm-color-danger-400: #EF4444;--asm-color-danger-500: #F87171;--asm-color-danger-600: #FCA5A5;--asm-color-danger-700: #FECACA;--asm-color-danger-800: #FEE2E2;--asm-color-danger-900: #FEF2F2;--asm-color-danger-950: #FEF9F9;--asm-color-info-0: #082F49;--asm-color-info-50: #0C4A6E;--asm-color-info-100: #075985;--asm-color-info-200: #0369A1;--asm-color-info-300: #0284C7;--asm-color-info-400: #0EA5E9;--asm-color-info-500: #38BDF8;--asm-color-info-600: #7DD3FC;--asm-color-info-700: #BAE6FD;--asm-color-info-800: #E0F2FE;--asm-color-info-900: #F0F9FF;--asm-color-info-950: #F7FCFF;--asm-color-success-0: #052E16;--asm-color-success-50: #14532D;--asm-color-success-100: #166534;--asm-color-success-200: #15803D;--asm-color-success-300: #16A34A;--asm-color-success-400: #22C55E;--asm-color-success-500: #4ADE80;--asm-color-success-600: #86EFAC;--asm-color-success-700: #BBF7D0;--asm-color-success-800: #DCFCE7;--asm-color-success-900: #F0FDF4;--asm-color-success-950: #F7FEF9;--asm-color-purple-0: #3B0764;--asm-color-purple-50: #581C87;--asm-color-purple-100: #6B21A8;--asm-color-purple-200: #7E22CE;--asm-color-purple-300: #9333EA;--asm-color-purple-400: #A855F7;--asm-color-purple-500: #C084FC;--asm-color-purple-600: #D8B4FE;--asm-color-purple-700: #E9D5FF;--asm-color-purple-800: #F3E8FF;--asm-color-purple-900: #FAF5FF;--asm-color-purple-950: #FDFAFF;--asm-color-neutral-0: #030712;--asm-color-neutral-50: #111827;--asm-color-neutral-100: #1F2937;--asm-color-neutral-200: #374151;--asm-color-neutral-300: #4B5563;--asm-color-neutral-400: #6B7280;--asm-color-neutral-500: #9CA3AF;--asm-color-neutral-600: #D1D5DB;--asm-color-neutral-700: #E5E7EB;--asm-color-neutral-800: #F3F4F6;--asm-color-neutral-900: #F9FAFB;--asm-color-neutral-950: #FCFCFD;--asm-color-secondary-0: #042F2E;--asm-color-secondary-50: #134E4A;--asm-color-secondary-100: #115E59;--asm-color-secondary-200: #0F766E;--asm-color-secondary-300: #0D9488;--asm-color-secondary-400: #14B8A6;--asm-color-secondary-500: #2DD4BF;--asm-color-secondary-600: #5EEAD4;--asm-color-secondary-700: #99F6E4;--asm-color-secondary-800: #CCFBF1;--asm-color-secondary-900: #F0FDFA;--asm-color-secondary-950: #F7FEFD;--asm-color-semantic-success: #22C55E;--asm-color-semantic-warning: #FBBF24;--asm-color-semantic-error: #F87171;--asm-color-semantic-info: #38BDF8;--asm-color-button-primary-bg: #3A5AFE;--asm-color-button-primary-bg-hover: #304FFE;--asm-color-button-primary-bg-active: #304FFE;--asm-color-button-primary-text: #FFFFFF;--asm-color-button-secondary-bg: #111B2E;--asm-color-button-secondary-text: #E5E7EB;--asm-color-button-ghost-bg-hover: rgba(229, 231, 235, .08);--asm-color-button-destructive-bg: #F87171;--asm-color-button-destructive-text: #0B1220;--asm-color-button-disabled-bg: #1F2937;--asm-color-button-disabled-text: #9CA3AF;--asm-color-input-bg: #0B1220;--asm-color-input-text: #E5E7EB;--asm-color-input-border: #1F2937;--asm-color-input-border-hover: #374151;--asm-color-input-border-focus: #3A5AFE;--asm-color-input-placeholder: #9CA3AF;--asm-color-input-error-border: #F87171;--asm-color-input-success-border: #22C55E;--asm-color-focus-ring: #3A5AFE;--asm-color-overlay-scrim: rgba(17, 24, 39, .64)}[data-contrast=high]{--asm-color-bg: #000000;--asm-color-surface: #000000;--asm-color-surface-muted: #000000;--asm-color-panel: #000000;--asm-color-modal: #000000;--asm-color-text: #FFFFFF;--asm-color-text-muted: #FFFFFF;--asm-color-border: #FFFFFF;--asm-color-primary-0: #000000;--asm-color-primary-50: #1A1A1A;--asm-color-primary-100: #333333;--asm-color-primary-200: #4D4D4D;--asm-color-primary-300: #666666;--asm-color-primary-400: #808080;--asm-color-primary-500: #FFFFFF;--asm-color-primary-600: #FFFFFF;--asm-color-primary-700: #FFFFFF;--asm-color-primary-800: #FFFFFF;--asm-color-primary-900: #FFFFFF;--asm-color-primary-950: #FFFFFF;--asm-color-brand-primary-50: #FFFFFF;--asm-color-brand-primary-500: #FFFFFF;--asm-color-brand-primary-600: #FFFFFF;--asm-color-brand-primary-700: #FFFFFF;--asm-color-warning-0: #000000;--asm-color-warning-50: #1A1A00;--asm-color-warning-100: #333300;--asm-color-warning-200: #666600;--asm-color-warning-300: #999900;--asm-color-warning-400: #CCCC00;--asm-color-warning-500: #FFFF00;--asm-color-warning-600: #FFFF33;--asm-color-warning-700: #FFFF66;--asm-color-warning-800: #FFFF99;--asm-color-warning-900: #FFFFCC;--asm-color-warning-950: #FFFFEE;--asm-color-danger-0: #000000;--asm-color-danger-50: #1A0000;--asm-color-danger-100: #330000;--asm-color-danger-200: #660000;--asm-color-danger-300: #990000;--asm-color-danger-400: #CC0000;--asm-color-danger-500: #FF0000;--asm-color-danger-600: #FF3333;--asm-color-danger-700: #FF6666;--asm-color-danger-800: #FF9999;--asm-color-danger-900: #FFCCCC;--asm-color-danger-950: #FFEEEE;--asm-color-info-0: #000000;--asm-color-info-50: #001A1A;--asm-color-info-100: #003333;--asm-color-info-200: #006666;--asm-color-info-300: #009999;--asm-color-info-400: #00CCCC;--asm-color-info-500: #00FFFF;--asm-color-info-600: #33FFFF;--asm-color-info-700: #66FFFF;--asm-color-info-800: #99FFFF;--asm-color-info-900: #CCFFFF;--asm-color-info-950: #EEFFFF;--asm-color-success-0: #000000;--asm-color-success-50: #001A00;--asm-color-success-100: #003300;--asm-color-success-200: #006600;--asm-color-success-300: #009900;--asm-color-success-400: #00CC00;--asm-color-success-500: #00FF00;--asm-color-success-600: #33FF33;--asm-color-success-700: #66FF66;--asm-color-success-800: #99FF99;--asm-color-success-900: #CCFFCC;--asm-color-success-950: #EEFFEE;--asm-color-purple-0: #000000;--asm-color-purple-50: #1A001A;--asm-color-purple-100: #330033;--asm-color-purple-200: #660066;--asm-color-purple-300: #990099;--asm-color-purple-400: #CC00CC;--asm-color-purple-500: #FF00FF;--asm-color-purple-600: #FF33FF;--asm-color-purple-700: #FF66FF;--asm-color-purple-800: #FF99FF;--asm-color-purple-900: #FFCCFF;--asm-color-purple-950: #FFEEFF;--asm-color-neutral-0: #000000;--asm-color-neutral-50: #1A1A1A;--asm-color-neutral-100: #333333;--asm-color-neutral-200: #4D4D4D;--asm-color-neutral-300: #666666;--asm-color-neutral-400: #808080;--asm-color-neutral-500: #999999;--asm-color-neutral-600: #B3B3B3;--asm-color-neutral-700: #CCCCCC;--asm-color-neutral-800: #E6E6E6;--asm-color-neutral-900: #FFFFFF;--asm-color-neutral-950: #FFFFFF;--asm-color-secondary-0: #000000;--asm-color-secondary-50: #001A1A;--asm-color-secondary-100: #003333;--asm-color-secondary-200: #004D4D;--asm-color-secondary-300: #006666;--asm-color-secondary-400: #008080;--asm-color-secondary-500: #00CCCC;--asm-color-secondary-600: #00FFFF;--asm-color-secondary-700: #66FFFF;--asm-color-secondary-800: #99FFFF;--asm-color-secondary-900: #CCFFFF;--asm-color-secondary-950: #EEFFFF;--asm-color-semantic-success: #00FF00;--asm-color-semantic-warning: #FFFF00;--asm-color-semantic-error: #FF0000;--asm-color-semantic-info: #00FFFF;--asm-color-button-primary-bg: #FFFFFF;--asm-color-button-primary-bg-hover: #FFFFFF;--asm-color-button-primary-bg-active: #FFFFFF;--asm-color-button-primary-text: #000000;--asm-color-button-secondary-bg: #000000;--asm-color-button-secondary-text: #FFFFFF;--asm-color-button-ghost-bg-hover: #FFFFFF;--asm-color-button-destructive-bg: #FF0000;--asm-color-button-destructive-text: #000000;--asm-color-button-disabled-bg: #000000;--asm-color-button-disabled-text: #FFFFFF;--asm-color-input-bg: #000000;--asm-color-input-text: #FFFFFF;--asm-color-input-border: #FFFFFF;--asm-color-input-border-hover: #FFFFFF;--asm-color-input-border-focus: #FFFFFF;--asm-color-input-placeholder: #FFFFFF;--asm-color-input-error-border: #FF0000;--asm-color-input-success-border: #00FF00;--asm-color-focus-ring: #FFFFFF;--asm-color-overlay-scrim: rgba(255, 255, 255, .9)}[data-density=compact]{--asm-density-factor: .9;--asm-space-component-gap: 12px;--asm-space-control-padding-y: 6px;--asm-space-control-padding-x: 10px}[data-density=comfortable]{--asm-density-factor: 1.05;--asm-space-component-gap: 18px;--asm-space-control-padding-y: 10px;--asm-space-control-padding-x: 14px}[dir=rtl]{direction:rtl}:root{color-scheme:light dark}@media (prefers-reduced-motion: reduce){:root{--asm-motion-duration-fast: 0ms;--asm-motion-duration-normal: 0ms;--asm-motion-duration-slow: 0ms}}:where([data-theme]){background-color:var(--asm-color-bg);color:var(--asm-color-text)}._root_aq7ts_1{--lp-radius: var(--asm-radius-full);--lp-duration: var(--asm-motion-duration-normal);--lp-ease: var(--asm-motion-easing-standard);--lp-track-bg: var(--asm-color-surface-muted);--lp-track-border: var(--asm-color-border);--lp-fill-bg: var(--asm-color-brand-primary-700);display:inline-flex;width:100%}._brand_aq7ts_14{--lp-fill-bg: var(--asm-color-brand-primary-700)}._success_aq7ts_18{--lp-fill-bg: var(--asm-color-success-700)}._warning_aq7ts_22{--lp-fill-bg: var(--asm-color-warning-700)}._danger_aq7ts_26{--lp-fill-bg: var(--asm-color-danger-700)}._neutral_aq7ts_30{--lp-fill-bg: var(--asm-color-text)}._info_aq7ts_34{--lp-fill-bg: var(--asm-color-info-700)}._track_aq7ts_38{position:relative;width:100%;overflow:hidden;border-radius:var(--lp-radius);background:var(--lp-track-bg);box-shadow:inset 0 0 0 var(--asm-border-hairline) var(--lp-track-border)}._size_sm_aq7ts_49 ._track_aq7ts_38{block-size:var(--asm-space-1)}._size_md_aq7ts_53 ._track_aq7ts_38{block-size:var(--asm-space-2)}._size_lg_aq7ts_57 ._track_aq7ts_38{block-size:var(--asm-space-3)}._bar_aq7ts_61{position:absolute;top:0;bottom:0;left:0;width:0%;border-radius:var(--lp-radius);background:var(--lp-fill-bg);transition:width var(--lp-duration) var(--lp-ease),background-color var(--lp-duration) var(--lp-ease)}._striped_aq7ts_75 ._bar_aq7ts_61{background-image:repeating-linear-gradient(45deg,transparent,transparent 10px,rgba(255,255,255,.15) 10px,rgba(255,255,255,.15) 20px);background-size:40px 40px}._animated_aq7ts_86 ._bar_aq7ts_61{animation:_stripe-move_aq7ts_1 1s linear infinite}@keyframes _stripe-move_aq7ts_1{0%{background-position:0 0}to{background-position:40px 0}}._variant_indeterminate_aq7ts_99 ._bar_aq7ts_61{width:40%;left:-40%;transition:none;animation:_lp-indeterminate_aq7ts_1 var(--asm-motion-duration-slow, .32s) var(--asm-motion-easing-standard) infinite}@keyframes _lp-indeterminate_aq7ts_1{0%{left:-40%}to{left:100%}}@media (prefers-reduced-motion: reduce){._bar_aq7ts_61{transition:none}._animated_aq7ts_86 ._bar_aq7ts_61{animation:none}._variant_indeterminate_aq7ts_99 ._bar_aq7ts_61{animation:none;left:0;width:50%}}._track_ddhgy_1{--pb-track-thickness: var(--asm-space-2);--pb-track-radius: var(--asm-radius-full);--pb-track-bg: var(--asm-color-surface-muted, #f3f4f6);--pb-track-fg: var(--asm-color-brand-primary-700, #1e40ff);position:relative;overflow:hidden}._linear_ddhgy_11{width:100%;height:var(--pb-track-thickness);border-radius:var(--pb-track-radius);background-color:var(--pb-track-bg)}._vertical_ddhgy_18{width:var(--pb-track-thickness);height:100%;border-radius:var(--pb-track-radius);background-color:var(--pb-track-bg)}._circular_ddhgy_25{display:inline-block}._noBg_ddhgy_29{background-color:transparent}._brand_ddhgy_33{--pb-track-fg: var(--asm-color-brand-primary-700, #1e40ff)}._success_ddhgy_37{--pb-track-fg: var(--asm-color-success-700, #15803d)}._warning_ddhgy_41{--pb-track-fg: var(--asm-color-warning-700, #b45309)}._danger_ddhgy_45{--pb-track-fg: var(--asm-color-danger-700, #b91c1c)}._neutral_ddhgy_49{--pb-track-fg: var(--asm-color-text, #111827)}._info_ddhgy_53{--pb-track-fg: var(--asm-color-info-700, #0369a1)}._label_3ne5f_1{display:flex;justify-content:space-between;align-items:center;gap:var(--asm-space-2);font-size:var(--asm-font-size-sm);color:var(--asm-color-text)}._text_3ne5f_10{font-weight:var(--asm-font-weight-500)}._value_3ne5f_14{font-weight:var(--asm-font-weight-600);color:var(--asm-color-text-muted)}._srOnly_3ne5f_19{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0}._spinner_fdu71_1{--spinner-size: var(--asm-icon-size-lg);--spinner-thickness: var(--asm-border-thin);--spinner-color: var(--asm-color-brand-primary-700, #1e40ff);display:inline-flex;align-items:center;justify-content:center;width:var(--spinner-size);height:var(--spinner-size);position:relative}._circle_fdu71_14{width:100%;height:100%;border-radius:50%;border:var(--spinner-thickness) solid var(--asm-color-surface-muted, #f3f4f6);border-top-color:var(--spinner-color);animation:_spin_fdu71_1 var(--asm-motion-duration-slow) linear infinite}@media (prefers-reduced-motion: reduce){._circle_fdu71_14{animation:none;border-top-color:var(--spinner-color);border-right-color:var(--spinner-color)}}@keyframes _spin_fdu71_1{to{transform:rotate(360deg)}}._brand_fdu71_37{--spinner-color: var(--asm-color-brand-primary-700, #1e40ff)}._success_fdu71_41{--spinner-color: var(--asm-color-success-700, #15803d)}._warning_fdu71_45{--spinner-color: var(--asm-color-warning-700, #b45309)}._danger_fdu71_49{--spinner-color: var(--asm-color-danger-700, #b91c1c)}._neutral_fdu71_53{--spinner-color: var(--asm-color-text, #111827)}._info_fdu71_57{--spinner-color: var(--asm-color-info-700, #0369a1)}._container_cz85r_1{position:relative;display:inline-flex;align-items:center;justify-content:center}._circular_cz85r_8{--circular-size: 56px;--circular-thickness: 6px;--circular-circumference: 157px;--circular-offset: 0px;--circular-color: var(--asm-color-brand-primary-700, #1e40ff);transform:rotate(-90deg)}._track_cz85r_18{fill:none;stroke:var(--asm-color-surface-muted, #f3f4f6)}._progress_cz85r_23{fill:none;stroke:var(--circular-color);stroke-linecap:round;stroke-dasharray:var(--circular-circumference);stroke-dashoffset:var(--circular-offset);transition:stroke-dashoffset var(--asm-motion-duration-normal) var(--asm-motion-easing-standard)}._indeterminate_cz85r_32 ._progress_cz85r_23{stroke-dasharray:calc(var(--circular-circumference) * .25) var(--circular-circumference);animation:_circular-rotate_cz85r_1 1.4s linear infinite}@media (prefers-reduced-motion: reduce){._progress_cz85r_23{transition:none}._indeterminate_cz85r_32 ._progress_cz85r_23{animation:none;stroke-dasharray:calc(var(--circular-circumference) * .25) var(--circular-circumference)}}@keyframes _circular-rotate_cz85r_1{0%{stroke-dashoffset:calc(var(--circular-circumference) * .75);transform:rotate(0)}50%{stroke-dashoffset:calc(var(--circular-circumference) * .5);transform:rotate(180deg)}to{stroke-dashoffset:calc(var(--circular-circumference) * .75);transform:rotate(360deg)}}._labelOverlay_cz85r_63{position:absolute;font-size:var(--asm-font-size-sm);font-weight:var(--asm-font-weight-600);color:var(--asm-color-text)}._brand_cz85r_70{--circular-color: var(--asm-color-brand-primary-700, #1e40ff)}._success_cz85r_74{--circular-color: var(--asm-color-success-700, #15803d)}._warning_cz85r_78{--circular-color: var(--asm-color-warning-700, #b45309)}._danger_cz85r_82{--circular-color: var(--asm-color-danger-700, #b91c1c)}._neutral_cz85r_86{--circular-color: var(--asm-color-text, #111827)}._info_cz85r_90{--circular-color: var(--asm-color-info-700, #0369a1)}._vertical_1kj4o_1{--vertical-height: var(--asm-space-16);--vertical-width: var(--asm-space-2);--vertical-progress: 0%;--vertical-color: var(--asm-color-brand-primary-700, #1e40ff);position:relative;width:var(--vertical-width);height:var(--vertical-height);background-color:var(--asm-color-surface-muted, #f3f4f6);border-radius:var(--asm-radius-full);overflow:hidden;display:inline-block}._fill_1kj4o_16{position:absolute;bottom:0;left:0;right:0;height:var(--vertical-progress);background-color:var(--vertical-color);border-radius:var(--asm-radius-full);transition:height var(--asm-motion-duration-normal) var(--asm-motion-easing-standard)}._indeterminate_1kj4o_27 ._fill_1kj4o_16{height:30%;animation:_vertical-indeterminate_1kj4o_1 var(--asm-motion-duration-slow) ease-in-out infinite}@media (prefers-reduced-motion: reduce){._fill_1kj4o_16{transition:none}._indeterminate_1kj4o_27 ._fill_1kj4o_16{animation:none;height:30%}}@keyframes _vertical-indeterminate_1kj4o_1{0%{bottom:0;height:30%}50%{bottom:70%;height:30%}to{bottom:0;height:30%}}._brand_1kj4o_58{--vertical-color: var(--asm-color-brand-primary-700, #1e40ff)}._success_1kj4o_62{--vertical-color: var(--asm-color-success-700, #15803d)}._warning_1kj4o_66{--vertical-color: var(--asm-color-warning-700, #b45309)}._danger_1kj4o_70{--vertical-color: var(--asm-color-danger-700, #b91c1c)}._neutral_1kj4o_74{--vertical-color: var(--asm-color-text, #111827)}._info_1kj4o_78{--vertical-color: var(--asm-color-info-700, #0369a1)}._segmented_31o4i_1{--segmented-height: var(--asm-space-2);--segmented-gap: var(--asm-border-hairline);display:flex;gap:var(--segmented-gap);width:100%;height:var(--segmented-height);background-color:var(--asm-color-surface-muted, #f3f4f6);overflow:hidden}._rounded_31o4i_13{border-radius:var(--asm-radius-full)}._rounded_31o4i_13 ._segment_31o4i_1:first-child{border-start-start-radius:var(--asm-radius-full);border-end-start-radius:var(--asm-radius-full)}._rounded_31o4i_13 ._segment_31o4i_1:last-child{border-start-end-radius:var(--asm-radius-full);border-end-end-radius:var(--asm-radius-full)}._segment_31o4i_1{height:100%;transition:width var(--asm-motion-duration-normal) var(--asm-motion-easing-standard)}@media (prefers-reduced-motion: reduce){._segment_31o4i_1{transition:none}}._brand_31o4i_38{background-color:var(--asm-color-brand-primary-700, #1e40ff)}._success_31o4i_42{background-color:var(--asm-color-success-700, #15803d)}._warning_31o4i_46{background-color:var(--asm-color-warning-700, #b45309)}._danger_31o4i_50{background-color:var(--asm-color-danger-700, #b91c1c)}._neutral_31o4i_54{background-color:var(--asm-color-text, #111827)}._info_31o4i_58{background-color:var(--asm-color-info-700, #0369a1)}._stepProgress_huai5_1{display:flex;align-items:flex-start;width:100%}._step_huai5_1{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;gap:var(--asm-space-2)}._indicator_huai5_16{position:relative;z-index:1}._dots_huai5_21 ._dot_huai5_21{width:var(--asm-icon-size-lg);height:var(--asm-icon-size-lg);border-radius:50%;background-color:var(--asm-color-surface-muted, #f3f4f6);border:var(--asm-border-thin) solid var(--asm-color-border, #d1d5db);transition:all var(--asm-motion-duration-normal) var(--asm-motion-easing-standard)}._bars_huai5_30 ._bar_huai5_30{width:var(--asm-space-10);height:var(--asm-space-2);border-radius:var(--asm-radius-sm);background-color:var(--asm-color-surface-muted, #f3f4f6);transition:all var(--asm-motion-duration-normal) var(--asm-motion-easing-standard)}._completed_huai5_38 ._dot_huai5_21{background-color:var(--step-color, var(--asm-color-brand-primary-700, #1e40ff));border-color:var(--step-color, var(--asm-color-brand-primary-700, #1e40ff))}._completed_huai5_38 ._bar_huai5_30{background-color:var(--step-color, var(--asm-color-brand-primary-700, #1e40ff))}._current_huai5_47 ._dot_huai5_21{background-color:var(--asm-color-surface, #ffffff);border-color:var(--step-color, var(--asm-color-brand-primary-700, #1e40ff));border-width:var(--asm-border-thick);box-shadow:0 0 0 var(--asm-space-1) var(--asm-color-brand-primary-50, #eef2ff)}._current_huai5_47 ._bar_huai5_30{background-color:var(--step-color, var(--asm-color-brand-primary-700, #1e40ff));box-shadow:0 0 0 var(--asm-border-hairline) var(--asm-color-brand-primary-50, #eef2ff)}._label_huai5_59{font-size:var(--asm-font-size-xs);font-weight:var(--asm-font-weight-500);color:var(--asm-color-text-muted);text-align:center;max-width:var(--asm-space-16)}._current_huai5_47 ._label_huai5_59{color:var(--asm-color-text);font-weight:var(--asm-font-weight-600)}._completed_huai5_38 ._label_huai5_59{color:var(--asm-color-text)}._connector_huai5_76{position:absolute;top:var(--asm-icon-size-lg);left:50%;right:-50%;height:var(--asm-border-thin);background-color:var(--asm-color-border, #d1d5db);z-index:0}._completed_huai5_38 ._connector_huai5_76{background-color:var(--step-color, var(--asm-color-brand-primary-700, #1e40ff))}._step_huai5_1:last-child ._connector_huai5_76{display:none}._brand_huai5_94{--step-color: var(--asm-color-brand-primary-700, #1e40ff)}._success_huai5_98{--step-color: var(--asm-color-success-700, #15803d)}._warning_huai5_102{--step-color: var(--asm-color-warning-700, #b45309)}._danger_huai5_106{--step-color: var(--asm-color-danger-700, #b91c1c)}._neutral_huai5_110{--step-color: var(--asm-color-text, #111827)}._info_huai5_114{--step-color: var(--asm-color-info-700, #0369a1)}@media (prefers-reduced-motion: reduce){._dot_huai5_21,._bar_huai5_30{transition:none}}._legend_14gfu_1{display:flex;gap:var(--asm-space-4)}._row_14gfu_6{flex-direction:row;flex-wrap:wrap}._column_14gfu_11{flex-direction:column}._item_14gfu_15{display:flex;align-items:center;gap:var(--asm-space-2)}._swatch_14gfu_21{width:var(--asm-icon-size-sm);height:var(--asm-icon-size-sm);border-radius:var(--asm-radius-sm);flex-shrink:0}._label_14gfu_28{font-size:var(--asm-font-size-sm);color:var(--asm-color-text)}._value_14gfu_33{font-size:var(--asm-font-size-sm);font-weight:var(--asm-font-weight-600);color:var(--asm-color-text-muted);margin-inline-start:auto}._brand_14gfu_40{background-color:var(--asm-color-brand-primary-700, #1e40ff)}._success_14gfu_44{background-color:var(--asm-color-success-700, #15803d)}._warning_14gfu_48{background-color:var(--asm-color-warning-700, #b45309)}._danger_14gfu_52{background-color:var(--asm-color-danger-700, #b91c1c)}._neutral_14gfu_56{background-color:var(--asm-color-text, #111827)}._info_14gfu_60{background-color:var(--asm-color-info-700, #0369a1)}._stack_wk9ii_1{--stack-height: var(--asm-space-3);display:flex;width:100%;height:var(--stack-height);background-color:var(--asm-color-surface-muted, #f3f4f6);border-radius:var(--asm-radius-full);overflow:hidden}._item_wk9ii_12{height:100%;transition:width var(--asm-motion-duration-normal) var(--asm-motion-easing-standard)}._item_wk9ii_12:first-child{border-start-start-radius:var(--asm-radius-full);border-end-start-radius:var(--asm-radius-full)}._item_wk9ii_12:last-child{border-start-end-radius:var(--asm-radius-full);border-end-end-radius:var(--asm-radius-full)}@media (prefers-reduced-motion: reduce){._item_wk9ii_12{transition:none}}._brand_wk9ii_33{background-color:var(--asm-color-brand-primary-700, #1e40ff)}._success_wk9ii_37{background-color:var(--asm-color-success-700, #15803d)}._warning_wk9ii_41{background-color:var(--asm-color-warning-700, #b45309)}._danger_wk9ii_45{background-color:var(--asm-color-danger-700, #b91c1c)}._neutral_wk9ii_49{background-color:var(--asm-color-text, #111827)}._info_wk9ii_53{background-color:var(--asm-color-info-700, #0369a1)}
package/package.json ADDED
@@ -0,0 +1,62 @@
1
+ {
2
+ "name": "@asafarim/progress-bars",
3
+ "version": "1.0.0",
4
+ "private": false,
5
+ "type": "module",
6
+ "sideEffects": [
7
+ "**/*.css"
8
+ ],
9
+ "files": [
10
+ "dist"
11
+ ],
12
+ "main": "./dist/index.cjs",
13
+ "module": "./dist/index.js",
14
+ "types": "./dist/index.d.ts",
15
+ "exports": {
16
+ ".": {
17
+ "types": "./dist/index.d.ts",
18
+ "import": "./dist/index.js",
19
+ "require": "./dist/index.cjs"
20
+ },
21
+ "./dist/style.css": "./dist/style.css"
22
+ },
23
+ "peerDependencies": {
24
+ "react": ">=18",
25
+ "react-dom": ">=18"
26
+ },
27
+ "dependencies": {
28
+ "@asafarim/design-tokens": "^0.5.0"
29
+ },
30
+ "devDependencies": {
31
+ "@types/react": "^18.3.0",
32
+ "@types/react-dom": "^18.3.0",
33
+ "@vitejs/plugin-react": "^4.3.0",
34
+ "react": "^18.3.0",
35
+ "react-dom": "^18.3.0",
36
+ "rimraf": "^6.0.0",
37
+ "typescript": "^5.6.0",
38
+ "vite": "^5.4.0",
39
+ "vite-plugin-dts": "^4.2.0"
40
+ },
41
+ "publishConfig": {
42
+ "access": "public",
43
+ "registry": "https://registry.npmjs.org/"
44
+ },
45
+ "author": "Ali Safari <ali@asafarim.com>",
46
+ "license": "MIT",
47
+ "repository": {
48
+ "type": "git",
49
+ "url": "https://github.com/alisafari-it/progress-bars.git"
50
+ },
51
+ "homepage": "https://alisafari-it.github.io/progress-bars",
52
+ "scripts": {
53
+ "clean": "rimraf dist",
54
+ "typecheck": "tsc -p tsconfig.build.json --noEmit",
55
+ "build": "pnpm run clean && pnpm run typecheck && vite build",
56
+ "demo": "pnpm -C demo dev",
57
+ "predemo": "pnpm install && pnpm run build",
58
+ "deploy-demo": "cd demo && pnpm run deploy",
59
+ "deploy": "pnpm run predemo && cd demo && pnpm run deploy-demo",
60
+ "release": "pnpm run build && node ./scripts/release.js"
61
+ }
62
+ }