bromcom-ui-next 0.1.2 → 0.1.4
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.
- package/dist/bromcom-ui/bromcom-ui.css +1 -1
- package/dist/bromcom-ui/bromcom-ui.esm.js +1 -1
- package/dist/bromcom-ui/bromcom-ui.esm.js.map +1 -1
- package/dist/bromcom-ui/global/global.js +14 -15
- package/dist/bromcom-ui/p-04f6d730.entry.js +2 -0
- package/dist/bromcom-ui/p-04f6d730.entry.js.map +1 -0
- package/dist/bromcom-ui/{p-b36f4f44.js → p-12360e4c.js} +1 -1
- package/dist/bromcom-ui/p-15fe392b.js +3 -0
- package/dist/bromcom-ui/p-15fe392b.js.map +1 -0
- package/dist/bromcom-ui/p-1b11150b.entry.js +2 -0
- package/dist/bromcom-ui/p-1b11150b.entry.js.map +1 -0
- package/dist/bromcom-ui/p-1d86c1cf.entry.js +2 -0
- package/dist/bromcom-ui/p-1d86c1cf.entry.js.map +1 -0
- package/dist/bromcom-ui/p-31354aaa.js +2 -0
- package/dist/bromcom-ui/p-31354aaa.js.map +1 -0
- package/dist/bromcom-ui/p-3b607038.entry.js +2 -0
- package/dist/bromcom-ui/p-3b607038.entry.js.map +1 -0
- package/dist/bromcom-ui/p-5d0838e9.entry.js +2 -0
- package/dist/bromcom-ui/p-5d0838e9.entry.js.map +1 -0
- package/dist/bromcom-ui/p-729a870f.js +2 -0
- package/dist/bromcom-ui/p-729a870f.js.map +1 -0
- package/dist/bromcom-ui/p-a590f793.entry.js +2 -0
- package/dist/bromcom-ui/p-a590f793.entry.js.map +1 -0
- package/dist/bromcom-ui/p-cd437280.entry.js +2 -0
- package/dist/bromcom-ui/p-cd437280.entry.js.map +1 -0
- package/dist/bromcom-ui/p-dcea8d62.entry.js +2 -0
- package/dist/bromcom-ui/{p-0a74cf15.entry.js.map → p-dcea8d62.entry.js.map} +1 -1
- package/dist/bromcom-ui/p-ebed10d5.entry.js +2 -0
- package/dist/bromcom-ui/{p-2d836917.entry.js.map → p-ebed10d5.entry.js.map} +1 -1
- package/dist/cjs/app-globals-29edfda4.js +39 -0
- package/dist/cjs/app-globals-29edfda4.js.map +1 -0
- package/dist/cjs/bcm-accordion-group.cjs.entry.js +92 -0
- package/dist/cjs/bcm-accordion-group.cjs.entry.js.map +1 -0
- package/dist/cjs/bcm-accordion.cjs.entry.js +128 -0
- package/dist/cjs/bcm-accordion.cjs.entry.js.map +1 -0
- package/dist/cjs/bcm-alert.cjs.entry.js +2 -2
- package/dist/cjs/bcm-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-avatar_4.cjs.entry.js +577 -0
- package/dist/cjs/bcm-avatar_4.cjs.entry.js.map +1 -0
- package/dist/cjs/bcm-chip.cjs.entry.js +130 -0
- package/dist/cjs/bcm-chip.cjs.entry.js.map +1 -0
- package/dist/cjs/bcm-divider.cjs.entry.js +81 -0
- package/dist/cjs/bcm-divider.cjs.entry.js.map +1 -0
- package/dist/cjs/bcm-input.cjs.entry.js +313 -0
- package/dist/cjs/bcm-input.cjs.entry.js.map +1 -0
- package/dist/cjs/bcm-text.cjs.entry.js +4 -4
- package/dist/cjs/bcm-text.cjs.entry.js.map +1 -1
- package/dist/cjs/bcm-textarea.cjs.entry.js +316 -0
- package/dist/cjs/bcm-textarea.cjs.entry.js.map +1 -0
- package/dist/cjs/bromcom-ui.cjs.js +3 -3
- package/dist/cjs/{index-638f2d15.js → index-4795c073.js} +43 -5
- package/dist/cjs/index-4795c073.js.map +1 -0
- package/dist/{components/p-b36f4f44.js → cjs/index-5a88e57b.js} +5 -3
- package/dist/cjs/{index-a4eea4bb.js.map → index-5a88e57b.js.map} +1 -1
- package/dist/cjs/loader.cjs.js +3 -3
- package/dist/cjs/validation-messages-c36e5c31.js +134 -0
- package/dist/cjs/validation-messages-c36e5c31.js.map +1 -0
- package/dist/collection/collection-manifest.json +6 -1
- package/dist/collection/components/accordion/accordion.component.js +5 -5
- package/dist/collection/components/accordion/accordion.component.js.map +1 -1
- package/dist/collection/components/accordion/accordion.css +1 -1
- package/dist/collection/components/accordion-group/accordion-group.component.js +1 -1
- package/dist/collection/components/accordion-group/accordion-group.component.js.map +1 -1
- package/dist/collection/components/accordion-group/accordion-group.css +1 -1
- package/dist/collection/components/alert/alert.css +1 -1
- package/dist/collection/components/avatar/avatar.component.js.map +1 -1
- package/dist/collection/components/avatar/avatar.css +1 -1
- package/dist/collection/components/badge/badge.component.js +373 -0
- package/dist/collection/components/badge/badge.component.js.map +1 -0
- package/dist/collection/components/badge/badge.css +1 -0
- package/dist/collection/components/basic-badge/basic-badge.component.js +236 -0
- package/dist/collection/components/basic-badge/basic-badge.component.js.map +1 -0
- package/dist/collection/components/basic-badge/basic-badge.css +1 -0
- package/dist/collection/components/button/button.component.js +3 -3
- package/dist/collection/components/button/button.component.js.map +1 -1
- package/dist/collection/components/button/button.css +1 -1
- package/dist/collection/components/chip/chip.component.js +2 -2
- package/dist/collection/components/chip/chip.component.js.map +1 -1
- package/dist/collection/components/chip/chip.css +1 -1
- package/dist/collection/components/divider/divider.component.js +190 -0
- package/dist/collection/components/divider/divider.component.js.map +1 -0
- package/dist/collection/components/divider/divider.css +1 -0
- package/dist/collection/components/input/input.component.js +1050 -0
- package/dist/collection/components/input/input.component.js.map +1 -0
- package/dist/collection/components/input/input.css +2 -0
- package/dist/collection/components/input/types.js +11 -0
- package/dist/collection/components/input/types.js.map +1 -0
- package/dist/collection/components/text/text.component.js +1 -1
- package/dist/collection/components/text/text.css +1 -1
- package/dist/collection/components/textarea/textarea.component.js +1013 -0
- package/dist/collection/components/textarea/textarea.component.js.map +1 -0
- package/dist/collection/components/textarea/textarea.css +2 -0
- package/dist/collection/components/textarea/types.js +2 -0
- package/dist/collection/components/textarea/types.js.map +1 -0
- package/dist/collection/global/global.js +14 -15
- package/dist/collection/utils/i18n.js +29 -0
- package/dist/collection/utils/i18n.js.map +1 -0
- package/dist/collection/utils/id/generate-id.js +16 -0
- package/dist/collection/utils/id/generate-id.js.map +1 -0
- package/dist/collection/utils/slot/check-slot-content.js +15 -0
- package/dist/collection/utils/slot/check-slot-content.js.map +1 -0
- package/dist/collection/utils/validation-messages.js +17 -0
- package/dist/collection/utils/validation-messages.js.map +1 -0
- package/dist/components/bcm-accordion-group.js +3 -3
- package/dist/components/bcm-accordion-group.js.map +1 -1
- package/dist/components/bcm-accordion.js +7 -7
- package/dist/components/bcm-accordion.js.map +1 -1
- package/dist/components/bcm-alert.js +2 -2
- package/dist/components/bcm-alert.js.map +1 -1
- package/dist/components/bcm-avatar.js +13 -7
- package/dist/components/bcm-avatar.js.map +1 -1
- package/dist/components/bcm-badge.d.ts +11 -0
- package/dist/components/bcm-badge.js +8 -0
- package/dist/components/bcm-badge.js.map +1 -0
- package/dist/components/bcm-basic-badge.d.ts +11 -0
- package/dist/components/bcm-basic-badge.js +113 -0
- package/dist/components/bcm-basic-badge.js.map +1 -0
- package/dist/components/bcm-button.js +5 -5
- package/dist/components/bcm-button.js.map +1 -1
- package/dist/components/bcm-chip.js +4 -4
- package/dist/components/bcm-chip.js.map +1 -1
- package/dist/components/bcm-divider.d.ts +11 -0
- package/dist/components/bcm-divider.js +100 -0
- package/dist/components/bcm-divider.js.map +1 -0
- package/dist/components/bcm-input.d.ts +11 -0
- package/dist/components/bcm-input.js +369 -0
- package/dist/components/bcm-input.js.map +1 -0
- package/dist/components/bcm-text.js +4 -4
- package/dist/components/bcm-text.js.map +1 -1
- package/dist/components/bcm-textarea.d.ts +11 -0
- package/dist/components/bcm-textarea.js +369 -0
- package/dist/components/bcm-textarea.js.map +1 -0
- package/dist/components/index.js +12 -16
- package/dist/components/index.js.map +1 -1
- package/dist/{esm/index-f0e9d579.js → components/p-12360e4c.js} +3 -3
- package/dist/components/{p-b36f4f44.js.map → p-12360e4c.js.map} +1 -1
- package/dist/components/{p-0adcc84f.js → p-13582168.js} +34 -3
- package/dist/components/p-13582168.js.map +1 -0
- package/dist/components/p-31354aaa.js +129 -0
- package/dist/components/p-31354aaa.js.map +1 -0
- package/dist/components/p-39637e05.js +145 -0
- package/dist/components/p-39637e05.js.map +1 -0
- package/dist/esm/app-globals-bfa07b76.js +37 -0
- package/dist/esm/app-globals-bfa07b76.js.map +1 -0
- package/dist/esm/bcm-accordion-group.entry.js +88 -0
- package/dist/esm/bcm-accordion-group.entry.js.map +1 -0
- package/dist/esm/bcm-accordion.entry.js +124 -0
- package/dist/esm/bcm-accordion.entry.js.map +1 -0
- package/dist/esm/bcm-alert.entry.js +2 -2
- package/dist/esm/bcm-alert.entry.js.map +1 -1
- package/dist/esm/bcm-avatar_4.entry.js +570 -0
- package/dist/esm/bcm-avatar_4.entry.js.map +1 -0
- package/dist/esm/bcm-chip.entry.js +126 -0
- package/dist/esm/bcm-chip.entry.js.map +1 -0
- package/dist/esm/bcm-divider.entry.js +77 -0
- package/dist/esm/bcm-divider.entry.js.map +1 -0
- package/dist/esm/bcm-input.entry.js +309 -0
- package/dist/esm/bcm-input.entry.js.map +1 -0
- package/dist/esm/bcm-text.entry.js +4 -4
- package/dist/esm/bcm-text.entry.js.map +1 -1
- package/dist/esm/bcm-textarea.entry.js +312 -0
- package/dist/esm/bcm-textarea.entry.js.map +1 -0
- package/dist/esm/bromcom-ui.js +4 -4
- package/dist/{cjs/index-a4eea4bb.js → esm/index-097075ad.js} +3 -5
- package/dist/esm/{index-f0e9d579.js.map → index-097075ad.js.map} +1 -1
- package/dist/esm/{index-ce2fac11.js → index-27cc1bac.js} +43 -5
- package/dist/esm/index-27cc1bac.js.map +1 -0
- package/dist/esm/loader.js +4 -4
- package/dist/esm/validation-messages-a29d53be.js +129 -0
- package/dist/esm/validation-messages-a29d53be.js.map +1 -0
- package/dist/types/components/badge/badge.component.d.ts +87 -0
- package/dist/types/components/basic-badge/basic-badge.component.d.ts +54 -0
- package/dist/types/components/divider/divider.component.d.ts +40 -0
- package/dist/types/components/input/input.component.d.ts +93 -0
- package/dist/types/components/input/types.d.ts +13 -0
- package/dist/types/components/textarea/textarea.component.d.ts +85 -0
- package/dist/types/components/textarea/types.d.ts +7 -0
- package/dist/types/components.d.ts +889 -0
- package/dist/types/utils/i18n.d.ts +8 -0
- package/dist/types/utils/id/generate-id.d.ts +9 -0
- package/dist/types/utils/slot/check-slot-content.d.ts +7 -0
- package/dist/types/utils/validation-messages.d.ts +11 -0
- package/package.json +3 -2
- package/dist/bromcom-ui/p-0a74cf15.entry.js +0 -2
- package/dist/bromcom-ui/p-27c997d8.js +0 -3
- package/dist/bromcom-ui/p-27c997d8.js.map +0 -1
- package/dist/bromcom-ui/p-2d836917.entry.js +0 -2
- package/dist/bromcom-ui/p-40643b53.js +0 -2
- package/dist/bromcom-ui/p-40643b53.js.map +0 -1
- package/dist/bromcom-ui/p-84a5dcdb.entry.js +0 -2
- package/dist/bromcom-ui/p-84a5dcdb.entry.js.map +0 -1
- package/dist/bromcom-ui/p-f0c61f8c.entry.js +0 -2
- package/dist/bromcom-ui/p-f0c61f8c.entry.js.map +0 -1
- package/dist/cjs/app-globals-e8faea0d.js +0 -43
- package/dist/cjs/app-globals-e8faea0d.js.map +0 -1
- package/dist/cjs/bcm-accordion_4.cjs.entry.js +0 -623
- package/dist/cjs/bcm-accordion_4.cjs.entry.js.map +0 -1
- package/dist/cjs/bcm-avatar.cjs.entry.js +0 -89
- package/dist/cjs/bcm-avatar.cjs.entry.js.map +0 -1
- package/dist/cjs/index-638f2d15.js.map +0 -1
- package/dist/components/p-0adcc84f.js.map +0 -1
- package/dist/esm/app-globals-f781c325.js +0 -41
- package/dist/esm/app-globals-f781c325.js.map +0 -1
- package/dist/esm/bcm-accordion_4.entry.js +0 -616
- package/dist/esm/bcm-accordion_4.entry.js.map +0 -1
- package/dist/esm/bcm-avatar.entry.js +0 -85
- package/dist/esm/bcm-avatar.entry.js.map +0 -1
- package/dist/esm/index-ce2fac11.js.map +0 -1
- /package/dist/bromcom-ui/{p-b36f4f44.js.map → p-12360e4c.js.map} +0 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"textarea.component.js","sourceRoot":"","sources":["../../../src/components/textarea/textarea.component.tsx"],"names":[],"mappings":"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;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import { Component, Prop, h, Event, EventEmitter, Method, State, Watch, Element } from '@stencil/core';\nimport { InputSize, InputStatus, TextareaResize } from './types';\nimport { tv } from 'tailwind-variants';\nimport classNames from 'classnames';\nimport { generateId } from '../../utils/id/generate-id';\n// import { checkSlotContent } from '../../utils/slot/check-slot-content';\nimport { getValidationMessage, setValidationMessages, defaultValidationMessages } from '../../utils/validation-messages';\n\n@Component({\n tag: 'bcm-textarea',\n styleUrl: 'textarea.scss',\n shadow: true,\n})\nexport class BcmTextarea {\n @Element() el: HTMLElement;\n private textareaRef: HTMLTextAreaElement;\n\n @State() isFocused = false;\n @State() validationMessage: string;\n @State() isValid = true;\n @State() internalStatus: InputStatus = 'default';\n @State() internalErrorMessage: string;\n\n /** Textarea value */\n @Prop({ mutable: true, reflect: true })\n value: string = '';\n\n /** Textarea rows */\n @Prop()\n rows?: number = 3;\n\n /** Textarea cols */\n @Prop()\n cols?: number;\n\n /** Minimum height in rows */\n @Prop()\n minRows?: number;\n\n /** Maximum height in rows */\n @Prop()\n maxRows?: number;\n\n /** Resize behavior */\n @Prop()\n resize: TextareaResize = 'none';\n\n /** Auto grow height based on content */\n @Prop()\n autoGrow = false;\n\n /** Input placeholder text */\n @Prop()\n placeholder?: string;\n\n /** Input name */\n @Prop()\n name?: string;\n\n /** Input id */\n @Prop({ attribute: 'id', reflect: true })\n _id?: string = generateId('textarea');\n\n /** Controls the textarea size */\n @Prop()\n size: InputSize = 'medium';\n\n /** Defines the textarea's status/state */\n @Prop()\n status: InputStatus = 'default';\n\n /** Full width textarea */\n @Prop({ attribute: 'full-width', reflect: true })\n fullWidth = false;\n\n /** Whether the textarea is disabled */\n @Prop()\n disabled = false;\n\n /** Whether the textarea is readonly */\n @Prop()\n readonly = false;\n\n /** Whether the textarea is required */\n @Prop()\n required = false;\n\n /** Min length for text input */\n @Prop()\n minLength?: number;\n\n /** Max length for text input */\n @Prop()\n maxLength?: number;\n\n /** Show character counter */\n @Prop()\n showCounter: boolean = true;\n\n /** Textarea label for accessibility */\n @Prop()\n label?: string;\n\n /** Error message to display */\n @Prop()\n errorMessage?: string;\n\n /** Caption text to display below textarea */\n @Prop()\n captionText?: string;\n\n /** ID of associated label element */\n @Prop()\n labelledby?: string;\n\n /** ID of associated caption/error text element */\n @Prop()\n describedby?: string;\n\n /** Custom validation function */\n @Prop()\n validator?: (value: string) => string | undefined;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n })\n bcmInput: EventEmitter<InputEvent>;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n })\n bcmChange: EventEmitter<Event>;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n })\n bcmFocus: EventEmitter<FocusEvent>;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n })\n bcmBlur: EventEmitter<FocusEvent>;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n })\n bcmKeyDown: EventEmitter<KeyboardEvent>;\n\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n })\n bcmKeyUp: EventEmitter<KeyboardEvent>;\n\n @Watch('value')\n handleValueChange(newValue: string) {\n if (this.textareaRef) {\n this.textareaRef.value = newValue;\n if (this.autoGrow) {\n this.adjustHeight();\n }\n }\n }\n\n @Watch('status')\n watchStatus(newValue: InputStatus) {\n this.internalStatus = newValue;\n }\n\n @Watch('errorMessage')\n watchErrorMessage(newValue: string) {\n this.internalErrorMessage = newValue;\n }\n\n componentWillLoad() {\n setValidationMessages('en', defaultValidationMessages);\n this.internalStatus = this.status;\n this.internalErrorMessage = this.errorMessage;\n }\n\n componentDidLoad() {\n if (this.autoGrow) {\n this.adjustHeight();\n // Input event'ini dinle\n this.textareaRef?.addEventListener('input', () => this.adjustHeight());\n }\n }\n\n disconnectedCallback() {\n // Event listener'ı temizle\n if (this.autoGrow && this.textareaRef) {\n this.textareaRef.removeEventListener('input', () => this.adjustHeight());\n }\n }\n\n @Method()\n async setFocus() {\n this.textareaRef?.focus();\n }\n\n @Method()\n async setBlur() {\n this.textareaRef?.blur();\n }\n\n @Method()\n async select() {\n this.textareaRef?.select();\n }\n\n private adjustHeight() {\n if (!this.autoGrow || !this.textareaRef) return;\n\n requestAnimationFrame(() => {\n // Önce height'ı sıfırla ki scrollHeight doğru hesaplansın\n this.textareaRef.style.height = '0px';\n\n const computedStyle = getComputedStyle(this.textareaRef);\n const lineHeight = parseInt(computedStyle.lineHeight);\n const paddingTop = parseInt(computedStyle.paddingTop);\n const paddingBottom = parseInt(computedStyle.paddingBottom);\n const scrollHeight = this.textareaRef.scrollHeight;\n\n let newHeight = scrollHeight;\n\n // Min/max kontrolleri\n if (this.minRows) {\n const minHeight = this.minRows * lineHeight + paddingTop + paddingBottom;\n newHeight = Math.max(newHeight, minHeight);\n }\n\n if (this.maxRows) {\n const maxHeight = this.maxRows * lineHeight + paddingTop + paddingBottom;\n newHeight = Math.min(newHeight, maxHeight);\n }\n\n this.textareaRef.style.height = `${newHeight}px`;\n });\n }\n\n private validateInput(): void {\n if (!this.textareaRef) return;\n\n // Reset validation state\n this.isValid = true;\n this.validationMessage = '';\n\n const value = this.textareaRef.value;\n\n // Required check\n if (this.required && !value) {\n this.isValid = false;\n this.validationMessage = getValidationMessage('required');\n this.internalStatus = 'error';\n this.internalErrorMessage = this.validationMessage;\n return;\n }\n\n // Minimum length check\n if (this.minLength && value.length < this.minLength) {\n this.isValid = false;\n this.validationMessage = getValidationMessage('minlength', { min: this.minLength });\n }\n // Maximum length check\n else if (this.maxLength && value.length > this.maxLength) {\n this.isValid = false;\n this.validationMessage = getValidationMessage('maxlength', { max: this.maxLength });\n }\n\n // Custom validator\n if (this.validator) {\n const customError = this.validator(value);\n if (customError) {\n this.isValid = false;\n this.validationMessage = customError;\n }\n }\n\n // Update component state\n this.internalStatus = this.isValid ? 'default' : 'error';\n this.internalErrorMessage = this.validationMessage;\n }\n\n private onChange = (event: Event) => {\n this.bcmChange.emit(event);\n };\n\n private onFocus = (event: FocusEvent) => {\n this.isFocused = true;\n this.bcmFocus.emit(event);\n };\n\n private onBlur = (event: FocusEvent) => {\n this.isFocused = false;\n this.bcmBlur.emit(event);\n this.validateInput();\n };\n\n private onKeyDown = (event: KeyboardEvent) => {\n this.bcmKeyDown.emit(event);\n };\n\n private onKeyUp = (event: KeyboardEvent) => {\n this.bcmKeyUp.emit(event);\n };\n\n private styleClass = tv(\n {\n slots: {\n base: [\n 'bcm-textarea bcm-textarea__container',\n 'bg-[--bcm-ui-color-background-base-default]',\n 'border border-solid rounded',\n 'flex flex-col', // flex-col ekledik\n 'transition-colors duration-200',\n 'px-2 py-2',\n 'w-full', // w-full ekledik\n ],\n textareaClass: [\n 'textarea',\n 'w-full',\n 'border-0 outline-0 bg-transparent',\n 'appearance-none',\n 'text-[--bcm-ui-color-text-default] placeholder:text-[--bcm-ui-color-text-placeholder] placeholder:font-normal',\n 'font-sans antialiased font-medium',\n 'px-1',\n 'overflow-y-auto', // overflow-y-auto ekledik\n 'min-h-0', // min-h-0 ekledik\n ],\n counterText: ['textarea-counter-text', 'text-[--bcm-ui-color-text-placeholder]', 'text-right', 'mt-1'],\n },\n variants: {\n size: {\n small: {\n base: '',\n textareaClass: 'text-size-4 min-h-[3rem]',\n counterText: 'text-size-3',\n },\n medium: {\n base: '',\n textareaClass: 'text-size-5 min-h-[4rem]',\n counterText: 'text-size-4',\n },\n large: {\n base: '',\n textareaClass: 'text-size-6 min-h-[5rem]',\n counterText: 'text-size-5',\n },\n },\n resize: {\n none: { textareaClass: '!resize-none' },\n both: { textareaClass: '!resize' },\n horizontal: { textareaClass: '!resize-x' },\n vertical: { textareaClass: '!resize-y' },\n },\n status: {\n default: {\n base: ['border-[--bcm-ui-color-border-default]', 'hover:border-[--bcm-ui-color-border-primary]', 'has-[:focus]:border-[--bcm-ui-color-border-primary]'],\n },\n error: {\n base: ['border-[--bcm-ui-color-border-error]', 'hover:border-[--bcm-ui-color-border-error]', 'has-[:focus]:border-[--bcm-ui-color-border-error]'],\n },\n success: {\n base: ['border-[--bcm-ui-color-border-success]', 'hover:border-[--bcm-ui-color-border-success]', 'has-[:focus]:border-[--bcm-ui-color-border-success]'],\n },\n warning: {\n base: ['border-[--bcm-ui-color-border-warning]', 'hover:border-[--bcm-ui-color-border-warning]', 'has-[:focus]:border-[--bcm-ui-color-border-warning]'],\n },\n info: {\n base: ['border-[--bcm-ui-color-border-info]', 'hover:border-[--bcm-ui-color-border-info]', 'has-[:focus]:border-[--bcm-ui-color-border-info]'],\n },\n },\n fullWidth: {\n true: 'full-width w-full',\n },\n disabled: {\n true: {\n base: 'disabled cursor-not-allowed opacity-50',\n textareaClass: '!resize-none', // disabled durumunda resize'ı engelle\n },\n false: '',\n },\n focused: {\n true: {\n base: 'ring-2 ring-[--bcm-ui-color-border-primary] ring-opacity-50',\n },\n false: '',\n },\n },\n defaultVariants: {\n size: 'medium',\n status: 'default',\n resize: 'vertical',\n fullWidth: false,\n disabled: false,\n focused: false,\n },\n },\n {\n twMerge: false,\n },\n );\n\n render() {\n const textareaId = this._id + '-textarea' || this.name;\n\n const { base, textareaClass, counterText } = this.styleClass({\n size: this.size,\n status: this.internalStatus,\n resize: this.resize,\n fullWidth: this.fullWidth,\n disabled: this.disabled,\n focused: this.isFocused,\n });\n\n return (\n <div class=\"bcm-ui-element\">\n {/* Label rendering */}\n {this.label && (\n <label\n class={classNames(\n 'textarea-label font-medium',\n {\n 'text-color-label': !this.disabled,\n 'text-color-disabled': this.disabled,\n },\n {\n 'text-size-3': this.size === 'small',\n 'text-size-4': this.size === 'medium',\n 'text-size-5': this.size === 'large',\n },\n )}\n htmlFor={textareaId}\n >\n <slot name=\"label\">{this.label}</slot>\n {this.required && <span>*</span>}\n </label>\n )}\n\n {/* Textarea container */}\n <div class={base()}>\n <textarea\n ref={el => (this.textareaRef = el)}\n id={textareaId}\n class={textareaClass()}\n name={this.name}\n rows={this.rows}\n cols={this.cols}\n disabled={this.disabled}\n readonly={this.readonly}\n required={this.required}\n placeholder={this.placeholder}\n minLength={this.minLength}\n maxLength={this.maxLength}\n aria-invalid={this.status === 'error'}\n aria-required={this.required}\n aria-labelledby={this.labelledby}\n aria-describedby={this.describedby}\n value={this.value}\n onInput={event => {\n const target = event.target as HTMLTextAreaElement;\n this.value = target.value;\n this.bcmInput.emit(event);\n this.validateInput();\n if (this.autoGrow) {\n this.adjustHeight();\n }\n }}\n onChange={this.onChange}\n onFocus={this.onFocus}\n onBlur={this.onBlur}\n onKeyDown={this.onKeyDown}\n onKeyUp={this.onKeyUp}\n />\n {/* buraya isteğe bağlı olarak gözüken bir karakter sayacı ekleyeceğiz. bu sayaç sağa yaslı olacak şu formatta olacak 0/120 gibi 0 mevcut karakteri 120 ise limiti gösterecek */}\n {this.showCounter && (\n <div class={counterText()}>\n {this.value.length}\n {this.maxLength ? `/${this.maxLength}` : ''}\n </div>\n )}\n </div>\n\n {/* Validation/Caption message */}\n {(this.captionText || this.internalErrorMessage || this.validationMessage) && (\n <div\n class={classNames(\n 'textarea-caption-text font-regular mt-1',\n {\n 'text-[--bcm-ui-color-text-caption]': !this.disabled && this.internalStatus === 'default',\n 'text-[--bcm-ui-color-text-error]': !this.disabled && (this.internalStatus === 'error' || !this.isValid),\n 'text-[--bcm-ui-color-text-success]': !this.disabled && this.internalStatus === 'success',\n 'text-[--bcm-ui-color-text-warning]': !this.disabled && this.internalStatus === 'warning',\n 'text-[--bcm-ui-color-text-info]': !this.disabled && this.internalStatus === 'info',\n 'text-[--bcm-ui-color-text-disabled]': this.disabled,\n },\n {\n 'text-size-3': this.size === 'small',\n 'text-size-4': this.size === 'medium',\n 'text-size-5': this.size === 'large',\n },\n )}\n >\n {!this.isValid ? this.validationMessage : this.internalStatus === 'error' ? this.internalErrorMessage : this.captionText}\n </div>\n )}\n </div>\n );\n }\n}\n"]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
.visible{visibility:visible}.collapse{visibility:collapse}.relative{position:relative}.block{display:block}.flex{display:flex}.table{display:table}.contents{display:contents}.hidden{display:none}.border-collapse{border-collapse:collapse}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.resize-none{resize:none;resize:none!important}.resize-y{resize:vertical;resize:vertical!important}.resize-x{resize:horizontal;resize:horizontal!important}.resize{resize:both!important;resize:both}.border{border-width:1px}.underline{text-decoration-line:underline}.outline{outline-style:solid}
|
|
2
|
+
/*! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com*/*,:after,:before{border:0 solid oklch(.928 .006 264.531);box-sizing:border-box}:after,:before{--tw-content:""}:host,html{-webkit-text-size-adjust:100%;font-feature-settings:normal;-webkit-tap-highlight-color:transparent;font-family:Inter,sans-serif;font-variation-settings:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4}body{line-height:inherit;margin:0}hr{border-top-width:1px;color:inherit;height:0}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-feature-settings:normal;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em;font-variation-settings:normal}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{border-collapse:collapse;border-color:inherit;text-indent:0}button,input,optgroup,select,textarea{font-feature-settings:inherit;color:inherit;font-family:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,fieldset,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{color:oklch(.707 .022 261.325);opacity:1}input::placeholder,textarea::placeholder{color:oklch(.707 .022 261.325);opacity:1}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{height:auto;max-width:100%}[hidden]:where(:not([hidden=until-found])){display:none}:host{display:block;width:100%}.bcm-textarea__container{display:flex;flex-direction:column;width:100%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.mt-1{margin-top:.25rem}.min-h-0{min-height:0}.min-h-\[3rem\]{min-height:3rem}.min-h-\[4rem\]{min-height:4rem}.min-h-\[5rem\]{min-height:5rem}.w-full{width:100%}.grow{flex-grow:1}.cursor-not-allowed{cursor:not-allowed}.\!resize-none{resize:none!important}.\!resize-y{resize:vertical!important}.\!resize-x{resize:horizontal!important}.\!resize{resize:both!important}.appearance-none{appearance:none}.flex-col{flex-direction:column}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.border-0{border-width:0}.border-solid{border-style:solid}.border-\[--bcm-ui-color-border-default\]{border-color:var(--bcm-ui-color-border-default)}.border-\[--bcm-ui-color-border-error\]{border-color:var(--bcm-ui-color-border-error)}.border-\[--bcm-ui-color-border-info\]{border-color:var(--bcm-ui-color-border-info)}.border-\[--bcm-ui-color-border-success\]{border-color:var(--bcm-ui-color-border-success)}.border-\[--bcm-ui-color-border-warning\]{border-color:var(--bcm-ui-color-border-warning)}.bg-\[--bcm-ui-color-background-base-default\]{background-color:var(--bcm-ui-color-background-base-default)}.bg-transparent{background-color:transparent}.px-1{padding-left:.25rem;padding-right:.25rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.text-right{text-align:right}.font-sans{font-family:Inter,sans-serif}.text-size-3{font-size:var(--bcm-ui-font-size-3,12px);line-height:var(--bcm-ui-line-height-3,16px)}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.font-medium{font-weight:500}.text-\[--bcm-ui-color-text-caption\]{color:var(--bcm-ui-color-text-caption)}.text-\[--bcm-ui-color-text-default\]{color:var(--bcm-ui-color-text-default)}.text-\[--bcm-ui-color-text-disabled\]{color:var(--bcm-ui-color-text-disabled)}.text-\[--bcm-ui-color-text-error\]{color:var(--bcm-ui-color-text-error)}.text-\[--bcm-ui-color-text-info\]{color:var(--bcm-ui-color-text-info)}.text-\[--bcm-ui-color-text-placeholder\]{color:var(--bcm-ui-color-text-placeholder)}.text-\[--bcm-ui-color-text-success\]{color:var(--bcm-ui-color-text-success)}.text-\[--bcm-ui-color-text-warning\]{color:var(--bcm-ui-color-text-warning)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.text-color-label{color:var(--bcm-ui-color-text-label)}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.opacity-50{opacity:.5}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.outline-0{outline-width:0}.ring-2{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 #0000)}.ring-\[--bcm-ui-color-border-primary\]{--tw-ring-color:var(--bcm-ui-color-border-primary)}.ring-opacity-50{--tw-ring-opacity:0.5}.blur{--tw-blur:blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-colors{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-200{transition-duration:.2s}.placeholder\:font-normal::placeholder{font-weight:400}.placeholder\:text-\[--bcm-ui-color-text-placeholder\]::placeholder{color:var(--bcm-ui-color-text-placeholder)}.hover\:border-\[--bcm-ui-color-border-error\]:hover{border-color:var(--bcm-ui-color-border-error)}.hover\:border-\[--bcm-ui-color-border-info\]:hover{border-color:var(--bcm-ui-color-border-info)}.hover\:border-\[--bcm-ui-color-border-primary\]:hover{border-color:var(--bcm-ui-color-border-primary)}.hover\:border-\[--bcm-ui-color-border-success\]:hover{border-color:var(--bcm-ui-color-border-success)}.hover\:border-\[--bcm-ui-color-border-warning\]:hover{border-color:var(--bcm-ui-color-border-warning)}.has-\[\:focus\]\:border-\[--bcm-ui-color-border-error\]:has(:focus){border-color:var(--bcm-ui-color-border-error)}.has-\[\:focus\]\:border-\[--bcm-ui-color-border-info\]:has(:focus){border-color:var(--bcm-ui-color-border-info)}.has-\[\:focus\]\:border-\[--bcm-ui-color-border-primary\]:has(:focus){border-color:var(--bcm-ui-color-border-primary)}.has-\[\:focus\]\:border-\[--bcm-ui-color-border-success\]:has(:focus){border-color:var(--bcm-ui-color-border-success)}.has-\[\:focus\]\:border-\[--bcm-ui-color-border-warning\]:has(:focus){border-color:var(--bcm-ui-color-border-warning)}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../src/components/textarea/types.ts"],"names":[],"mappings":"","sourcesContent":["import { InputSize, InputStatus } from '../input/types';\n\nexport { InputSize, InputStatus };\n\nexport interface TextareaResizeOptions {\n horizontal?: boolean;\n vertical?: boolean;\n}\n\nexport type TextareaResize = 'none' | 'both' | 'horizontal' | 'vertical';\n"]}
|
|
@@ -11,30 +11,29 @@ addHeadScript({ src: 'https://kit.fontawesome.com/5e86bea963.js', crossOrigin: '
|
|
|
11
11
|
|
|
12
12
|
const FA_GLOBAL_CSS = 'https://designsystem.bromcomcloud.com/fontawesome/6/css/all.min.css';
|
|
13
13
|
|
|
14
|
-
let element = (tag, p = {}) => Object.assign(document.createElement(tag), p);
|
|
15
|
-
|
|
16
14
|
customElements.define(
|
|
17
15
|
'bcm-icon',
|
|
18
16
|
class extends HTMLElement {
|
|
19
17
|
constructor() {
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
connectedCallback() {
|
|
27
|
-
this.style.display = 'inline-block';
|
|
28
|
-
this.icon = this.icon;
|
|
29
|
-
// this.onclick = evt => this.dispatchEvent(new CustomEvent('click', { bubbles: true, detail: evt }));
|
|
30
|
-
//this.onmouseenter = evt => this.dispatchEvent(new CustomEvent('mouseenter', { bubbles: true, detail: evt }));
|
|
31
|
-
//this.onmouseleave = evt => this.dispatchEvent(new CustomEvent('mouseleave', { bubbles: true, detail: evt }));
|
|
18
|
+
super();
|
|
19
|
+
const shadow = this.attachShadow({ mode: 'open' });
|
|
20
|
+
shadow.innerHTML = `
|
|
21
|
+
<link rel="stylesheet" href="${FA_GLOBAL_CSS}"/>
|
|
22
|
+
<i></i>
|
|
23
|
+
`;
|
|
32
24
|
}
|
|
25
|
+
|
|
33
26
|
get icon() {
|
|
34
27
|
return this.getAttribute('name') || this.getAttribute('icon-name');
|
|
35
28
|
}
|
|
29
|
+
|
|
36
30
|
set icon(icon) {
|
|
37
|
-
this.shadowRoot.querySelector('
|
|
31
|
+
this.shadowRoot.querySelector('i').className = `${icon}`;
|
|
32
|
+
}
|
|
33
|
+
|
|
34
|
+
connectedCallback() {
|
|
35
|
+
this.style.display = 'inline-block';
|
|
36
|
+
this.icon = this.icon;
|
|
38
37
|
}
|
|
39
38
|
},
|
|
40
39
|
);
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
export class I18n {
|
|
2
|
+
static setMessages(locale, messages) {
|
|
3
|
+
this.messages[locale] = messages;
|
|
4
|
+
this.currentLocale = locale; // Mesajları set ederken locale'i de güncelle
|
|
5
|
+
// console.log(`I18n messages set for locale: ${locale}`, messages);
|
|
6
|
+
}
|
|
7
|
+
static setLocale(locale) {
|
|
8
|
+
if (this.messages[locale]) {
|
|
9
|
+
this.currentLocale = locale;
|
|
10
|
+
// Locale değiştiğinde console'a bilgi ver (development için)
|
|
11
|
+
console.log(`I18n locale changed to: ${locale}`);
|
|
12
|
+
}
|
|
13
|
+
else {
|
|
14
|
+
console.warn(`Locale '${locale}' not found in messages`);
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
static t(key, data) {
|
|
18
|
+
var _a;
|
|
19
|
+
const message = ((_a = this.messages[this.currentLocale]) === null || _a === void 0 ? void 0 : _a[key]) || key;
|
|
20
|
+
if (!data)
|
|
21
|
+
return message;
|
|
22
|
+
return Object.entries(data).reduce((msg, [key, value]) => {
|
|
23
|
+
return msg.replace(new RegExp(`{${key}}`, 'g'), String(value));
|
|
24
|
+
}, message);
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
I18n.messages = {};
|
|
28
|
+
I18n.currentLocale = 'en';
|
|
29
|
+
//# sourceMappingURL=i18n.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"i18n.js","sourceRoot":"","sources":["../../src/utils/i18n.ts"],"names":[],"mappings":"AAEA,MAAM,OAAO,IAAI;IAIf,MAAM,CAAC,WAAW,CAAC,MAAc,EAAE,QAAgC;QACjE,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,QAAQ,CAAC;QACjC,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC,CAAC,6CAA6C;QAC1E,oEAAoE;IACtE,CAAC;IAED,MAAM,CAAC,SAAS,CAAC,MAAc;QAC7B,IAAI,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;YAC1B,IAAI,CAAC,aAAa,GAAG,MAAM,CAAC;YAC5B,6DAA6D;YAC7D,OAAO,CAAC,GAAG,CAAC,2BAA2B,MAAM,EAAE,CAAC,CAAC;QACnD,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,IAAI,CAAC,WAAW,MAAM,yBAAyB,CAAC,CAAC;QAC3D,CAAC;IACH,CAAC;IAED,MAAM,CAAC,CAAC,CAAC,GAAW,EAAE,IAA0B;;QAC9C,MAAM,OAAO,GAAG,CAAA,MAAA,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,aAAa,CAAC,0CAAG,GAAG,CAAC,KAAI,GAAG,CAAC;QAChE,IAAI,CAAC,IAAI;YAAE,OAAO,OAAO,CAAC;QAE1B,OAAO,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;YACvD,OAAO,GAAG,CAAC,OAAO,CAAC,IAAI,MAAM,CAAC,IAAI,GAAG,GAAG,EAAE,GAAG,CAAC,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;QACjE,CAAC,EAAE,OAAO,CAAC,CAAC;IACd,CAAC;;AA1Bc,aAAQ,GAA2C,EAAE,CAAC;AACtD,kBAAa,GAAG,IAAI,CAAC","sourcesContent":["export type MessageTemplateData = Record<string, string | number>;\n\nexport class I18n {\n private static messages: Record<string, Record<string, string>> = {};\n private static currentLocale = 'en';\n\n static setMessages(locale: string, messages: Record<string, string>) {\n this.messages[locale] = messages;\n this.currentLocale = locale; // Mesajları set ederken locale'i de güncelle\n // console.log(`I18n messages set for locale: ${locale}`, messages);\n }\n\n static setLocale(locale: string) {\n if (this.messages[locale]) {\n this.currentLocale = locale;\n // Locale değiştiğinde console'a bilgi ver (development için)\n console.log(`I18n locale changed to: ${locale}`);\n } else {\n console.warn(`Locale '${locale}' not found in messages`);\n }\n }\n\n static t(key: string, data?: MessageTemplateData): string {\n const message = this.messages[this.currentLocale]?.[key] || key;\n if (!data) return message;\n\n return Object.entries(data).reduce((msg, [key, value]) => {\n return msg.replace(new RegExp(`{${key}}`, 'g'), String(value));\n }, message);\n }\n}\n"]}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { v4 as uuidv4 } from "uuid";
|
|
2
|
+
/**
|
|
3
|
+
* Generates a unique identifier with an optional prefix.
|
|
4
|
+
* @param prefix - Optional prefix for the generated ID (default: 'bcm')
|
|
5
|
+
* @returns A unique string ID in the format "prefix-uuid"
|
|
6
|
+
* @example
|
|
7
|
+
* const id = generateId('button'); // -> "button-123e4567-e89b..."
|
|
8
|
+
* const defaultId = generateId(); // -> "bcm-123e4567-e89b..."
|
|
9
|
+
*/
|
|
10
|
+
export const generateId = (prefix = 'bcm') => {
|
|
11
|
+
if (!prefix) {
|
|
12
|
+
throw new Error('Prefix cannot be empty');
|
|
13
|
+
}
|
|
14
|
+
return `${prefix}-${uuidv4()}`;
|
|
15
|
+
};
|
|
16
|
+
//# sourceMappingURL=generate-id.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"generate-id.js","sourceRoot":"","sources":["../../../src/utils/id/generate-id.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,IAAI,MAAM,EAAE,MAAM,MAAM,CAAC;AAEpC;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,UAAU,GAAG,CAAC,MAAM,GAAG,KAAK,EAAU,EAAE;IACnD,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,IAAI,KAAK,CAAC,wBAAwB,CAAC,CAAC;IAC5C,CAAC;IACD,OAAO,GAAG,MAAM,IAAI,MAAM,EAAE,EAAE,CAAC;AACjC,CAAC,CAAC","sourcesContent":["import { v4 as uuidv4 } from 'uuid';\n\n/**\n * Generates a unique identifier with an optional prefix.\n * @param prefix - Optional prefix for the generated ID (default: 'bcm')\n * @returns A unique string ID in the format \"prefix-uuid\"\n * @example\n * const id = generateId('button'); // -> \"button-123e4567-e89b...\"\n * const defaultId = generateId(); // -> \"bcm-123e4567-e89b...\"\n */\nexport const generateId = (prefix = 'bcm'): string => {\n if (!prefix) {\n throw new Error('Prefix cannot be empty');\n }\n return `${prefix}-${uuidv4()}`;\n};\n"]}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Checks if a named slot has any content
|
|
3
|
+
* @param element - The host element (component instance)
|
|
4
|
+
* @param slotName - Name of the slot to check
|
|
5
|
+
* @returns boolean indicating if the slot has any assigned nodes
|
|
6
|
+
*/
|
|
7
|
+
export const checkSlotContent = (element, slotName) => {
|
|
8
|
+
var _a;
|
|
9
|
+
const slot = (_a = element.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector(`slot[name="${slotName}"]`);
|
|
10
|
+
if (!slot)
|
|
11
|
+
return false;
|
|
12
|
+
const assignedNodes = slot.assignedNodes();
|
|
13
|
+
return assignedNodes.length > 0;
|
|
14
|
+
};
|
|
15
|
+
//# sourceMappingURL=check-slot-content.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"check-slot-content.js","sourceRoot":"","sources":["../../../src/utils/slot/check-slot-content.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,OAAoB,EAAE,QAAgB,EAAW,EAAE;;IAClF,MAAM,IAAI,GAAG,MAAA,OAAO,CAAC,UAAU,0CAAE,aAAa,CAAC,cAAc,QAAQ,IAAI,CAAoB,CAAC;IAC9F,IAAI,CAAC,IAAI;QAAE,OAAO,KAAK,CAAC;IAExB,MAAM,aAAa,GAAG,IAAI,CAAC,aAAa,EAAE,CAAC;IAC3C,OAAO,aAAa,CAAC,MAAM,GAAG,CAAC,CAAC;AAClC,CAAC,CAAC","sourcesContent":["/**\n * Checks if a named slot has any content\n * @param element - The host element (component instance)\n * @param slotName - Name of the slot to check\n * @returns boolean indicating if the slot has any assigned nodes\n */\nexport const checkSlotContent = (element: HTMLElement, slotName: string): boolean => {\n const slot = element.shadowRoot?.querySelector(`slot[name=\"${slotName}\"]`) as HTMLSlotElement;\n if (!slot) return false;\n\n const assignedNodes = slot.assignedNodes();\n return assignedNodes.length > 0;\n};\n"]}
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { I18n } from "./i18n";
|
|
2
|
+
export const defaultValidationMessages = {
|
|
3
|
+
email: 'Please enter a valid email address',
|
|
4
|
+
required: 'This field is required',
|
|
5
|
+
minlength: 'Please enter at least {min} characters',
|
|
6
|
+
maxlength: 'Please enter no more than {max} characters',
|
|
7
|
+
min: 'Value must be at least {min}',
|
|
8
|
+
max: 'Value must be at most {max}',
|
|
9
|
+
pattern: 'Please enter a valid format',
|
|
10
|
+
};
|
|
11
|
+
export const setValidationMessages = (locale, messages) => {
|
|
12
|
+
I18n.setMessages(locale, Object.assign(Object.assign({}, defaultValidationMessages), messages));
|
|
13
|
+
};
|
|
14
|
+
export const getValidationMessage = (type, data) => {
|
|
15
|
+
return I18n.t(type, data);
|
|
16
|
+
};
|
|
17
|
+
//# sourceMappingURL=validation-messages.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"validation-messages.js","sourceRoot":"","sources":["../../src/utils/validation-messages.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAE9B,MAAM,CAAC,MAAM,yBAAyB,GAAG;IACvC,KAAK,EAAE,oCAAoC;IAC3C,QAAQ,EAAE,wBAAwB;IAClC,SAAS,EAAE,wCAAwC;IACnD,SAAS,EAAE,4CAA4C;IACvD,GAAG,EAAE,8BAA8B;IACnC,GAAG,EAAE,6BAA6B;IAClC,OAAO,EAAE,6BAA6B;CACvC,CAAC;AAEF,MAAM,CAAC,MAAM,qBAAqB,GAAG,CAAC,MAAc,EAAE,QAAmD,EAAE,EAAE;IAC3G,IAAI,CAAC,WAAW,CAAC,MAAM,kCAAO,yBAAyB,GAAK,QAAQ,EAAG,CAAC;AAC1E,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAAC,IAA4C,EAAE,IAAsC,EAAE,EAAE;IAC3H,OAAO,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC;AAC5B,CAAC,CAAC","sourcesContent":["import { I18n } from './i18n';\n\nexport const defaultValidationMessages = {\n email: 'Please enter a valid email address',\n required: 'This field is required',\n minlength: 'Please enter at least {min} characters',\n maxlength: 'Please enter no more than {max} characters',\n min: 'Value must be at least {min}',\n max: 'Value must be at most {max}',\n pattern: 'Please enter a valid format',\n};\n\nexport const setValidationMessages = (locale: string, messages: Partial<typeof defaultValidationMessages>) => {\n I18n.setMessages(locale, { ...defaultValidationMessages, ...messages });\n};\n\nexport const getValidationMessage = (type: keyof typeof defaultValidationMessages, data?: Record<string, string | number>) => {\n return I18n.t(type, data);\n};\n"]}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, c as createEvent, h } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, c as createEvent, h } from './p-13582168.js';
|
|
2
2
|
|
|
3
|
-
const accordionGroupCss = "
|
|
3
|
+
const accordionGroupCss = ".block{display:block}:host{--bcm-accordion-border:var(--bcm-ui-color-border-default);--bcm-accordion-radius:6px;display:block;width:100%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.collapse{visibility:collapse}.static{position:static}.flex{display:flex}.w-full{width:100%}.flex-col{flex-direction:column}.rounded-\\[--bcm-accordion-radius\\]{border-radius:var(--bcm-accordion-radius)}.border{border-width:1px}.border-solid{border-style:solid}.border-\\[--bcm-accordion-border\\]{border-color:var(--bcm-accordion-border)}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}";
|
|
4
4
|
const BcmAccordionGroupStyle0 = accordionGroupCss;
|
|
5
5
|
|
|
6
6
|
const BcmAccordionGroup$1 = /*@__PURE__*/ proxyCustomElement(class BcmAccordionGroup extends H {
|
|
@@ -79,7 +79,7 @@ const BcmAccordionGroup$1 = /*@__PURE__*/ proxyCustomElement(class BcmAccordionG
|
|
|
79
79
|
});
|
|
80
80
|
}
|
|
81
81
|
render() {
|
|
82
|
-
return (h("div", { key: '
|
|
82
|
+
return (h("div", { key: '04ec31b987f1a191437682ce92bc794da6971128', class: "flex flex-col bcm-ui-element w-full border border-solid border-[--bcm-accordion-border] rounded-[--bcm-accordion-radius]", role: "group", "aria-label": "Accordion group" }, h("slot", { key: 'ba5809b40e06bd66bed5041b90a864bd2eeeae43', onSlotchange: this.handleSlotChange })));
|
|
83
83
|
}
|
|
84
84
|
get host() { return this; }
|
|
85
85
|
static get style() { return BcmAccordionGroupStyle0; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"bcm-accordion-group.js","mappings":";;AAAA,MAAM,iBAAiB,GAAG
|
|
1
|
+
{"file":"bcm-accordion-group.js","mappings":";;AAAA,MAAM,iBAAiB,GAAG,uhCAAuhC,CAAC;AACljC,gCAAe,iBAAiB;;MCmEnBA,mBAAiB;IAL9B;;;;;;QAUY,UAAK,GAAY,KAAK,CAAC;;QAGtB,mBAAc,GAA8B,EAAE,CAAC;;;;QAoDhD,qBAAgB,GAAG;YACvB,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,eAAe,CAAC,CAAC,CAAC;YAC9E,IAAI,CAAC,gBAAgB,EAAE,CAAC;;YAExB,IAAI,IAAI,CAAC,cAAc,CAAC,MAAM,KAAK,CAAC,EAAE;gBAClC,OAAO,CAAC,IAAI,CAAC,6CAA6C,CAAC,CAAC;aAC/D;SACJ,CAAC;KAuCL;;;;;IApFG,MAAM,SAAS;QACX,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACb,OAAO,CAAC,IAAI,CAAC,6CAA6C,CAAC,CAAC;YAC5D,OAAO;SACV;QACD,MAAM,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC;KACrE;;;;IAMD,MAAM,WAAW;QACb,MAAM,OAAO,CAAC,GAAG,CAAC,IAAI,CAAC,cAAc,CAAC,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC;KACvE;;;;IAMD,MAAM,gBAAgB;QAClB,OAAO,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC;KAC5D;IAED,iBAAiB;QACb,IAAI,CAAC,gBAAgB,EAAE,CAAC;KAC3B;IAGO,gBAAgB;QACpB,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI;YAC5B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;SACrB,CAAC,CAAC;KACN;;;;IAkBD,qBAAqB,CAAC,KAA4C;QAC9D,IAAI,CAAC,gBAAgB,EAAE,CAAC;QACxB,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,MAAM,CAAC;QAE3C,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YACb,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,IAAI;gBAC5B,IAAI,IAAI,KAAK,MAAM,EAAE;oBACjB,IAAI,CAAC,QAAQ,EAAE,CAAC;iBACnB;gBACD,IAAI,CAAC,QAAQ,GAAG,IAAI,KAAK,MAAM,GAAG,QAAQ,GAAG,KAAK,CAAC;aACtD,CAAC,CAAC;SACN;QAED,MAAM,aAAa,GAAG,IAAI,CAAC,cAAc,CAAC,MAAM,CAAC,IAAI,IAAI,IAAI,CAAC,QAAQ,CAAC,CAAC;QACxE,IAAI,CAAC,uBAAuB,CAAC,IAAI,CAAC;YAC9B,QAAQ;YACR,OAAO,EAAE,MAAM;YACf,aAAa;YACb,aAAa,EAAE,aAAa,CAAC,MAAM;SACtC,CAAC,CAAC;KACN;IAED,MAAM;QACF,QACI,4DACI,KAAK,EAAC,0HAA0H,EAChI,IAAI,EAAC,OAAO,gBACD,iBAAiB,IAE5B,6DAAM,YAAY,EAAE,IAAI,CAAC,gBAAgB,GAAS,CAChD,EACR;KACL;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["BcmAccordionGroup"],"sources":["src/components/accordion-group/accordion-group.css?tag=bcm-accordion-group&encapsulation=shadow","src/components/accordion-group/accordion-group.component.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n --bcm-accordion-border: var(--bcm-ui-color-border-default);\n --bcm-accordion-radius: 6px;\n}\n","\nimport { Component, ComponentInterface, h, Element, Prop, Listen, State, Event, EventEmitter, Method } from '@stencil/core';\nimport { AccordionChangeEventType } from '../accordion/types';\nimport { AccordionGroupChangeEventType } from './types';\n\n/**\n* @component BcmAccordionGroup\n* @description A container component that manages a group of accordions. Provides single/multiple expansion \n* modes and methods for controlling all accordions simultaneously. Uses shadow DOM for style encapsulation.\n*\n* @example Basic usage - Single expansion mode\n* <bcm-accordion-group>\n* <bcm-accordion>\n* <div slot=\"title\">Section 1</div>\n* <div>Content 1</div>\n* </bcm-accordion>\n* <bcm-accordion>\n* <div slot=\"title\">Section 2</div>\n* <div>Content 2</div>\n* </bcm-accordion>\n* </bcm-accordion-group>\n*\n* @example Multiple expansion mode\n* <bcm-accordion-group multi={true}>\n* <bcm-accordion>...</bcm-accordion>\n* <bcm-accordion>...</bcm-accordion>\n* </bcm-accordion-group>\n* \n* @example Event handling\n* // Listen to accordion group changes\n* const accordionGroup = document.querySelector('bcm-accordion-group');\n* accordionGroup.addEventListener('bcmAccordionGroupChange', (event) => {\n* const { expanded, changed, expandedItems, expandedCount } = event.detail;\n* console.log('Accordion expanded state:', expanded);\n* console.log('Changed accordion:', changed);\n* console.log('Currently expanded accordions:', expandedItems);\n* console.log('Number of expanded accordions:', expandedCount);\n* });\n* \n* // Using methods\n* await accordionGroup.expandAll(); // Expands all accordions (only in multi mode)\n* await accordionGroup.collapseAll(); // Collapses all accordions\n* const expanded = await accordionGroup.getExpandedItems(); // Gets expanded accordions\n*\n* @prop {boolean} multi - Controls whether multiple accordions can be expanded simultaneously (default: false)\n*\n* @slot default - Container slot for bcm-accordion components\n*\n* @event {EventEmitter<AccordionGroupChangeEventType>} bcmAccordionGroupChange - Emitted when any accordion's state changes\n* @eventProperty {boolean} expanded - Current expanded state of the changed accordion\n* @eventProperty {HTMLElement} changed - The accordion element that triggered the change\n* @eventProperty {HTMLElement[]} expandedItems - Array of currently expanded accordion elements\n* @eventProperty {number} expandedCount - Number of currently expanded accordions\n*\n* @method expandAll() - Expands all accordions (only available in multi mode)\n* @method collapseAll() - Collapses all accordions\n* @method getExpandedItems() - Returns array of currently expanded accordions\n*\n* @csspart container - The accordion group container element\n*\n* @css {string} --bcm-accordion-border - Border color of the accordion group\n* @css {string} --bcm-accordion-radius - Border radius of the accordion group\n*/\n@Component({\n tag: 'bcm-accordion-group',\n styleUrl: 'accordion-group.css',\n shadow: true,\n})\nexport class BcmAccordionGroup implements ComponentInterface {\n /** Reference to the host element */\n @Element() host: HTMLElement;\n\n /** Controls whether multiple accordions can be expanded simultaneously */\n @Prop() multi: boolean = false;\n\n /** Array of accordion elements within the group */\n @State() accordionItems: HTMLBcmAccordionElement[] = [];\n\n /** Event emitted when any accordion's expanded state changes */\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n }) bcmAccordionGroupChange: EventEmitter<AccordionGroupChangeEventType>;\n\n /**\n * Expands all accordions in the group\n * Only available when multi=true\n */\n @Method()\n async expandAll(): Promise<void> {\n if (!this.multi) {\n console.warn('expandAll is only available when multi=true');\n return;\n }\n await Promise.all(this.accordionItems.map(item => item.expand()));\n }\n\n /**\n * Collapses all accordions in the group\n */\n @Method()\n async collapseAll(): Promise<void> {\n await Promise.all(this.accordionItems.map(item => item.collapse()));\n }\n\n /**\n * Returns an array of currently expanded accordion elements\n */\n @Method()\n async getExpandedItems(): Promise<HTMLBcmAccordionElement[]> {\n return this.accordionItems.filter(item => item.expanded);\n }\n\n componentWillLoad() {\n this.handleSlotChange();\n }\n\n\n private setGroupBehavior(): void {\n this.accordionItems.forEach(item => {\n item.group = true;\n });\n }\n\n /**\n * Updates the accordion items array when slot content changes\n */\n private handleSlotChange = () => {\n this.accordionItems = Array.from(this.host.querySelectorAll('bcm-accordion'));\n this.setGroupBehavior();\n // Validate accordion items\n if (this.accordionItems.length === 0) {\n console.warn('No accordion items found in accordion group');\n }\n };\n\n /**\n * Handles state changes of individual accordions\n */\n @Listen('bcmAccordionChange', { capture: true })\n handleAccordionChange(event: CustomEvent<AccordionChangeEventType>) {\n this.handleSlotChange();\n const { expanded, source } = event?.detail;\n\n if (!this.multi) {\n this.accordionItems.forEach(item => {\n if (item !== source) {\n item.collapse();\n }\n item.expanded = item === source ? expanded : false;\n });\n }\n\n const expandedItems = this.accordionItems.filter(item => item.expanded);\n this.bcmAccordionGroupChange.emit({\n expanded,\n changed: source,\n expandedItems,\n expandedCount: expandedItems.length,\n });\n }\n\n render() {\n return (\n <div\n class=\"flex flex-col bcm-ui-element w-full border border-solid border-[--bcm-accordion-border] rounded-[--bcm-accordion-radius]\"\n role=\"group\"\n aria-label=\"Accordion group\"\n >\n <slot onSlotchange={this.handleSlotChange}></slot>\n </div>\n );\n }\n}"],"version":3}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, c as createEvent, h } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, c as createEvent, h } from './p-13582168.js';
|
|
2
2
|
import { c as ce } from './p-5fcf77f9.js';
|
|
3
3
|
|
|
4
|
-
const accordionCss = "
|
|
4
|
+
const accordionCss = ".block{display:block}.flex{display:flex}.border{border-width:1px}:host{--bcm-accordion-bg:var(--bcm-ui-color-background-basic-panel);--bcm-accordion-content-bg:var(--bcm-ui-color-background-basic-base);--bcm-accordion-text:var(--bcm-ui-color-text-header);--bcm-accordion-border:var(--bcm-ui-color-border-default);--bcm-accordion-radius:6px;--bcm-accordion-footer-bg:var(--bcm-ui-color-background-default-default);display:block;width:100%}:host(:not([group])) .accordion-container{border:1px solid var(--bcm-accordion-border);border-radius:var(--bcm-accordion-radius)}:host([group]) .accordion-container{border-bottom:1px solid var(--bcm-accordion-border);border-radius:0}:host([group]:last-of-type) .accordion-container{border-bottom:none}:host([group]:first-of-type) .accordion-container{border-top-left-radius:var(--bcm-accordion-radius);border-top-right-radius:var(--bcm-accordion-radius)}:host([group]:last-of-type) .accordion-footer{border-bottom-left-radius:var(--bcm-accordion-radius);border-bottom-right-radius:var(--bcm-accordion-radius)}:host(:not([group])) .accordion-footer{border-bottom-left-radius:var(--bcm-accordion-radius);border-bottom-right-radius:var(--bcm-accordion-radius)}::slotted([slot=title]){align-items:center;display:flex;flex-direction:row;gap:10px}::slotted([slot=actions]){align-items:center;display:flex;flex-direction:row;gap:12px}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.collapse{visibility:collapse}.static{position:static}.hidden{display:none}.w-full{width:100%}.min-w-max{min-width:max-content}.rotate-0{--tw-rotate:0deg}.rotate-0,.rotate-180{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-180{--tw-rotate:180deg}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.flex-row{flex-direction:row}.flex-col{flex-direction:column}.flex-nowrap{flex-wrap:nowrap}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-2\\.5{gap:.625rem}.overflow-hidden{overflow:hidden}.text-wrap{text-wrap:wrap}.rounded-\\[--bcm-accordion-radius\\]{border-radius:var(--bcm-accordion-radius)}.bg-\\[--bcm-accordion-bg\\]{background-color:var(--bcm-accordion-bg)}.bg-\\[--bcm-accordion-footer-bg\\]{background-color:var(--bcm-accordion-footer-bg)}.p-4{padding:1rem}.px-4{padding-left:1rem;padding-right:1rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.font-normal{font-weight:400}.font-semibold{font-weight:600}.text-\\[--bcm-accordion-text\\]{color:var(--bcm-accordion-text)}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-transform{transition-duration:.15s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}";
|
|
5
5
|
const BcmAccordionStyle0 = accordionCss;
|
|
6
6
|
|
|
7
7
|
const BcmAccordion$1 = /*@__PURE__*/ proxyCustomElement(class BcmAccordion extends H {
|
|
@@ -40,10 +40,10 @@ const BcmAccordion$1 = /*@__PURE__*/ proxyCustomElement(class BcmAccordion exten
|
|
|
40
40
|
};
|
|
41
41
|
this.accordionClass = ce({
|
|
42
42
|
slots: {
|
|
43
|
-
container: 'accordion-container flex flex-col bcm-ui-element w-full
|
|
44
|
-
header: 'accordion-header flex flex-row justify-between gap-2 p-4 w-
|
|
43
|
+
container: 'accordion-container flex flex-col bcm-ui-element w-full',
|
|
44
|
+
header: 'accordion-header flex flex-row justify-between gap-2 p-4 min-w-max flex-nowrap text-wrap rounded-[--bcm-accordion-radius] bg-[--bcm-accordion-bg] text-[--bcm-accordion-text] font-semibold text-size-6 cursor-pointer',
|
|
45
45
|
content: 'accordion-content overflow-hidden transition-all duration-300 ease-in-out bg-color-basic-base',
|
|
46
|
-
footer: 'accordion-footer flex flex-row
|
|
46
|
+
footer: 'accordion-footer flex flex-row flex-nowrap bg-[--bcm-accordion-footer-bg] text-[--bcm-accordion-text] px-4 py-2 gap-2 text-size-4 font-normal min-w-max',
|
|
47
47
|
icon: 'accordion-icon cursor-pointer transform transition-transform duration-300',
|
|
48
48
|
rightSection: 'accordion-right-section flex flex-row gap-2.5 items-center',
|
|
49
49
|
},
|
|
@@ -110,12 +110,12 @@ const BcmAccordion$1 = /*@__PURE__*/ proxyCustomElement(class BcmAccordion exten
|
|
|
110
110
|
hasFooterContent: this.hasFooterContent || !!this.hintText,
|
|
111
111
|
expanded: this.expanded,
|
|
112
112
|
});
|
|
113
|
-
return (h("div", { key: '
|
|
113
|
+
return (h("div", { key: '5db020dbcdd3eea89865e0da775aecc79d6e8e52', class: container() }, h("header", { key: 'e9a792911fea8dc6bd1f832a3f4ed9210bd5f1bf', class: header(), role: "button", tabindex: "0", "aria-expanded": this.expanded.toString(), "aria-controls": "accordion-content", onKeyDown: e => {
|
|
114
114
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
115
115
|
e.preventDefault();
|
|
116
116
|
this.toggle();
|
|
117
117
|
}
|
|
118
|
-
}, onClick: () => this.toggle() }, h("slot", { key: '
|
|
118
|
+
}, onClick: () => this.toggle() }, h("slot", { key: '2662c77cd56d3708e60bf09e085710587d9e2b37', name: "title" }, this.headerTitle), h("div", { key: 'af9c679afb9688bbf0634b3057888fdf49a2bdc3', class: rightSection() }, h("span", { key: 'c06ea66737e34ffa1f79e2fa36618eb90c5dd801', onClick: e => e.stopPropagation() }, h("slot", { key: '8668f76dbf3967518332a188a5fef5e9bc160a0e', name: "actions" })), h("bcm-icon", { key: '870460d228f6ae0ff9de5b36dab05e0587124cc4', name: "fa-regular fa-chevron-down", class: icon() }))), h("div", { key: '814408b9602a7045addd1040271328d372ce23ba', class: content(), style: { maxHeight: this.expanded ? 'auto' : '0px' }, ref: el => (this.contentEl = el) }, h("div", { key: 'be99ad1f7b4864c7cfe9b87044197c21770b84f2', class: "px-4 py-2" }, h("slot", { key: '49e0af56da6775b74f3915dd696270bcc077e171' })), h("footer", { key: '6339e900da8224563d94a787cffe253703874568', class: footer() }, h("slot", { key: '19027ba2389ff5677b1610b4430ab671bda2f95e', name: "footer", onSlotchange: this.handleFooterSlotChange }, this.hintText)))));
|
|
119
119
|
}
|
|
120
120
|
get host() { return this; }
|
|
121
121
|
static get style() { return BcmAccordionStyle0; }
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"bcm-accordion.js","mappings":"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","names":["BcmAccordion","tv"],"sources":["src/components/accordion/accordion.css?tag=bcm-accordion&encapsulation=shadow","src/components/accordion/accordion.component.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n --bcm-accordion-bg: var(--bcm-ui-color-background-basic-panel);\n --bcm-accordion-content-bg: var(--bcm-ui-color-background-basic-base);\n --bcm-accordion-text: var(--bcm-ui-color-text-header);\n --bcm-accordion-border: var(--bcm-ui-color-border-default);\n --bcm-accordion-radius: 6px;\n --bcm-accordion-footer-bg: var(--bcm-ui-color-background-default-default);\n}\n\n:host(:not([group])) .accordion-container {\n border: 1px solid var(--bcm-accordion-border);\n border-radius: var(--bcm-accordion-radius);\n}\n\n:host([group]) .accordion-container {\n border-bottom: 1px solid var(--bcm-accordion-border);\n border-radius: 0;\n}\n\n:host([group]:last-of-type) .accordion-container {\n border-bottom: none;\n}\n\n:host([group]:first-of-type) .accordion-container {\n border-top-left-radius: var(--bcm-accordion-radius);\n border-top-right-radius: var(--bcm-accordion-radius);\n}\n\n:host([group]:last-of-type) .accordion-footer {\n border-bottom-left-radius: var(--bcm-accordion-radius);\n border-bottom-right-radius: var(--bcm-accordion-radius);\n}\n\n:host(:not([group])) .accordion-footer {\n border-bottom-left-radius: var(--bcm-accordion-radius);\n border-bottom-right-radius: var(--bcm-accordion-radius);\n}\n\n::slotted([slot='title']) {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 10px;\n}\n::slotted([slot='actions']) {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 12px;\n}\n","import { Component, ComponentInterface, EventEmitter, h, Method, Prop, Event, State, Element } from '@stencil/core';\nimport { tv } from 'tailwind-variants';\nimport { AccordionChangeEventType } from './types';\n\n/**\n * @component BcmAccordion\n * @description A collapsible accordion component that provides expandable/collapsible content sections with keyboard navigation\n * and accessibility features. Offers customizable header, content, and footer areas through slots.\n *\n * @example Basic usage\n * <bcm-accordion>\n * <div slot=\"title\">Accordion Title</div>\n * <div>Content goes here</div>\n * </bcm-accordion>\n *\n * @example With all slots and hint text\n * <bcm-accordion hint-text=\"Additional information\">\n * <div slot=\"title\">Title</div>\n * <div slot=\"actions\">\n * <button>Action</button>\n * </div>\n * <div>Main content</div>\n * <div slot=\"footer\">Footer content</div>\n * </bcm-accordion>\n *\n * @example Event handling\n * // Listen to accordion state changes\n * const accordion = document.querySelector('bcm-accordion');\n * accordion.addEventListener('bcmAccordionChange', (event) => {\n * const { expanded, source } = event.detail;\n * console.log('Accordion expanded:', expanded);\n * console.log('Changed accordion:', source);\n * });\n *\n * // Programmatically control accordion\n * await accordion.toggle(); // Toggle state\n * await accordion.expand(); // Expand accordion\n * await accordion.collapse(); // Collapse accordion\n *\n * @prop {boolean} expanded - Controls the expanded state of the accordion (default: false)\n * @prop {boolean} group - Indicates if the accordion is part of an accordion group (default: false)\n * @prop {string} hintText - Optional hint text to display in the footer when no footer content is provided\n *\n * @slot title - Primary title content for the accordion header (required)\n * @slot actions - Additional actions to be displayed in the header (optional)\n * @slot default - Main content area of the accordion\n * @slot footer - Optional footer content (overrides hint-text if provided)\n *\n * @event {EventEmitter<AccordionChangeEventType>} bcmAccordionChange - Emitted when the accordion's expanded state changes\n * @eventProperty {boolean} expanded - Current expanded state\n * @eventProperty {HTMLBcmAccordionElement} source - Reference to the accordion element that changed\n *\n * @csspart container - The root container element\n * @csspart header - The header section with title and actions\n * @csspart content - The collapsible content section\n * @csspart footer - The footer section with hint text or footer slot\n * @csspart section - Container for header content sections\n * @csspart icon - The expand/collapse chevron icon\n *\n * @css {string} --bcm-accordion-radius - Border radius of the accordion header (default: 4px)\n * @css {string} --bcm-accordion-bg - Background color of the accordion header\n * @css {string} --bcm-accordion-text - Text color of the accordion\n * @css {string} --bcm-accordion-footer-bg - Background color of the footer section\n *\n * @methods\n * toggle() - Toggles the accordion's expanded state\n * expand() - Expands the accordion if collapsed\n * collapse() - Collapses the accordion if expanded\n */\n@Component({\n tag: 'bcm-accordion',\n styleUrl: 'accordion.css',\n shadow: true,\n})\nexport class BcmAccordion implements ComponentInterface {\n /** Reference to the host element */\n @Element() host: HTMLElement;\n\n /**\n * Controls whether the accordion is expanded or collapsed.\n * @prop\n * @defaultValue false\n */\n @Prop({ reflect: true, mutable: true })\n expanded: boolean = false;\n\n /**\n * Optional title text to display in the header.\n * @prop\n * @defaultValue undefined\n */\n @Prop()\n headerTitle?: string;\n\n /**\n * Indicates if the accordion is part of a group.\n * Used for group behavior coordination.\n * @prop\n * @defaultValue false\n */\n\n @Prop({ reflect: true })\n group: boolean = false;\n\n /**\n * Optional text to display in the footer when no footer slot content is provided.\n * @prop\n */\n @Prop({ attribute: 'hint-text' })\n hintText?: string;\n\n /**\n * Tracks whether footer content is present.\n * @state\n */\n @State()\n hasFooterContent: boolean = false;\n\n /**\n * Emitted when the accordion's expanded state changes.\n * @event\n */\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n eventName: 'bcmAccordionChange',\n })\n bcmAccordionChange: EventEmitter<AccordionChangeEventType>;\n\n private contentEl?: HTMLElement;\n\n /**\n * Toggles the accordion's expanded state.\n * @method\n * @returns Promise<void>\n */\n @Method()\n async toggle(): Promise<void> {\n this.expanded = !this.expanded;\n this.updateAccordion();\n }\n\n /**\n * Expands the accordion if it's not already expanded.\n * @method\n * @returns Promise<void>\n */\n @Method()\n async expand(): Promise<void> {\n if (!this.expanded) {\n this.expanded = true;\n this.updateAccordion();\n }\n }\n\n /**\n * Collapses the accordion if it's currently expanded.\n * @method\n * @returns Promise<void>\n */\n @Method()\n async collapse(): Promise<void> {\n if (this.expanded) {\n this.expanded = false;\n this.updateAccordion();\n }\n }\n\n /**\n * Updates the accordion's content height and emits change event.\n * @private\n */\n private updateAccordion(): void {\n if (this.contentEl) {\n this.contentEl.style.maxHeight = this.expanded ? `${this.contentEl.scrollHeight}px` : '0px';\n }\n this.bcmAccordionChange.emit({ expanded: this.expanded, source: this.host as HTMLBcmAccordionElement });\n }\n\n /**\n * Handles changes to the footer slot content.\n * @private\n * @param e - Slot change event\n */\n private handleFooterSlotChange = (e: Event) => {\n const slot = e.target as HTMLSlotElement;\n const assignedNodes = slot.assignedNodes();\n this.hasFooterContent = assignedNodes.length > 0;\n };\n\n private accordionClass = tv(\n {\n slots: {\n container: 'accordion-container flex flex-col bcm-ui-element w-full ',\n header:\n 'accordion-header flex flex-row justify-between gap-2 p-4 w-full flex-nowrap rounded-[--bcm-accordion-radius] bg-[--bcm-accordion-bg] text-[--bcm-accordion-text] font-semibold text-size-6 cursor-pointer',\n content: 'accordion-content overflow-hidden transition-all duration-300 ease-in-out bg-color-basic-base',\n footer: 'accordion-footer flex flex-row w-full flex-nowrap bg-[--bcm-accordion-footer-bg] text-[--bcm-accordion-text] px-4 py-2 gap-2 text-size-4 font-normal',\n icon: 'accordion-icon cursor-pointer transform transition-transform duration-300',\n rightSection: 'accordion-right-section flex flex-row gap-2.5 items-center',\n },\n variants: {\n hasFooterContent: {\n false: { footer: 'hidden' },\n true: { footer: 'flex' },\n },\n expanded: {\n true: { icon: 'rotate-180' },\n false: {\n icon: 'rotate-0',\n content: '',\n },\n },\n },\n },\n {\n twMerge: false,\n },\n );\n\n render() {\n const { container, header, content, footer, icon, rightSection } = this.accordionClass({\n hasFooterContent: this.hasFooterContent || !!this.hintText,\n expanded: this.expanded,\n });\n\n return (\n <div class={container()}>\n {/* Header */}\n <header\n class={header()}\n role=\"button\"\n tabindex=\"0\"\n aria-expanded={this.expanded.toString()}\n aria-controls=\"accordion-content\"\n onKeyDown={e => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n this.toggle();\n }\n }}\n onClick={() => this.toggle()}\n >\n <slot name=\"title\">{this.headerTitle}</slot>\n {/* Actions */}\n <div class={rightSection()}>\n <span onClick={e => e.stopPropagation()}>\n <slot name=\"actions\"></slot>\n </span>\n <bcm-icon name=\"fa-regular fa-chevron-down\" class={icon()}></bcm-icon>\n </div>\n </header>\n {/* Content */}\n <div class={content()} style={{ maxHeight: this.expanded ? 'auto' : '0px' }} ref={el => (this.contentEl = el as HTMLElement)}>\n <div class=\"px-4 py-2\">\n <slot></slot>\n </div>\n <footer class={footer()}>\n <slot name=\"footer\" onSlotchange={this.handleFooterSlotChange}>\n {this.hintText}\n </slot>\n </footer>\n </div>\n </div>\n );\n }\n}\n"],"version":3}
|
|
1
|
+
{"file":"bcm-accordion.js","mappings":"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","names":["BcmAccordion","tv"],"sources":["src/components/accordion/accordion.css?tag=bcm-accordion&encapsulation=shadow","src/components/accordion/accordion.component.tsx"],"sourcesContent":[":host {\n display: block;\n width: 100%;\n --bcm-accordion-bg: var(--bcm-ui-color-background-basic-panel);\n --bcm-accordion-content-bg: var(--bcm-ui-color-background-basic-base);\n --bcm-accordion-text: var(--bcm-ui-color-text-header);\n --bcm-accordion-border: var(--bcm-ui-color-border-default);\n --bcm-accordion-radius: 6px;\n --bcm-accordion-footer-bg: var(--bcm-ui-color-background-default-default);\n}\n\n:host(:not([group])) .accordion-container {\n border: 1px solid var(--bcm-accordion-border);\n border-radius: var(--bcm-accordion-radius);\n}\n\n:host([group]) .accordion-container {\n border-bottom: 1px solid var(--bcm-accordion-border);\n border-radius: 0;\n}\n\n:host([group]:last-of-type) .accordion-container {\n border-bottom: none;\n}\n\n:host([group]:first-of-type) .accordion-container {\n border-top-left-radius: var(--bcm-accordion-radius);\n border-top-right-radius: var(--bcm-accordion-radius);\n}\n\n:host([group]:last-of-type) .accordion-footer {\n border-bottom-left-radius: var(--bcm-accordion-radius);\n border-bottom-right-radius: var(--bcm-accordion-radius);\n}\n\n:host(:not([group])) .accordion-footer {\n border-bottom-left-radius: var(--bcm-accordion-radius);\n border-bottom-right-radius: var(--bcm-accordion-radius);\n}\n\n::slotted([slot='title']) {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 10px;\n}\n::slotted([slot='actions']) {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: 12px;\n}\n","import { Component, ComponentInterface, EventEmitter, h, Method, Prop, Event, State, Element } from '@stencil/core';\nimport { tv } from 'tailwind-variants';\nimport { AccordionChangeEventType } from './types';\n\n/**\n * @component BcmAccordion\n * @description A collapsible accordion component that provides expandable/collapsible content sections with keyboard navigation\n * and accessibility features. Offers customizable header, content, and footer areas through slots.\n *\n * @example Basic usage\n * <bcm-accordion>\n * <div slot=\"title\">Accordion Title</div>\n * <div>Content goes here</div>\n * </bcm-accordion>\n *\n * @example With all slots and hint text\n * <bcm-accordion hint-text=\"Additional information\">\n * <div slot=\"title\">Title</div>\n * <div slot=\"actions\">\n * <button>Action</button>\n * </div>\n * <div>Main content</div>\n * <div slot=\"footer\">Footer content</div>\n * </bcm-accordion>\n *\n * @example Event handling\n * // Listen to accordion state changes\n * const accordion = document.querySelector('bcm-accordion');\n * accordion.addEventListener('bcmAccordionChange', (event) => {\n * const { expanded, source } = event.detail;\n * console.log('Accordion expanded:', expanded);\n * console.log('Changed accordion:', source);\n * });\n *\n * // Programmatically control accordion\n * await accordion.toggle(); // Toggle state\n * await accordion.expand(); // Expand accordion\n * await accordion.collapse(); // Collapse accordion\n *\n * @prop {boolean} expanded - Controls the expanded state of the accordion (default: false)\n * @prop {boolean} group - Indicates if the accordion is part of an accordion group (default: false)\n * @prop {string} hintText - Optional hint text to display in the footer when no footer content is provided\n *\n * @slot title - Primary title content for the accordion header (required)\n * @slot actions - Additional actions to be displayed in the header (optional)\n * @slot default - Main content area of the accordion\n * @slot footer - Optional footer content (overrides hint-text if provided)\n *\n * @event {EventEmitter<AccordionChangeEventType>} bcmAccordionChange - Emitted when the accordion's expanded state changes\n * @eventProperty {boolean} expanded - Current expanded state\n * @eventProperty {HTMLBcmAccordionElement} source - Reference to the accordion element that changed\n *\n * @csspart container - The root container element\n * @csspart header - The header section with title and actions\n * @csspart content - The collapsible content section\n * @csspart footer - The footer section with hint text or footer slot\n * @csspart section - Container for header content sections\n * @csspart icon - The expand/collapse chevron icon\n *\n * @css {string} --bcm-accordion-radius - Border radius of the accordion header (default: 4px)\n * @css {string} --bcm-accordion-bg - Background color of the accordion header\n * @css {string} --bcm-accordion-text - Text color of the accordion\n * @css {string} --bcm-accordion-footer-bg - Background color of the footer section\n *\n * @methods\n * toggle() - Toggles the accordion's expanded state\n * expand() - Expands the accordion if collapsed\n * collapse() - Collapses the accordion if expanded\n */\n@Component({\n tag: 'bcm-accordion',\n styleUrl: 'accordion.css',\n shadow: true,\n})\nexport class BcmAccordion implements ComponentInterface {\n /** Reference to the host element */\n @Element() host: HTMLElement;\n\n /**\n * Controls whether the accordion is expanded or collapsed.\n * @prop\n * @defaultValue false\n */\n @Prop({ reflect: true, mutable: true })\n expanded: boolean = false;\n\n /**\n * Optional title text to display in the header.\n * @prop\n * @defaultValue undefined\n */\n @Prop()\n headerTitle?: string;\n\n /**\n * Indicates if the accordion is part of a group.\n * Used for group behavior coordination.\n * @prop\n * @defaultValue false\n */\n\n @Prop({ reflect: true })\n group: boolean = false;\n\n /**\n * Optional text to display in the footer when no footer slot content is provided.\n * @prop\n */\n @Prop({ attribute: 'hint-text' })\n hintText?: string;\n\n /**\n * Tracks whether footer content is present.\n * @state\n */\n @State()\n hasFooterContent: boolean = false;\n\n /**\n * Emitted when the accordion's expanded state changes.\n * @event\n */\n @Event({\n composed: false,\n bubbles: false,\n cancelable: true,\n eventName: 'bcmAccordionChange',\n })\n bcmAccordionChange: EventEmitter<AccordionChangeEventType>;\n\n private contentEl?: HTMLElement;\n\n /**\n * Toggles the accordion's expanded state.\n * @method\n * @returns Promise<void>\n */\n @Method()\n async toggle(): Promise<void> {\n this.expanded = !this.expanded;\n this.updateAccordion();\n }\n\n /**\n * Expands the accordion if it's not already expanded.\n * @method\n * @returns Promise<void>\n */\n @Method()\n async expand(): Promise<void> {\n if (!this.expanded) {\n this.expanded = true;\n this.updateAccordion();\n }\n }\n\n /**\n * Collapses the accordion if it's currently expanded.\n * @method\n * @returns Promise<void>\n */\n @Method()\n async collapse(): Promise<void> {\n if (this.expanded) {\n this.expanded = false;\n this.updateAccordion();\n }\n }\n\n /**\n * Updates the accordion's content height and emits change event.\n * @private\n */\n private updateAccordion(): void {\n if (this.contentEl) {\n this.contentEl.style.maxHeight = this.expanded ? `${this.contentEl.scrollHeight}px` : '0px';\n }\n this.bcmAccordionChange.emit({ expanded: this.expanded, source: this.host as HTMLBcmAccordionElement });\n }\n\n /**\n * Handles changes to the footer slot content.\n * @private\n * @param e - Slot change event\n */\n private handleFooterSlotChange = (e: Event) => {\n const slot = e.target as HTMLSlotElement;\n const assignedNodes = slot.assignedNodes();\n this.hasFooterContent = assignedNodes.length > 0;\n };\n\n private accordionClass = tv(\n {\n slots: {\n container: 'accordion-container flex flex-col bcm-ui-element w-full',\n header:\n 'accordion-header flex flex-row justify-between gap-2 p-4 min-w-max flex-nowrap text-wrap rounded-[--bcm-accordion-radius] bg-[--bcm-accordion-bg] text-[--bcm-accordion-text] font-semibold text-size-6 cursor-pointer',\n content: 'accordion-content overflow-hidden transition-all duration-300 ease-in-out bg-color-basic-base',\n footer: 'accordion-footer flex flex-row flex-nowrap bg-[--bcm-accordion-footer-bg] text-[--bcm-accordion-text] px-4 py-2 gap-2 text-size-4 font-normal min-w-max',\n icon: 'accordion-icon cursor-pointer transform transition-transform duration-300',\n rightSection: 'accordion-right-section flex flex-row gap-2.5 items-center',\n },\n variants: {\n hasFooterContent: {\n false: { footer: 'hidden' },\n true: { footer: 'flex' },\n },\n expanded: {\n true: { icon: 'rotate-180' },\n false: {\n icon: 'rotate-0',\n content: '',\n },\n },\n },\n },\n {\n twMerge: false,\n },\n );\n\n render() {\n const { container, header, content, footer, icon, rightSection } = this.accordionClass({\n hasFooterContent: this.hasFooterContent || !!this.hintText,\n expanded: this.expanded,\n });\n\n return (\n <div class={container()}>\n {/* Header */}\n <header\n class={header()}\n role=\"button\"\n tabindex=\"0\"\n aria-expanded={this.expanded.toString()}\n aria-controls=\"accordion-content\"\n onKeyDown={e => {\n if (e.key === 'Enter' || e.key === ' ') {\n e.preventDefault();\n this.toggle();\n }\n }}\n onClick={() => this.toggle()}\n >\n <slot name=\"title\">{this.headerTitle}</slot>\n {/* Actions */}\n <div class={rightSection()}>\n <span onClick={e => e.stopPropagation()}>\n <slot name=\"actions\"></slot>\n </span>\n <bcm-icon name=\"fa-regular fa-chevron-down\" class={icon()}></bcm-icon>\n </div>\n </header>\n {/* Content */}\n <div class={content()} style={{ maxHeight: this.expanded ? 'auto' : '0px' }} ref={el => (this.contentEl = el as HTMLElement)}>\n <div class=\"px-4 py-2\">\n <slot></slot>\n </div>\n <footer class={footer()}>\n <slot name=\"footer\" onSlotchange={this.handleFooterSlotChange}>\n {this.hintText}\n </slot>\n </footer>\n </div>\n </div>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, c as createEvent, h } from './p-
|
|
1
|
+
import { p as proxyCustomElement, H, c as createEvent, h } from './p-13582168.js';
|
|
2
2
|
import { c as ce } from './p-5fcf77f9.js';
|
|
3
3
|
|
|
4
|
-
const alertCss = "
|
|
4
|
+
const alertCss = ":host{--bcm-alert-bg:var(--bcm-ui-color-background-default-default);--bcm-alert-text:var(--bcm-ui-color-text-default);--bcm-alert-radius:6px;display:inline-block;width:100%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.flex{display:flex}.w-full{width:100%}.cursor-pointer{cursor:pointer}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-2{gap:.5rem}.gap-3{gap:.75rem}.rounded-\\[--bcm-alert-radius\\]{border-radius:var(--bcm-alert-radius)}.bg-\\[--bcm-alert-bg\\]{background-color:var(--bcm-alert-bg)}.px-3{padding-left:.75rem;padding-right:.75rem}.py-1\\.5{padding-bottom:.375rem;padding-top:.375rem}.py-2{padding-bottom:.5rem;padding-top:.5rem}.py-2\\.5{padding-bottom:.625rem;padding-top:.625rem}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.font-medium{font-weight:500}.text-\\[--bcm-alert-text\\]{color:var(--bcm-alert-text)}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}";
|
|
5
5
|
const BcmAlertStyle0 = alertCss;
|
|
6
6
|
|
|
7
7
|
const BcmAlert$1 = /*@__PURE__*/ proxyCustomElement(class BcmAlert extends H {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"bcm-alert.js","mappings":";;;AAAA,MAAM,QAAQ,GAAG,
|
|
1
|
+
{"file":"bcm-alert.js","mappings":"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","names":["BcmAlert","tv"],"sources":["src/components/alert/alert.css?tag=bcm-alert&encapsulation=shadow","src/components/alert/alert.component.tsx"],"sourcesContent":[":host {\n display: inline-block;\n width: 100%;\n --bcm-alert-bg: var(--bcm-ui-color-background-default-default);\n --bcm-alert-text: var(--bcm-ui-color-text-default);\n --bcm-alert-radius: 6px;\n}\n","import { Component, ComponentInterface, h, Prop, Event, EventEmitter } from '@stencil/core';\nimport { AlertKind, AlertSize, AlertStatus } from './types';\nimport { tv } from 'tailwind-variants';\n\n\n/**\n * Alert component that displays messages with different statuses and styles\n * @class BcmAlert\n */\n@Component({\n tag: 'bcm-alert',\n styleUrl: 'alert.css',\n shadow: true,\n})\nexport class BcmAlert implements ComponentInterface {\n /** Alert status type */\n @Prop()\n status?: AlertStatus = 'default';\n\n /** Alert size variant */\n @Prop()\n size?: AlertSize = 'medium';\n\n /** Alert style variant */\n @Prop()\n kind?: AlertKind = 'filled';\n\n /** Whether alert can be dismissed */\n @Prop()\n dismissible?: boolean = true;\n\n /** Whether to show status icon */\n @Prop()\n showStatusIcon?: boolean = true;\n\n @Event() bcmDismiss: EventEmitter<void>;\n\n\n /**\n * Handles alert dismissal\n * @private\n */\n private onDismiss() {\n this.bcmDismiss.emit();\n }\n\n private getStatusIcon() {\n const statusIcon = {\n info: 'fa-regular fa-info-circle',\n error: 'fa-regular fa-exclamation-circle',\n warning: 'fa-regular fa-exclamation-triangle',\n success: 'fa-regular fa-check-circle',\n };\n return statusIcon[this.status];\n }\n\n private get alertClass() {\n return tv(\n {\n slots: {\n base: 'alert bcm-ui-element font-medium flex items-center justify-between bg-[--bcm-alert-bg] text-[--bcm-alert-text] rounded-[--bcm-alert-radius] px-3 gap-3 w-full',\n section: 'flex items-center gap-2',\n },\n variants: {\n size: {\n small: {\n base: 'py-1.5 text-size-4',\n },\n medium: {\n base: 'py-2 text-size-5',\n },\n large: {\n base: 'py-2.5 text-size-6',\n },\n },\n },\n },\n {\n twMerge: false,\n },\n );\n }\n\n private get alertStyles() {\n let colorStatus = {\n info: 'var(--bcm-ui-color-background-palette-blue-default)',\n error: 'var(--bcm-ui-color-background-palette-red-default)',\n warning: 'var(--bcm-ui-color-background-palette-yellow-default)',\n success: 'var(--bcm-ui-color-background-palette-green-default)',\n default: 'var(--bcm-ui-color-background-palette-gray-default)',\n };\n\n let textStatusColor = {\n info: 'var(--bcm-ui-color-text-info)',\n error: 'var(--bcm-ui-color-text-error)',\n warning: 'var(--bcm-ui-color-text-warning)',\n success: 'var(--bcm-ui-color-text-success)',\n default: 'var(--bcm-ui-color-text-default)',\n };\n\n let filleStyle = {\n '--bcm-alert-bg': colorStatus[this.status],\n '--bcm-alert-text': textStatusColor[this.status],\n };\n\n let textStyle = {\n '--bcm-alert-bg': 'transparent',\n '--bcm-alert-text': textStatusColor[this.status],\n };\n\n return this.kind === 'filled' ? filleStyle : textStyle;\n }\n\n render() {\n const { base, section } = this.alertClass({ size: this.size });\n return (\n <div role=\"alert\" aria-live=\"assertive\" aria-atomic=\"true\" class={base()} style={this.alertStyles}>\n <div class={section()}>\n {this.showStatusIcon && <bcm-icon icon-name={this.getStatusIcon()}></bcm-icon>}\n <slot></slot>\n </div>\n <div class={section()}>\n <div part=\"action\">\n <slot name=\"action\"></slot>\n </div>\n <span part=\"icon\">{this.dismissible && <bcm-icon onClick={() => this.onDismiss()} class=\"cursor-pointer\" icon-name=\"fa-regular fa-xmark\"></bcm-icon>}</span>\n </div>\n </div>\n );\n }\n}\n"],"version":3}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
|
-
import { p as proxyCustomElement, H, h } from './p-
|
|
2
|
-
import { c as
|
|
1
|
+
import { p as proxyCustomElement, H, h } from './p-13582168.js';
|
|
2
|
+
import { c as classNames } from './p-12360e4c.js';
|
|
3
|
+
import { d as defineCustomElement$2 } from './p-39637e05.js';
|
|
3
4
|
|
|
4
|
-
const avatarCss = "
|
|
5
|
+
const avatarCss = ":host{--bcm-avatar-bg:var(--bcm-ui-color-background-default-default);--bcm-avatar-text:var(--bcm-ui-color-text-default);--bcm-avatar-radius:50%}.bcm-ui-element{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,sans-serif}.static{position:static}.-right-0\\.5{right:-.125rem}.-top-0\\.5{top:-.125rem}.right-0{right:0}.top-0{top:0}.inline-flex{display:inline-flex}.h-10{height:2.5rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-full{height:100%}.w-10{width:2.5rem}.w-6{width:1.5rem}.w-8{width:2rem}.w-full{width:100%}.items-center{align-items:center}.justify-center{justify-content:center}.rounded-\\[--bcm-ui-radius\\]{border-radius:var(--bcm-ui-radius)}.rounded-full{border-radius:9999px}.bg-\\[--bcm-avatar-bg\\]{background-color:var(--bcm-avatar-bg)}.text-size-4{font-size:var(--bcm-ui-font-size-4,14px);line-height:var(--bcm-ui-line-height-4,20px)}.text-size-5{font-size:var(--bcm-ui-font-size-5,16px);line-height:var(--bcm-ui-line-height-5,24px)}.text-size-6{font-size:var(--bcm-ui-font-size-6,18px);line-height:var(--bcm-ui-line-height-6,24px)}.font-medium{font-weight:500}.uppercase{text-transform:uppercase}.text-\\[--bcm-avatar-text\\]{color:var(--bcm-avatar-text)}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}";
|
|
5
6
|
const BcmAvatarStyle0 = avatarCss;
|
|
6
7
|
|
|
7
8
|
const BcmAvatar$1 = /*@__PURE__*/ proxyCustomElement(class BcmAvatar extends H {
|
|
@@ -25,18 +26,18 @@ const BcmAvatar$1 = /*@__PURE__*/ proxyCustomElement(class BcmAvatar extends H {
|
|
|
25
26
|
return initials.substring(0, 2);
|
|
26
27
|
}
|
|
27
28
|
render() {
|
|
28
|
-
const baseClass =
|
|
29
|
+
const baseClass = classNames('bcm-avatar bcm-ui-element bcm-ui-content-display', 'uppercase font-medium', 'inline-flex items-center justify-center', 'bg-[--bcm-avatar-bg] text-[--bcm-avatar-text]', {
|
|
29
30
|
'shape-ellipse rounded-full': this.shape === 'ellipse',
|
|
30
31
|
'shape-square rounded-[--bcm-ui-radius]': this.shape === 'square',
|
|
31
32
|
'size-small text-size-4 w-6 h-6': this.size === 'small',
|
|
32
33
|
'size-medium text-size-5 w-8 h-8': this.size === 'medium',
|
|
33
34
|
'size-large text-size-6 w-10 h-10': this.size === 'large',
|
|
34
35
|
});
|
|
35
|
-
const badgeClass =
|
|
36
|
+
const badgeClass = classNames('badge', {
|
|
36
37
|
'top-0 right-0': this.shape === 'ellipse',
|
|
37
38
|
'-top-0.5 -right-0.5': this.shape === 'square',
|
|
38
39
|
});
|
|
39
|
-
const imageClass =
|
|
40
|
+
const imageClass = classNames('image w-full h-full', {
|
|
40
41
|
'rounded-full': this.shape === 'ellipse',
|
|
41
42
|
'rounded-[--bcm-ui-radius]': this.shape === 'square',
|
|
42
43
|
});
|
|
@@ -96,13 +97,18 @@ function defineCustomElement$1() {
|
|
|
96
97
|
if (typeof customElements === "undefined") {
|
|
97
98
|
return;
|
|
98
99
|
}
|
|
99
|
-
const components = ["bcm-avatar"];
|
|
100
|
+
const components = ["bcm-avatar", "bcm-badge"];
|
|
100
101
|
components.forEach(tagName => { switch (tagName) {
|
|
101
102
|
case "bcm-avatar":
|
|
102
103
|
if (!customElements.get(tagName)) {
|
|
103
104
|
customElements.define(tagName, BcmAvatar$1);
|
|
104
105
|
}
|
|
105
106
|
break;
|
|
107
|
+
case "bcm-badge":
|
|
108
|
+
if (!customElements.get(tagName)) {
|
|
109
|
+
defineCustomElement$2();
|
|
110
|
+
}
|
|
111
|
+
break;
|
|
106
112
|
} });
|
|
107
113
|
}
|
|
108
114
|
defineCustomElement$1();
|