@sixbell-telco/sdk
Version:
A collection of reusable components designed for use in Sixbell Telco Angular projects
1 lines • 5.96 kB
Source Map (JSON)
{"version":3,"file":"sixbell-telco-sdk-components-progress.mjs","sources":["../../../projects/sdk/components/progress/src/progress.component.ts","../../../projects/sdk/components/progress/src/progress.component.html","../../../projects/sdk/components/progress/sixbell-telco-sdk-components-progress.ts"],"sourcesContent":["import { ChangeDetectionStrategy, Component, computed, input } from '@angular/core';\nimport { TypographyDirective } from '@sixbell-telco/sdk/directives/typography';\nimport { cn } from '@sixbell-telco/sdk/utils/cn';\nimport { cva } from 'class-variance-authority';\n\n/**\n * @internal\n * Generates base progress bar classes with style variants\n */\nexport const progressComponent = cva(['progress'], {\n\tvariants: {\n\t\tvariant: {\n\t\t\tprimary: ['progress-primary'],\n\t\t\tsecondary: ['progress-secondary'],\n\t\t\tsuccess: ['progress-success'],\n\t\t\tinfo: ['progress-info'],\n\t\t\terror: ['progress-error'],\n\t\t\twarning: ['progress-warning'],\n\t\t\taccent: ['progress-accent'],\n\t\t},\n\t},\n\tcompoundVariants: [],\n\tdefaultVariants: {\n\t\tvariant: 'primary',\n\t},\n});\n\n/** Possible progress bar color variants */\nexport type ProgressVariantProps = 'primary' | 'secondary' | 'success' | 'info' | 'error' | 'warning' | 'accent' | null | undefined;\n\n/** Possible positions for progress bar label */\nexport type ProgressLabelPositionProps = 'top' | 'bottom' | 'none';\n\n/** Configuration object for progress bar styling */\nexport type ProgressProps = {\n\tvariant?: ProgressVariantProps;\n};\n\n/**\n * A customizable progress indicator component\n *\n * @remarks\n * Built with Tailwind CSS and class-variance-authority for style management.\n * Supports multiple color variants, indeterminate state, and label positioning.\n *\n * @example\n * ```html\n * <st-progress\n * variant=\"primary\"\n * [value]=\"75\"\n * labelPosition=\"top\"\n * ></st-progress>\n * ```\n *\n * @example\n * ```html\n * <st-progress\n * variant=\"success\"\n * [indeterminate]=\"true\"\n * ></st-progress>\n * ```\n */\n@Component({\n\tselector: 'st-progress',\n\ttemplateUrl: './progress.component.html',\n\timports: [TypographyDirective],\n\tchangeDetection: ChangeDetectionStrategy.OnPush,\n})\nexport class ProgressComponent {\n\t/**\n\t * Progress bar color variant\n\t * @defaultValue 'primary'\n\t */\n\tvariant = input<ProgressVariantProps>();\n\n\t/**\n\t * Current progress value (0-100)\n\t * @defaultValue -1 (indeterminate when value < 0)\n\t */\n\tvalue = input<number>(-1);\n\n\t/**\n\t * Maximum progress value\n\t * @defaultValue 100\n\t */\n\tmax = input<number>(100);\n\n\t/**\n\t * Enable indeterminate animation\n\t * @defaultValue false\n\t */\n\tindeterminate = input<boolean>(false);\n\n\t/**\n\t * Position of progress value label\n\t * @defaultValue 'none'\n\t */\n\tlabelPosition = input<ProgressLabelPositionProps>('none');\n\n\t/**\n\t * @internal\n\t * Computed class string for the progress bar container\n\t */\n\tcomponentClass = computed(() =>\n\t\tcn(\n\t\t\tprogressComponent({\n\t\t\t\tvariant: this.variant(),\n\t\t\t}),\n\t\t),\n\t);\n}\n","@let labelPositionVar = labelPosition();\n@let valueVar = value();\n@let indeterminateVar = indeterminate();\n@let maxVar = max();\n@let componentClassVar = componentClass();\n\n<div class=\"flex flex-col items-center gap-1\">\n\t@if (valueVar >= 0 && labelPositionVar === 'top') {\n\t\t<span typography [tyVariant]=\"'body-xs'\">{{ valueVar }} %</span>\n\t}\n\t<progress [class]=\"componentClassVar\" [attr.value]=\"!indeterminateVar ? valueVar : null\" [max]=\"maxVar\"></progress>\n\t@if (valueVar >= 0 && labelPositionVar === 'bottom') {\n\t\t<span typography [tyVariant]=\"'body-xs'\">{{ valueVar }} %</span>\n\t}\n</div>\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}