├── .npmrc ├── .docker ├── .dockerignore ├── bin │ └── entrypoint.sh └── Dockerfile ├── on-server.sh ├── src ├── assets │ └── sass │ │ ├── tokens.scss │ │ ├── legacy-tokens │ │ ├── utils.scss │ │ ├── transitions.scss │ │ ├── fontWeight.scss │ │ ├── reset.scss │ │ ├── shadows.scss │ │ ├── borders.scss │ │ ├── elevation.scss │ │ └── typography.scss │ │ ├── tokens │ │ ├── index.scss │ │ ├── _utils.scss │ │ ├── _transitions.scss │ │ ├── _fontWeight.scss │ │ ├── _reset.scss │ │ ├── _shadows.scss │ │ ├── _borders.scss │ │ ├── _elevation.scss │ │ └── _typography.scss │ │ └── legacy-tokens.scss ├── utils │ ├── constants │ │ ├── sizes.js │ │ ├── keycodes.js │ │ ├── widths.js │ │ ├── validationStates.js │ │ ├── inputTypes.js │ │ └── generateKey.js │ ├── methods │ │ ├── hasSlot.js │ │ ├── variantClassResolver.js │ │ ├── hexToRgb.js │ │ ├── rounder.js │ │ ├── uuidv4.js │ │ ├── hasSameItems.ts │ │ ├── removeAccents.js │ │ └── contrastChecker.js │ ├── validators │ │ ├── input.js │ │ ├── variant.js │ │ ├── state.js │ │ └── time.js │ ├── composables │ │ ├── useHasSlots.js │ │ ├── useHasSlot.js │ │ ├── useIsMobile.js │ │ ├── useDropdownPosition.js │ │ ├── useComponentEmits.js │ │ ├── useClickOutside.js │ │ ├── useInputStatusClasses.js │ │ └── useToast.js │ ├── index.js │ └── directives │ │ └── cdsFloatify.js ├── tests │ ├── __snapshots__ │ │ ├── DialogModal.spec.ts.snap │ │ ├── WebcamModal.spec.ts.snap │ │ ├── ActionBar.spec.ts.snap │ │ ├── SideSheet.spec.ts.snap │ │ ├── LoadingIndicator.spec.ts.snap │ │ ├── Text.spec.js.snap │ │ ├── Skeleton.spec.ts.snap │ │ ├── SkeletonText.spec.ts.snap │ │ ├── LoadingBar.spec.ts.snap │ │ ├── PieChart.spec.ts.snap │ │ ├── LineChart.spec.ts.snap │ │ ├── Spacer.spec.ts.snap │ │ ├── BarChart.spec.ts.snap │ │ ├── DonutChart.spec.ts.snap │ │ ├── Highlight.spec.ts.snap │ │ ├── PolarAreaChart.spec.ts.snap │ │ ├── Timeline.spec.ts.snap │ │ ├── Button.spec.ts.snap │ │ ├── StackedBarChart.spec.ts.snap │ │ ├── Spinner.spec.ts.snap │ │ ├── Scrollable.spec.ts.snap │ │ ├── Badge.spec.ts.snap │ │ ├── ProgressBar.spec.ts.snap │ │ ├── CarouselController.spec.ts.snap │ │ ├── TruncateContainer.spec.js.snap │ │ ├── IconButton.spec.ts.snap │ │ ├── Radio.spec.ts.snap │ │ ├── RadialBarChart.spec.ts.snap │ │ ├── Checkbox.spec.ts.snap │ │ ├── Alert.spec.ts.snap │ │ ├── CollapsibleContainer.spec.ts.snap │ │ ├── AlertCard.spec.ts.snap │ │ ├── Chip.spec.js.snap │ │ ├── ProgressCircular.spec.ts.snap │ │ ├── TopAppBar.spec.ts.snap │ │ ├── ToastContainer.spec.js.snap │ │ ├── Box.spec.ts.snap │ │ ├── MobileStepperInput.spec.js.snap │ │ ├── PasswordInput.spec.ts.snap │ │ ├── FileViewer.spec.ts.snap │ │ ├── FloatingActionButton.spec.ts.snap │ │ ├── TimeInput.spec.ts.snap │ │ ├── MobileNavbar.spec.ts.snap │ │ ├── Textarea.spec.js.snap │ │ ├── BaseMobileInput.spec.js.snap │ │ ├── Breadcrumb.spec.ts.snap │ │ ├── EmptyState.spec.ts.snap │ │ ├── CalloutCard.spec.ts.snap │ │ ├── BaseInput.spec.js.snap │ │ ├── BottomSheet.spec.ts.snap │ │ ├── TextInput.spec.js.snap │ │ ├── NumberInput.spec.js.snap │ │ ├── CheckboxGroup.spec.ts.snap │ │ ├── Toast.spec.js.snap │ │ ├── Tile.spec.ts.snap │ │ ├── List.spec.ts.snap │ │ ├── Card.spec.ts.snap │ │ └── PanelCard.spec.ts.snap │ ├── LoadingBar.spec.ts │ ├── Scrollable.spec.ts │ ├── TimeInput.spec.ts │ ├── Skeleton.spec.ts │ ├── Checkbox.spec.ts │ ├── ProgressCircular.spec.ts │ ├── PasswordInput.spec.ts │ ├── SkeletonText.spec.ts │ ├── TopAppBar.spec.ts │ ├── WebcamModal.spec.ts │ ├── CarouselController.spec.ts │ ├── EmptyState.spec.ts │ ├── BottomSheet.spec.ts │ ├── PanelCard.spec.ts │ ├── Alert.spec.ts │ ├── Highlight.spec.ts │ ├── LoadingIndicator.spec.ts │ ├── Badge.spec.ts │ ├── Button.spec.ts │ ├── Radio.spec.ts │ ├── AlertCard.spec.ts │ ├── ColorPicker.spec.ts │ ├── ActionBar.spec.ts │ ├── DialogModal.spec.ts │ ├── Card.spec.ts │ ├── FileViewer.spec.ts │ ├── IconButton.spec.ts │ ├── SideSheet.spec.ts │ ├── CalloutCard.spec.ts │ ├── Box.spec.ts │ ├── MobileStepperInput.spec.js │ ├── ActionsList.spec.ts │ ├── InnerTabs.spec.ts │ ├── Spacer.spec.ts │ ├── Table.spec.ts │ ├── RadioButtonGroup.spec.ts │ ├── FloatingActionButton.spec.ts │ ├── List.spec.ts │ ├── Spinner.spec.ts │ ├── Toast.spec.js │ ├── MultiFileInput.spec.ts │ ├── Carousel.spec.ts │ ├── Stepper.spec.ts │ ├── Breadcrumb.spec.ts │ ├── MobileNavbar.spec.ts │ ├── CollapsibleContainer.spec.ts │ ├── Timeline.spec.ts │ ├── Chip.spec.js │ ├── MobileNavigation.spec.ts │ ├── SideBar.spec.ts │ ├── HasSameItems.spec.ts │ ├── Wizard.spec.ts │ ├── CheckboxGroup.spec.ts │ └── Tile.spec.ts ├── vite-env.d.ts ├── entities │ └── PaginationItem.js ├── components │ ├── RequiredIndicator.vue │ ├── PageContainer.vue │ ├── Truncate.vue │ ├── Clickable.vue │ ├── SkeletonText.vue │ ├── ToastContainer.vue │ └── Timeline.vue ├── docs-components │ └── CopyToken.vue └── style.css ├── .vscode └── extensions.json ├── docs ├── .vitepress │ ├── env.d.ts │ └── theme │ │ ├── layout.vue │ │ └── Layout.vue ├── tsconfig.json ├── docgen │ ├── FigmaFrame.vue │ └── PreviewContainer.vue ├── utils │ ├── remove-accents.md │ ├── cds-tip.md │ ├── rounder.md │ ├── has-slot.md │ ├── contrast-checker.md │ ├── cds-floatify.md │ └── palete-resolver.md ├── foundation │ ├── shadow.md │ ├── transições.md │ ├── peso-fonte.md │ ├── elevation.md │ ├── bordas.md │ ├── cores.md │ ├── tipografia.md │ └── iconografia.md ├── components │ ├── containers │ │ ├── divider.md │ │ └── box.md │ ├── forms │ │ ├── pin-input.md │ │ ├── search-input.md │ │ ├── chevron.md │ │ ├── file-input.md │ │ ├── label.md │ │ ├── time-input.md │ │ ├── password-input.md │ │ ├── radio.md │ │ ├── text-area.md │ │ ├── flat-button.md │ │ ├── icon-button.md │ │ └── switch.md │ ├── utils │ │ ├── truncate.md │ │ └── clickable.md │ ├── loaders │ │ ├── loading-bar.md │ │ ├── spinner.md │ │ ├── skeleton-text.md │ │ └── overlay-loader.md │ ├── estrutural │ │ └── page-container.md │ ├── navegação │ │ ├── link.md │ │ ├── segmented-control.md │ │ └── pagination.md │ ├── notificação │ │ ├── alert-card.md │ │ └── alert.md │ ├── display │ │ ├── tooltip.md │ │ ├── progress-circular.md │ │ ├── dropdown.md │ │ ├── progress-bar.md │ │ ├── badge.md │ │ ├── avatar.md │ │ ├── timeline-item.md │ │ └── chip.md │ ├── tipografia │ │ └── text.md │ └── charts │ │ └── polar-area-chart.md └── pull_request_template.md ├── docker-compose.yml ├── tsconfig.node.json ├── .github ├── workflows │ ├── label.yml │ ├── prettier.yml │ ├── publish.yml │ ├── deployV2.yml │ ├── publish-next.yml │ ├── test.yml │ ├── build-docs.yml │ └── deploy.yml ├── ISSUE_TEMPLATE │ ├── Bug.md │ └── FEATURE_REQUEST.md └── labeler.yml ├── vitest.config.ts ├── .gitignore ├── types └── vitepress-env.d.ts ├── tsconfig.json ├── public ├── vite.svg └── img │ └── smartphone-rotation.svg ├── eslint.config.js └── vite.config.ts /.npmrc: -------------------------------------------------------------------------------- 1 | legacy-peer-deps=true 2 | -------------------------------------------------------------------------------- /.docker/.dockerignore: -------------------------------------------------------------------------------- 1 | * 2 | !bin/ 3 | !Dockerfile -------------------------------------------------------------------------------- /on-server.sh: -------------------------------------------------------------------------------- 1 | docker-compose exec cuida $* 2 | -------------------------------------------------------------------------------- /src/assets/sass/tokens.scss: -------------------------------------------------------------------------------- 1 | @use './tokens/index' as *; 2 | -------------------------------------------------------------------------------- /src/utils/constants/sizes.js: -------------------------------------------------------------------------------- 1 | export default ["sm", "md", "lg"]; 2 | -------------------------------------------------------------------------------- /.vscode/extensions.json: -------------------------------------------------------------------------------- 1 | { 2 | "recommendations": ["Vue.volar"] 3 | } 4 | -------------------------------------------------------------------------------- /src/utils/constants/keycodes.js: -------------------------------------------------------------------------------- 1 | export default { 2 | ESC: 27, 3 | }; 4 | -------------------------------------------------------------------------------- /src/utils/constants/widths.js: -------------------------------------------------------------------------------- 1 | export default ["thin", "default", "wide"]; 2 | -------------------------------------------------------------------------------- /.docker/bin/entrypoint.sh: -------------------------------------------------------------------------------- 1 | #!/bin/bash 2 | 3 | 4 | npm install 5 | npm run build 6 | npm run docs:dev 7 | -------------------------------------------------------------------------------- /src/utils/constants/validationStates.js: -------------------------------------------------------------------------------- 1 | export default [ 2 | 'valid', 3 | 'invalid', 4 | 'default', 5 | ]; 6 | -------------------------------------------------------------------------------- /docs/.vitepress/env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | /// 3 | -------------------------------------------------------------------------------- /src/utils/constants/inputTypes.js: -------------------------------------------------------------------------------- 1 | export default ['text', 'textarea', 'email', 'password', 'tel', 'number', 'search', 'url']; 2 | -------------------------------------------------------------------------------- /src/utils/methods/hasSlot.js: -------------------------------------------------------------------------------- 1 | export default (slots, slotName) => { 2 | return Object.keys(slots).some((slot) => slot === slotName); 3 | }; 4 | -------------------------------------------------------------------------------- /src/utils/validators/input.js: -------------------------------------------------------------------------------- 1 | import inputTypes from '../constants/inputTypes'; 2 | 3 | export default (value) => inputTypes.includes(value); 4 | -------------------------------------------------------------------------------- /src/utils/validators/variant.js: -------------------------------------------------------------------------------- 1 | import { colorOptions } from '../constants/colors'; 2 | 3 | export default (value) => colorOptions.includes(value); 4 | -------------------------------------------------------------------------------- /src/utils/methods/variantClassResolver.js: -------------------------------------------------------------------------------- 1 | export default function variantClassResolver(baseClass, variant) { 2 | return `${baseClass}--${variant}`; 3 | } 4 | -------------------------------------------------------------------------------- /src/utils/validators/state.js: -------------------------------------------------------------------------------- 1 | import validationStates from '../constants/validationStates'; 2 | 3 | export default (value) => validationStates.includes(value); 4 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/DialogModal.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`DialogModal > renders correctly 1`] = `""`; 4 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/WebcamModal.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`WebcamModal > renders correctly 1`] = `""`; 4 | -------------------------------------------------------------------------------- /src/assets/sass/legacy-tokens/utils.scss: -------------------------------------------------------------------------------- 1 | @mixin label { 2 | font-size: 14px; 3 | font-weight: $font-weight-semibold; 4 | color: $n-700; 5 | display: block; 6 | margin: mb(1); 7 | } 8 | -------------------------------------------------------------------------------- /src/utils/composables/useHasSlots.js: -------------------------------------------------------------------------------- 1 | import { useSlots } from 'vue'; 2 | 3 | export function useHasSlots() { 4 | const slots = useSlots(); 5 | return !!Object.keys(slots).length; 6 | }; 7 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/ActionBar.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`ActionBar snapshot test > renders correctly 1`] = `""`; 4 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/SideSheet.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`Spacer snapshot test > renders correctly 1`] = `""`; 4 | -------------------------------------------------------------------------------- /src/utils/composables/useHasSlot.js: -------------------------------------------------------------------------------- 1 | import { useSlots } from 'vue'; 2 | 3 | export function useHasSlot (slotName) { 4 | const slots = useSlots(); 5 | return Object.keys(slots).some((slot) => slot === slotName); 6 | } 7 | -------------------------------------------------------------------------------- /src/vite-env.d.ts: -------------------------------------------------------------------------------- 1 | /// 2 | 3 | declare module '*.vue' { 4 | import type { DefineComponent } from 'vue' 5 | const component: DefineComponent<{}, {}, any> 6 | export default component 7 | } 8 | -------------------------------------------------------------------------------- /docker-compose.yml: -------------------------------------------------------------------------------- 1 | version: '3.7' 2 | 3 | services: 4 | cuida: 5 | container_name: main 6 | image: sysvaleops/cuida:dev-1.0 7 | volumes: 8 | - .:/usr/src/app 9 | ports: 10 | - 6006:6006 11 | -------------------------------------------------------------------------------- /tsconfig.node.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "composite": true, 4 | "module": "ESNext", 5 | "moduleResolution": "Node", 6 | "allowSyntheticDefaultImports": true 7 | }, 8 | "include": ["vite.config.ts"] 9 | } 10 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/LoadingIndicator.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`LoadingIndicator > renders correctly 1`] = `"
"`; 4 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/Text.spec.js.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`Text Component > renders correctly 1`] = `"Texto de exemplo"`; 4 | -------------------------------------------------------------------------------- /src/entities/PaginationItem.js: -------------------------------------------------------------------------------- 1 | export default class PaginationItem { 2 | constructor(index, value, selected, text = null) { 3 | this.index = index; 4 | this.value = value; 5 | this.selected = selected; 6 | this.text = text || value; 7 | } 8 | } 9 | -------------------------------------------------------------------------------- /src/utils/methods/hexToRgb.js: -------------------------------------------------------------------------------- 1 | export default (hex) => { 2 | var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex); 3 | return result ? [ 4 | parseInt(result[1], 16), 5 | parseInt(result[2], 16), 6 | parseInt(result[3], 16) 7 | ] : null; 8 | } 9 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/Skeleton.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`Skeleton > renders correctly 1`] = `"
"`; 4 | -------------------------------------------------------------------------------- /src/utils/index.js: -------------------------------------------------------------------------------- 1 | export { default as KeyCodes } from "./constants/keycodes"; 2 | export { default as generateKey } from "./constants/generateKey"; 3 | export { default as sizes } from "./constants/sizes"; 4 | export { default as widths } from "./constants/widths"; 5 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/SkeletonText.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`SkeletonText > renders correctly 1`] = `"
"`; 4 | -------------------------------------------------------------------------------- /src/utils/methods/rounder.js: -------------------------------------------------------------------------------- 1 | export default function rounder(elementWidth, limiter = 24) { 2 | let rawRadii = elementWidth / 8; 3 | let radiiMod4 = rawRadii % 4; 4 | let borderRadius = rawRadii > limiter ? limiter : rawRadii - radiiMod4 + 4; 5 | 6 | return `${borderRadius}px`; 7 | } 8 | -------------------------------------------------------------------------------- /.github/workflows/label.yml: -------------------------------------------------------------------------------- 1 | name: "Labeler 🏷️" 2 | on: 3 | - pull_request_target 4 | 5 | jobs: 6 | triage: 7 | name: Assign tag 8 | runs-on: ubuntu-latest 9 | steps: 10 | - uses: actions/labeler@main 11 | with: 12 | repo-token: "${{ secrets.GITHUB_TOKEN }}" 13 | -------------------------------------------------------------------------------- /src/assets/sass/tokens/index.scss: -------------------------------------------------------------------------------- 1 | @forward './borders'; 2 | @forward './colors.module'; 3 | @forward './elevation'; 4 | @forward './fontWeight'; 5 | @forward './reset'; 6 | @forward './shadows'; 7 | @forward './spacing'; 8 | @forward './transitions'; 9 | @forward './typography'; 10 | @forward './utils'; 11 | -------------------------------------------------------------------------------- /src/utils/composables/useIsMobile.js: -------------------------------------------------------------------------------- 1 | import { computed } from 'vue'; 2 | import isDeviceType from '../methods/isDeviceType'; 3 | 4 | export default function() { 5 | const isMobile = computed(() => { 6 | return isDeviceType('smartphone') || isDeviceType('tablet'); 7 | }); 8 | 9 | return { isMobile }; 10 | } 11 | -------------------------------------------------------------------------------- /src/utils/methods/uuidv4.js: -------------------------------------------------------------------------------- 1 | export default function generateKey() { //cria UUIDv4 2 | return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (char) { 3 | const random = Math.random() * 16 | 0; 4 | const value = char === 'x' ? random : (random & 0x3 | 0x8); 5 | return value.toString(16); 6 | }); 7 | } 8 | -------------------------------------------------------------------------------- /src/assets/sass/tokens/_utils.scss: -------------------------------------------------------------------------------- 1 | @use './fontWeight' as fontWeight; 2 | @use './colors.module.scss' as colors; 3 | @use './spacing.scss' as spacing; 4 | 5 | @mixin label { 6 | font-size: 14px; 7 | font-weight: fontWeight.$font-weight-semibold; 8 | color: colors.$n-700; 9 | display: block; 10 | margin: spacing.mb(1); 11 | } 12 | -------------------------------------------------------------------------------- /src/assets/sass/legacy-tokens/transitions.scss: -------------------------------------------------------------------------------- 1 | $interaction: all .2s ease-in-out; 2 | $hover: all .3s ease-in-out; 3 | $opening: all .4s ease-in-out; 4 | 5 | $transition: (); 6 | 7 | $transition: map-merge( 8 | ( 9 | 'interaction': $interaction, 10 | 'hover': $hover, 11 | 'opening': $opening, 12 | ), 13 | $transition 14 | ); 15 | -------------------------------------------------------------------------------- /src/assets/sass/legacy-tokens/fontWeight.scss: -------------------------------------------------------------------------------- 1 | $font-weight-regular: 430; 2 | $font-weight-semibold: 600; 3 | $font-weight-bold: 800; 4 | 5 | $fontWeight: (); 6 | 7 | $fontWeight: map-merge( 8 | ( 9 | 'regular': $font-weight-regular, 10 | 'semibold': $font-weight-semibold, 11 | 'bold': $font-weight-bold, 12 | ), 13 | $fontWeight 14 | ); 15 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/LoadingBar.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`LoadingBar > renders correctly 1`] = ` 4 | "
5 |
6 |
7 |
8 |
" 9 | `; 10 | -------------------------------------------------------------------------------- /docs/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../tsconfig.json", 3 | "include": [ 4 | "../types/**/*.d.ts", 5 | ".vitepress/**/*", 6 | "**/*.md", 7 | "**/*.vue" 8 | ], 9 | "exclude": [ 10 | "../node_modules", 11 | ".vitepress/cache" 12 | ], 13 | "vueCompilerOptions": { 14 | "vitePressExtensions": [".md"] 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/assets/sass/tokens/_transitions.scss: -------------------------------------------------------------------------------- 1 | @use 'sass:map'; 2 | 3 | $interaction: all .2s ease-in-out; 4 | $hover: all .3s ease-in-out; 5 | $opening: all .4s ease-in-out; 6 | 7 | $transition: (); 8 | 9 | $transition: map.merge( 10 | ( 11 | 'interaction': $interaction, 12 | 'hover': $hover, 13 | 'opening': $opening, 14 | ), 15 | $transition 16 | ); 17 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/PieChart.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`PieChart > renders correctly 1`] = `"
"`; 4 | -------------------------------------------------------------------------------- /src/assets/sass/tokens/_fontWeight.scss: -------------------------------------------------------------------------------- 1 | @use 'sass:map'; 2 | 3 | $font-weight-regular: 430; 4 | $font-weight-semibold: 600; 5 | $font-weight-bold: 800; 6 | 7 | $fontWeight: (); 8 | 9 | $fontWeight: map.merge( 10 | ( 11 | 'regular': $font-weight-regular, 12 | 'semibold': $font-weight-semibold, 13 | 'bold': $font-weight-bold, 14 | ), 15 | $fontWeight 16 | ); 17 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/LineChart.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`LineChart > renders correctly 1`] = `"
"`; 4 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/Spacer.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`Spacer snapshot test > renders correctly 1`] = ` 4 | "
5 | 6 |
7 |
" 8 | `; 9 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/BarChart.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`BarChart > renders correctly 1`] = `"
"`; 4 | -------------------------------------------------------------------------------- /src/utils/methods/hasSameItems.ts: -------------------------------------------------------------------------------- 1 | export default function hasSameItems(arr1: string[], arr2: string[]): boolean { 2 | if (arr1.length !== arr2.length) return false; 3 | if (arr1.length === 0 && arr2.length === 0) return true; 4 | 5 | const sorted1 = [...arr1].sort(); 6 | const sorted2 = [...arr2].sort(); 7 | 8 | return sorted1.every((item, index) => item === sorted2[index]); 9 | } -------------------------------------------------------------------------------- /src/tests/__snapshots__/DonutChart.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`DonutChart > renders correctly 1`] = `"
"`; 4 | -------------------------------------------------------------------------------- /.docker/Dockerfile: -------------------------------------------------------------------------------- 1 | FROM node:16.18.1-alpine3.16 2 | 3 | COPY bin/entrypoint.sh /usr/local/bin/entrypoint.sh 4 | 5 | RUN mkdir -p /usr/src/app \ 6 | && apk update \ 7 | && apk add --no-cache bash==5.1.16-r2 \ 8 | && rm -rf /var/cache/apk/* \ 9 | && rm -rf /tmp/* 10 | 11 | WORKDIR /usr/src/app 12 | 13 | EXPOSE 6006 14 | ENTRYPOINT ["/usr/local/bin/entrypoint.sh"] 15 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/Highlight.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`Highlight > renders correctly 1`] = ` 4 | " 5 | Texto 6 | " 7 | `; 8 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/PolarAreaChart.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`PolarAreaChart > renders correctly 1`] = `"
"`; 4 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/Timeline.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`Timeline > renders correctly 1`] = ` 4 | "
5 | 6 |
" 7 | `; 8 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/Button.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`Button > renders correctly 1`] = ` 4 | "" 10 | `; 11 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/StackedBarChart.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`StackedBarChart > renders correctly 1`] = `"
"`; 4 | -------------------------------------------------------------------------------- /src/utils/constants/generateKey.js: -------------------------------------------------------------------------------- 1 | export default function generateKey(length = 8) { 2 | let result = ''; 3 | const characters = 4 | 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'; 5 | const charactersLength = characters.length; 6 | for (let i = 0; i < length; i += 1) { 7 | result += characters.charAt(Math.floor(Math.random() * charactersLength)); 8 | } 9 | return result; 10 | } 11 | -------------------------------------------------------------------------------- /src/assets/sass/tokens/_reset.scss: -------------------------------------------------------------------------------- 1 | * { 2 | box-sizing: border-box; 3 | } 4 | 5 | *:before, 6 | *:after { 7 | box-sizing: border-box; 8 | } 9 | 10 | svg { 11 | box-sizing: content-box; 12 | } 13 | 14 | body { 15 | line-height: 1.25; 16 | } 17 | 18 | ol, ul { 19 | list-style: none; 20 | } 21 | 22 | a { 23 | text-decoration: none; 24 | color: inherit; 25 | } 26 | 27 | svg:focus { 28 | outline: none; 29 | } -------------------------------------------------------------------------------- /src/components/RequiredIndicator.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 13 | 14 | 21 | -------------------------------------------------------------------------------- /src/tests/LoadingBar.spec.ts: -------------------------------------------------------------------------------- 1 | import { describe, test, expect } from 'vitest'; 2 | import LoadingBar from '../components/LoadingBar.vue'; 3 | import { mount } from '@vue/test-utils'; 4 | 5 | describe('LoadingBar', () => { 6 | test('renders correctly', async () => { 7 | const wrapper = mount(LoadingBar, { 8 | props: {}, 9 | }); 10 | 11 | expect(wrapper.html()).toMatchSnapshot(); 12 | }); 13 | }); 14 | -------------------------------------------------------------------------------- /src/tests/__snapshots__/Spinner.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`Spinner > renders correctly 1`] = `"
"`; 4 | 5 | exports[`Spinner > renders correctly with delay 1`] = `""`; 6 | 7 | exports[`Spinner > renders correctly with delay 2`] = `"
"`; 8 | -------------------------------------------------------------------------------- /src/assets/sass/legacy-tokens/reset.scss: -------------------------------------------------------------------------------- 1 | * { 2 | box-sizing: border-box; 3 | } 4 | 5 | *:before, 6 | *:after { 7 | box-sizing: border-box; 8 | } 9 | 10 | svg { 11 | box-sizing: content-box; 12 | } 13 | 14 | body { 15 | line-height: 1.25; 16 | } 17 | 18 | ol, ul { 19 | list-style: none; 20 | } 21 | 22 | a { 23 | text-decoration: none; 24 | color: inherit; 25 | } 26 | 27 | svg:focus { 28 | outline: none; 29 | } -------------------------------------------------------------------------------- /src/tests/__snapshots__/Scrollable.spec.ts.snap: -------------------------------------------------------------------------------- 1 | // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html 2 | 3 | exports[`Scrollable > renders correctly 1`] = ` 4 | "
5 |
6 | 7 |
8 |
" 9 | `; 10 | -------------------------------------------------------------------------------- /docs/docgen/FigmaFrame.vue: -------------------------------------------------------------------------------- 1 |