bromcom-ui-next 0.1.30 → 0.1.31

package/dist/collection/components/tabs/tabs.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"tabs.component.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, State, Prop, Element, h, Host, Listen, ComponentInterface, Event, EventEmitter, Watch, Method } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\n/**\n * @description Tab interface component\n * @slot - Default slot for content area\n * @slot tabs-list - Special slot for tab list\n */\n@Component({\n  tag: 'bcm-tabs',\n  styleUrl: 'bcm-tabs.css',\n  shadow: true,\n})\nexport class BcmTabs implements ComponentInterface {\n  @Element() el: HTMLElement;\n\n  /**\n   * Default active tab value\n   */\n  @Prop({ reflect: true })\n  defaultValue: string;\n\n  /**\n   * Tab size\n   */\n  @Prop({ reflect: true })\n  size: 'small' | 'medium' | 'large' = 'medium';\n\n  /**\n   * Tab variant - controls width behavior\n   */\n  @Prop({ reflect: true })\n  variant: 'full-width' | 'auto-width' = 'full-width';\n\n  /**\n   * Whether to enable smooth animations for inkbar and transitions\n   */\n  @Prop({ reflect: true })\n  smooth: boolean = true;\n\n  /**\n   * Triggers when tab changes\n   */\n  @Event({\n    composed: false,\n    bubbles: false,\n    cancelable: true,\n    eventName: 'bcmTabChange',\n  })\n  bcmTabChange: EventEmitter<{\n    activeTab: string;\n    element: HTMLBcmTabsTriggerElement;\n    previousTab?: string;\n  }>;\n\n  /**\n   * Active tab value\n   */\n  @State() activeTab: string;\n\n  /**\n   * Previous active tab value\n   */\n  @State() previousTab: string;\n\n  private triggers: HTMLBcmTabsTriggerElement[] = [];\n  private contents: HTMLBcmTabsContentElement[] = [];\n  private tabsList: HTMLBcmTabsListElement;\n\n  componentWillLoad() {\n    this.activeTab = this.defaultValue;\n  }\n\n  componentDidLoad() {\n    this.refreshElementReferences();\n    this.updateTriggerProperties();\n    this.updateTabsListProperties();\n\n    // Eğer defaultValue yoksa ilk tab'ı aktif yap\n    if (!this.defaultValue && this.triggers.length > 0) {\n      this.activeTab = this.triggers[0].value;\n    }\n\n    this.setupRelations(); // activeTab ayarlandıktan sonra relations'ı kur\n\n    // auto-width variant'ında inkbar hesaplaması için ek gecikme\n    if (this.variant === 'auto-width') {\n      requestAnimationFrame(() => {\n        this.updateInkbar();\n        this.updateContentVisibility();\n      });\n    } else {\n      this.updateInkbar();\n      this.updateContentVisibility();\n    }\n  }\n\n  /**\n   * Refreshes DOM element references\n   */\n  private refreshElementReferences() {\n    this.triggers = Array.from(this.el.querySelectorAll('bcm-tabs-trigger'));\n    this.contents = Array.from(this.el.querySelectorAll('bcm-tabs-content'));\n    this.tabsList = this.el.querySelector('bcm-tabs-list');\n  }\n\n  /**\n   * Establishes relationships between tabs and content\n   */\n  private setupRelations() {\n    this.triggers.forEach(trigger => {\n      trigger.active = trigger.value === this.activeTab;\n      const panel = this.contents.find(content => content.value === trigger.value);\n      if (panel) {\n        const panelId = `panel-${trigger.value}`;\n        panel.id = panelId;\n        trigger.setAttribute('aria-controls', panelId);\n        panel.setAttribute('aria-labelledby', `trigger-${trigger.value}`);\n        trigger.id = `trigger-${trigger.value}`;\n      }\n    });\n  }\n\n  private updateTriggerProperties() {\n    if (this.triggers?.length > 0) {\n      this.triggers.forEach(trigger => {\n        trigger.size = this.size;\n        trigger.variant = this.variant;\n        trigger.smooth = this.smooth;\n      });\n    }\n  }\n\n  private updateTabsListProperties() {\n    if (this.tabsList) {\n      this.tabsList.variant = this.variant;\n      this.tabsList.smooth = this.smooth;\n    }\n  }\n\n  @Watch('size')\n  handleSizeChange() {\n    this.updateTriggerProperties();\n  }\n\n  @Watch('variant')\n  handleVariantChange() {\n    this.updateTriggerProperties();\n    this.updateTabsListProperties();\n\n    // auto-width variant'ında inkbar hesaplaması için ek gecikme\n    if (this.variant === 'auto-width') {\n      requestAnimationFrame(() => {\n        this.updateInkbar();\n      });\n    } else {\n      this.updateInkbar();\n    }\n  }\n\n  @Watch('smooth')\n  handleSmoothChange() {\n    this.updateTriggerProperties();\n    this.updateTabsListProperties();\n  }\n\n  @Method()\n  async disableTab(value: string): Promise<void> {\n    const trigger = this.triggers.find(t => t.value === value);\n    if (trigger) {\n      trigger.disabled = true;\n    }\n  }\n\n  @Method()\n  async enableTab(value: string): Promise<void> {\n    const trigger = this.triggers.find(t => t.value === value);\n    if (trigger) {\n      trigger.disabled = false;\n    }\n  }\n\n  /**\n   * Disables all tabs\n   */\n  @Method()\n  async disableAllTabs() {\n    this.triggers.forEach(trigger => {\n      trigger.disabled = true;\n    });\n  }\n\n  /**\n   * Enables all tabs\n   */\n  @Method()\n  async enableAllTabs() {\n    this.triggers.forEach(trigger => {\n      trigger.disabled = false;\n    });\n  }\n\n  /**\n   * Returns the active tab value\n   */\n  @Method()\n  async getActiveTab(): Promise<string> {\n    return this.activeTab;\n  }\n\n  /**\n   * Sets the active tab\n   */\n  @Method()\n  async setActiveTab(value: string): Promise<void> {\n    const trigger = this.triggers.find(t => t.value === value);\n    if (trigger && !trigger.disabled) {\n      this.previousTab = this.activeTab;\n      this.activeTab = value;\n      this.updateInkbar();\n      this.updateContentVisibility();\n      this.updateTabStatus();\n\n      this.bcmTabChange.emit({\n        activeTab: this.activeTab,\n        element: trigger,\n        previousTab: this.previousTab,\n      });\n    }\n  }\n\n  /**\n   * Updates tab status\n   */\n  private updateTabStatus() {\n    this.triggers.forEach(trigger => {\n      const isActive = trigger.value === this.activeTab;\n      trigger.active = isActive;\n    });\n  }\n\n  @Listen('resize', { target: 'window' })\n  handleResize() {\n    this.updateInkbar();\n  }\n\n  /**\n   * Triggered when a tab is selected\n   */\n  @Listen('bcmTabSelected', { capture: true })\n  handleTabSelected(event: CustomEvent<string>) {\n    this.previousTab = this.activeTab;\n    this.activeTab = event.detail;\n\n    this.updateTabStatus();\n    this.updateInkbar();\n    this.updateContentVisibility();\n\n    const activeElement = this.triggers.find(trigger => trigger.value === this.activeTab);\n    if (activeElement) {\n      this.bcmTabChange.emit({\n        activeTab: this.activeTab,\n        element: activeElement,\n        previousTab: this.previousTab,\n      });\n    }\n  }\n\n  /**\n   * Updates content visibility\n   */\n  private updateContentVisibility() {\n    this.contents.forEach(content => {\n      const isVisible = content.value === this.activeTab;\n      content.style.display = isVisible ? 'block' : 'none';\n      content.setAttribute('aria-hidden', (!isVisible).toString());\n    });\n  }\n\n  /**\n   * Updates inkbar position\n   */\n  private updateInkbar() {\n    if (!this.tabsList) {\n      console.warn('bcm-tabs-list not found');\n      return;\n    }\n\n    const totalTriggers = this.triggers.length;\n    if (totalTriggers === 0) return;\n\n    const inkbar = this.tabsList?.shadowRoot?.querySelector('.inkbar') as HTMLElement;\n    const activeTrigger = this.triggers.find(trigger => trigger.value === this.activeTab);\n\n    if (activeTrigger && inkbar) {\n      // auto-width variant'ında container genişliği henüz hesaplanmamış olabilir\n      // Bu durumda bir sonraki frame'de tekrar deneyelim\n      if (this.variant === 'auto-width') {\n        requestAnimationFrame(() => {\n          this.updateInkbarPosition(inkbar, activeTrigger as unknown as HTMLElement);\n        });\n      } else {\n        this.updateInkbarPosition(inkbar, activeTrigger as unknown as HTMLElement);\n      }\n    } else {\n      if (inkbar) inkbar.style.opacity = '0';\n    }\n  }\n\n  /**\n   * Updates inkbar position and size\n   */\n  private updateInkbarPosition(inkbar: HTMLElement, activeTrigger: HTMLElement) {\n    const triggerRect = activeTrigger.getBoundingClientRect();\n    const groupRect = this.tabsList?.shadowRoot?.querySelector('.tabs-list')?.getBoundingClientRect();\n\n    if (triggerRect && groupRect) {\n      const left = triggerRect.left - groupRect.left;\n      const width = triggerRect.width;\n\n      // Her iki variant için de aynı davranış: sadece aktif tab altında göster\n      inkbar.style.width = `${width}px`;\n      inkbar.style.transform = `translateX(${left}px)`;\n      inkbar.style.left = '0';\n      inkbar.style.right = 'auto';\n\n      // smooth prop'una göre opacity geçişi\n      if (this.smooth) {\n        inkbar.style.opacity = '1';\n      } else {\n        // Animasyon olmadan anında göster\n        inkbar.style.transition = 'none';\n        inkbar.style.opacity = '1';\n        // Bir sonraki frame'de transition'ı geri yükle\n        requestAnimationFrame(() => {\n          inkbar.style.transition = '';\n        });\n      }\n    } else {\n      console.warn('Group or trigger rect calculation failed');\n      inkbar.style.opacity = '0';\n    }\n  }\n\n  /**\n   * Tab container class\n   */\n  private tabClass = tv({\n    base: 'tabs-container bcm-ui-element flex flex-col',\n    variants: {\n      variant: {\n        'full-width': 'w-full',\n        'auto-width': 'w-auto',\n      },\n    },\n    defaultVariants: {\n      variant: 'full-width',\n    },\n  });\n\n  render() {\n    return (\n      <Host>\n        <div class={this.tabClass({ variant: this.variant })}>\n          <slot name=\"tabs-list\" />\n          <slot></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"tabs.component.js","sourceRoot":"","sources":["../../../src/components/tabs/tabs.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, Prop, h, Host, Element, Event, EventEmitter, Watch, State, Listen, Method } from '@stencil/core';\nimport { tv } from '@utils/tv';\n\n/**\n * Modern Tabs component with CSS-first approach\n * @slot - Default slot for bcm-tab components\n */\n@Component({\n  tag: 'bcm-tabs',\n  styleUrl: 'bcm-tabs.css',\n  shadow: true,\n})\nexport class BcmTabs {\n  @Element() el: HTMLElement;\n\n  /**\n   * Active tab value\n   */\n  @Prop({ mutable: true, reflect: true })\n  value: string;\n\n  /**\n   * Tab size variant\n   */\n  @Prop({ reflect: true })\n  size: 'sm' | 'md' | 'lg' = 'md';\n\n  /**\n   * Visual variant\n   */\n  @Prop({ reflect: true })\n  variant: 'line' | 'enclosed' = 'line';\n\n  /**\n   * Enable shadow on main container\n   */\n  @Prop({ reflect: true })\n  shadow: boolean = false;\n\n  /**\n   * Emits when active tab changes\n   */\n  @Event({\n    composed: false,\n    bubbles: false,\n    cancelable: true,\n    eventName: 'bcmTabChange',\n  })\n  bcmTabChange: EventEmitter<{\n    value: string;\n    previousValue: string;\n  }>;\n\n  @State() tabs: Array<{ value: string; label: string; disabled: boolean }> = [];\n  @State() activeIndex: number = 0;\n\n  private tabElements: Element[] = [];\n\n  componentWillLoad() {\n    this.discoverTabs();\n  }\n\n  componentDidLoad() {\n    this.updateActiveIndex();\n    this.updateTabStates();\n  }\n\n  /**\n   * Discovers all bcm-tab children\n   */\n  private discoverTabs() {\n    this.tabElements = Array.from(this.el.querySelectorAll('bcm-tab'));\n    this.tabs = this.tabElements.map((tab: any) => ({\n      value: tab.value,\n      label: tab.label || tab.value,\n      disabled: tab.disabled || false,\n    }));\n\n    // Set initial value if not provided\n    if (!this.value && this.tabs.length > 0) {\n      const firstEnabledTab = this.tabs.find(t => !t.disabled);\n      if (firstEnabledTab) {\n        this.value = firstEnabledTab.value;\n      }\n    }\n  }\n\n  /**\n   * Updates the active index based on current value\n   */\n  private updateActiveIndex() {\n    const index = this.tabs.findIndex(t => t.value === this.value);\n    this.activeIndex = index >= 0 ? index : 0;\n  }\n\n  /**\n   * Updates active/inactive state of all tab elements\n   */\n  private updateTabStates() {\n    this.tabElements.forEach((tab: any) => {\n      tab.active = tab.value === this.value;\n    });\n  }\n\n  @Watch('value')\n  handleValueChange(newValue: string, oldValue: string) {\n    this.updateActiveIndex();\n    this.updateTabStates();\n    this.updateCSSVariables();\n\n    if (oldValue !== newValue) {\n      this.bcmTabChange.emit({\n        value: newValue,\n        previousValue: oldValue,\n      });\n    }\n  }\n\n  @Watch('size')\n  handleSizeChange() {\n    this.propagatePropsToTabs();\n  }\n\n  /**\n   * Propagates parent props to child tabs\n   */\n  private propagatePropsToTabs() {\n    this.tabElements.forEach((tab: any) => {\n      tab.size = this.size;\n    });\n  }\n\n  /**\n   * Updates CSS custom properties for inkbar positioning\n   */\n  private updateCSSVariables() {\n    const tabsContainer = this.el.shadowRoot?.querySelector('.tabs-container') as HTMLElement;\n    if (tabsContainer) {\n      tabsContainer.style.setProperty('--active-index', this.activeIndex.toString());\n      tabsContainer.style.setProperty('--tab-count', this.tabs.length.toString());\n    }\n  }\n\n  /**\n   * Handles tab click events from children\n   */\n  @Listen('bcmTabClick')\n  handleTabClick(event: CustomEvent<string>) {\n    const clickedValue = event.detail;\n    const tab = this.tabs.find(t => t.value === clickedValue);\n\n    if (tab && !tab.disabled) {\n      this.value = clickedValue;\n    }\n  }\n\n  /**\n   * Keyboard navigation support\n   */\n  @Listen('keydown')\n  handleKeyDown(ev: KeyboardEvent) {\n    const target = ev.target as HTMLElement;\n    if (!target.classList.contains('tab-button')) return;\n\n    let newIndex = this.activeIndex;\n\n    switch (ev.key) {\n      case 'ArrowRight':\n      case 'ArrowDown':\n        ev.preventDefault();\n        newIndex = this.getNextEnabledTabIndex(this.activeIndex);\n        break;\n      case 'ArrowLeft':\n      case 'ArrowUp':\n        ev.preventDefault();\n        newIndex = this.getPreviousEnabledTabIndex(this.activeIndex);\n        break;\n      case 'Home':\n        ev.preventDefault();\n        newIndex = this.getFirstEnabledTabIndex();\n        break;\n      case 'End':\n        ev.preventDefault();\n        newIndex = this.getLastEnabledTabIndex();\n        break;\n      default:\n        return;\n    }\n\n    if (newIndex !== this.activeIndex) {\n      this.value = this.tabs[newIndex].value;\n      this.focusTabAtIndex(newIndex);\n    }\n  }\n\n  private getNextEnabledTabIndex(currentIndex: number): number {\n    for (let i = currentIndex + 1; i < this.tabs.length; i++) {\n      if (!this.tabs[i].disabled) return i;\n    }\n    return currentIndex;\n  }\n\n  private getPreviousEnabledTabIndex(currentIndex: number): number {\n    for (let i = currentIndex - 1; i >= 0; i--) {\n      if (!this.tabs[i].disabled) return i;\n    }\n    return currentIndex;\n  }\n\n  private getFirstEnabledTabIndex(): number {\n    const index = this.tabs.findIndex(t => !t.disabled);\n    return index >= 0 ? index : 0;\n  }\n\n  private getLastEnabledTabIndex(): number {\n    for (let i = this.tabs.length - 1; i >= 0; i--) {\n      if (!this.tabs[i].disabled) return i;\n    }\n    return this.tabs.length - 1;\n  }\n\n  private focusTabAtIndex(index: number) {\n    const buttons = this.el.shadowRoot?.querySelectorAll('.tab-button');\n    if (buttons && buttons[index]) {\n      (buttons[index] as HTMLElement).focus();\n    }\n  }\n\n  /**\n   * Public method to programmatically set active tab\n   */\n  @Method()\n  async setActiveTab(value: string): Promise<void> {\n    const tab = this.tabs.find(t => t.value === value);\n    if (tab && !tab.disabled) {\n      this.value = value;\n    }\n  }\n\n  /**\n   * Public method to get active tab value\n   */\n  @Method()\n  async getActiveTab(): Promise<string> {\n    return this.value;\n  }\n\n  /**\n   * Tailwind class configuration\n   */\n  private containerClass = tv({\n    base: 'tabs-container flex flex-col w-full',\n    variants: {\n      shadow: {\n        true: 'shadow-md rounded-lg',\n        false: '',\n      },\n    },\n  });\n\n  private tabsListClass = tv({\n    base: 'tabs-list relative flex border-b border-color-default',\n    variants: {\n      variant: {\n        line: 'bg-transparent',\n        enclosed: 'bg-color-background-subtle border border-color-default rounded-t-lg',\n      },\n    },\n  });\n\n  private inkbarClass = tv({\n    base: 'inkbar absolute bottom-0 left-0 h-0.5 bg-color-primary pointer-events-none',\n    variants: {\n      variant: {\n        line: 'transition-transform duration-200 ease-smooth',\n        enclosed: 'hidden',\n      },\n    },\n  });\n\n  render() {\n    this.updateCSSVariables();\n    this.propagatePropsToTabs();\n\n    return (\n      <Host>\n        <div class={this.containerClass({ shadow: this.shadow })}>\n          {/* Tab buttons list */}\n          <div class={this.tabsListClass({ variant: this.variant })} role=\"tablist\">\n            {this.tabs.map((tab, index) => (\n              <button\n                key={tab.value}\n                class={`tab-button flex-1 px-4 py-2 text-center font-medium transition-colors border-none ${\n                  tab.value === this.value\n                    ? 'text-color-primary'\n                    : tab.disabled\n                    ? 'text-color-disabled cursor-not-allowed opacity-50'\n                    : 'text-color-placeholder hover:text-color-primary cursor-pointer'\n                } ${this.size === 'sm' ? 'text-sm py-1.5 px-3' : this.size === 'lg' ? 'text-lg py-3 px-5' : 'text-base py-2 px-4'} bg-transparent`}\n                role=\"tab\"\n                aria-selected={(tab.value === this.value).toString()}\n                aria-controls={`panel-${tab.value}`}\n                id={`tab-${tab.value}`}\n                disabled={tab.disabled}\n                onClick={() => !tab.disabled && (this.value = tab.value)}\n                tabindex={index === this.activeIndex ? 0 : -1}\n              >\n                {tab.label}\n              </button>\n            ))}\n\n            {/* Inkbar - CSS-animated */}\n            {this.variant === 'line' && (\n              <div\n                class={this.inkbarClass({ variant: this.variant })}\n                style={{\n                  transform: `translateX(calc(${this.activeIndex} * 100% / ${this.tabs.length}))`,\n                  width: `calc(100% / ${this.tabs.length})`,\n                }}\n              />\n            )}\n          </div>\n\n          {/* Tab panels */}\n          <div class=\"tabs-content\">\n            <slot />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/text/text.component.js

@@ -2,94 +2,93 @@ import { h } from "@stencil/core";
 import cs from "classnames";
 import { variantTagMap } from "./text.utils";
 export class BcmText {
-    constructor() {
-        /** Text variant */
-        this.variant = 'body';
-        /** Text size */
-        this.size = 'medium';
-        /** Text overflow behavior */
-        this.overflow = false;
-        this.variantClassMap = {
-            display: 'font-semibold text-size-12 text-color-header',
-            heading1: 'font-semibold text-size-7 text-color-header',
-            heading2: 'font-semibold text-size-6 text-color-header',
-            title1: {
-                small: 'font-semibold text-size-5 text-color-header',
-                medium: 'font-semibold text-size-6 text-color-header',
-                large: 'font-semibold text-size-7 text-color-header',
-            },
-            title2: {
-                small: 'font-semibold text-size-4 text-color-default',
-                medium: 'font-semibold text-size-5 text-color-default',
-                large: 'font-semibold text-size-6 text-color-default',
-            },
-            title3: {
-                small: 'font-semibold text-size-3 text-color-disabled',
-                medium: 'font-semibold text-size-4 text-color-disabled',
-                large: 'font-semibold text-size-5 text-color-disabled',
-            },
-            body: {
-                small: 'font-regular text-size-4 text-color-default',
-                medium: 'font-regular text-size-5 text-color-default',
-                large: 'font-regular text-size-6 text-color-default',
-            },
-            bodyAccent: {
-                small: 'font-medium text-size-4 text-color-default',
-                medium: 'font-medium text-size-5 text-color-default',
-                large: 'font-medium text-size-6 text-color-default',
-            },
-            helper: {
-                small: 'font-regular text-size-4 text-color-helper',
-                medium: 'font-regular text-size-5 text-color-helper',
-                large: 'font-regular text-size-6 text-color-helper',
-            },
-            caption: {
-                small: 'font-regular text-size-3 text-color-caption',
-                medium: 'font-regular text-size-4 text-color-caption',
-                large: 'font-regular text-size-5 text-color-caption',
-            },
-            link: {
-                small: 'font-medium text-size-4 underline text-color-primary',
-                medium: 'font-medium text-size-5 underline text-color-primary',
-                large: 'font-medium text-size-6 underline text-color-primary',
-            },
-            label: {
-                small: 'font-medium text-size-3 text-color-label',
-                medium: 'font-medium text-size-4 text-color-label',
-                large: 'font-medium text-size-5 text-color-label',
-            },
-            placeholder: {
-                small: 'font-regular text-size-4 text-color-placeholder',
-                medium: 'font-regular text-size-5 text-color-placeholder',
-                large: 'font-regular text-size-6 text-color-placeholder',
-            },
-            info: {
-                small: 'font-regular text-size-3 text-color-default',
-                medium: 'font-regular text-size-4 text-color-default',
-                large: 'font-regular text-size-5 text-color-default',
-            },
-            infoAccent: {
-                small: 'font-medium text-size-3 text-color-header',
-                medium: 'font-medium text-size-4 text-color-header',
-                large: 'font-medium text-size-5 text-color-header',
-            },
-        };
-        this.getTextClass = (variant, size) => {
-            const variantClasses = this.variantClassMap[variant];
-            if (typeof variantClasses === 'string') {
-                return variantClasses;
-            }
-            return variantClasses[size];
-        };
-        this.getOverflowClass = (overflow) => {
-            return overflow ? 'truncate' : '';
-        };
-    }
+    /** Text content */
+    text;
+    /** Text variant */
+    variant = 'body';
+    /** Text size */
+    size = 'medium';
+    /** Text overflow behavior */
+    overflow = false;
+    variantClassMap = {
+        display: 'font-semibold text-size-12 text-color-header',
+        heading1: 'font-semibold text-size-7 text-color-header',
+        heading2: 'font-semibold text-size-6 text-color-header',
+        title1: {
+            small: 'font-semibold text-size-5 text-color-header',
+            medium: 'font-semibold text-size-6 text-color-header',
+            large: 'font-semibold text-size-7 text-color-header',
+        },
+        title2: {
+            small: 'font-semibold text-size-4 text-color-default',
+            medium: 'font-semibold text-size-5 text-color-default',
+            large: 'font-semibold text-size-6 text-color-default',
+        },
+        title3: {
+            small: 'font-semibold text-size-3 text-color-disabled',
+            medium: 'font-semibold text-size-4 text-color-disabled',
+            large: 'font-semibold text-size-5 text-color-disabled',
+        },
+        body: {
+            small: 'font-regular text-size-4 text-color-default',
+            medium: 'font-regular text-size-5 text-color-default',
+            large: 'font-regular text-size-6 text-color-default',
+        },
+        bodyAccent: {
+            small: 'font-medium text-size-4 text-color-default',
+            medium: 'font-medium text-size-5 text-color-default',
+            large: 'font-medium text-size-6 text-color-default',
+        },
+        helper: {
+            small: 'font-regular text-size-4 text-color-helper',
+            medium: 'font-regular text-size-5 text-color-helper',
+            large: 'font-regular text-size-6 text-color-helper',
+        },
+        caption: {
+            small: 'font-regular text-size-3 text-color-caption',
+            medium: 'font-regular text-size-4 text-color-caption',
+            large: 'font-regular text-size-5 text-color-caption',
+        },
+        link: {
+            small: 'font-medium text-size-4 underline text-color-primary',
+            medium: 'font-medium text-size-5 underline text-color-primary',
+            large: 'font-medium text-size-6 underline text-color-primary',
+        },
+        label: {
+            small: 'font-medium text-size-3 text-color-label',
+            medium: 'font-medium text-size-4 text-color-label',
+            large: 'font-medium text-size-5 text-color-label',
+        },
+        placeholder: {
+            small: 'font-regular text-size-4 text-color-placeholder',
+            medium: 'font-regular text-size-5 text-color-placeholder',
+            large: 'font-regular text-size-6 text-color-placeholder',
+        },
+        info: {
+            small: 'font-regular text-size-3 text-color-default',
+            medium: 'font-regular text-size-4 text-color-default',
+            large: 'font-regular text-size-5 text-color-default',
+        },
+        infoAccent: {
+            small: 'font-medium text-size-3 text-color-header',
+            medium: 'font-medium text-size-4 text-color-header',
+            large: 'font-medium text-size-5 text-color-header',
+        },
+    };
+    getTextClass = (variant, size) => {
+        const variantClasses = this.variantClassMap[variant];
+        if (typeof variantClasses === 'string') {
+            return variantClasses;
+        }
+        return variantClasses[size];
+    };
+    getOverflowClass = (overflow) => {
+        return overflow ? 'truncate' : '';
+    };
     render() {
-        var _a;
         const Tag = variantTagMap[this.variant];
         const variantClass = this.getTextClass(this.variant, this.size);
-        const overflowClass = this.getOverflowClass((_a = this.overflow) !== null && _a !== void 0 ? _a : false);
+        const overflowClass = this.getOverflowClass(this.overflow ?? false);
         return (h(Tag, { key: '9092013eaaba071fe3a198b91462ffaa3b71cc2c', class: cs('bcm-text appearance-none m-0 p-0', variantClass, overflowClass), part: "text" }, h("slot", { key: 'f7f07d4d2484df0b8c4c2a36b9499c837c2a6c32' }, this.text)));
     }
     static get is() { return "bcm-text"; }

package/dist/collection/components/text/text.component.js.map

@@ -1 +1 @@
-{"version":3,"file":"text.component.js","sourceRoot":"","sources":["../../../src/components/text/text.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\nimport cs from 'classnames';\nimport { TextVariant, TextSize } from './text.types';\nimport { variantTagMap } from './text.utils';\n\n@Component({\n  tag: 'bcm-text',\n  styleUrl: 'text.scss',\n  shadow: true,\n})\nexport class BcmText {\n  /** Text content */\n  @Prop()\n  text: string;\n\n  /** Text variant */\n  @Prop()\n  variant: TextVariant = 'body';\n\n  /** Text size */\n  @Prop()\n  size: TextSize = 'medium';\n\n  /** Text overflow behavior */\n  @Prop()\n  overflow: boolean = false;\n\n  private readonly variantClassMap = {\n    display: 'font-semibold text-size-12 text-color-header',\n    heading1: 'font-semibold text-size-7 text-color-header',\n    heading2: 'font-semibold text-size-6 text-color-header',\n    title1: {\n      small: 'font-semibold text-size-5 text-color-header',\n      medium: 'font-semibold text-size-6 text-color-header',\n      large: 'font-semibold text-size-7 text-color-header',\n    },\n    title2: {\n      small: 'font-semibold text-size-4 text-color-default',\n      medium: 'font-semibold text-size-5 text-color-default',\n      large: 'font-semibold text-size-6 text-color-default',\n    },\n    title3: {\n      small: 'font-semibold text-size-3 text-color-disabled',\n      medium: 'font-semibold text-size-4 text-color-disabled',\n      large: 'font-semibold text-size-5 text-color-disabled',\n    },\n    body: {\n      small: 'font-regular text-size-4 text-color-default',\n      medium: 'font-regular text-size-5 text-color-default',\n      large: 'font-regular text-size-6 text-color-default',\n    },\n    bodyAccent: {\n      small: 'font-medium text-size-4 text-color-default',\n      medium: 'font-medium text-size-5 text-color-default',\n      large: 'font-medium text-size-6 text-color-default',\n    },\n    helper: {\n      small: 'font-regular text-size-4 text-color-helper',\n      medium: 'font-regular text-size-5 text-color-helper',\n      large: 'font-regular text-size-6 text-color-helper',\n    },\n    caption: {\n      small: 'font-regular text-size-3 text-color-caption',\n      medium: 'font-regular text-size-4 text-color-caption',\n      large: 'font-regular text-size-5 text-color-caption',\n    },\n    link: {\n      small: 'font-medium text-size-4 underline text-color-primary',\n      medium: 'font-medium text-size-5 underline text-color-primary',\n      large: 'font-medium text-size-6 underline text-color-primary',\n    },\n    label: {\n      small: 'font-medium text-size-3 text-color-label',\n      medium: 'font-medium text-size-4 text-color-label',\n      large: 'font-medium text-size-5 text-color-label',\n    },\n    placeholder: {\n      small: 'font-regular text-size-4 text-color-placeholder',\n      medium: 'font-regular text-size-5 text-color-placeholder',\n      large: 'font-regular text-size-6 text-color-placeholder',\n    },\n    info: {\n      small: 'font-regular text-size-3 text-color-default',\n      medium: 'font-regular text-size-4 text-color-default',\n      large: 'font-regular text-size-5 text-color-default',\n    },\n    infoAccent: {\n      small: 'font-medium text-size-3 text-color-header',\n      medium: 'font-medium text-size-4 text-color-header',\n      large: 'font-medium text-size-5 text-color-header',\n    },\n  } as const;\n\n  private getTextClass = (variant: TextVariant, size: TextSize): string => {\n    const variantClasses = this.variantClassMap[variant];\n\n    if (typeof variantClasses === 'string') {\n      return variantClasses;\n    }\n\n    return variantClasses[size];\n  };\n\n  private getOverflowClass = (overflow: boolean): string => {\n    return overflow ? 'truncate' : '';\n  };\n\n  render() {\n    const Tag = variantTagMap[this.variant];\n    const variantClass = this.getTextClass(this.variant, this.size);\n    const overflowClass = this.getOverflowClass(this.overflow ?? false);\n\n    return (\n      <Tag class={cs('bcm-text appearance-none m-0 p-0', variantClass, overflowClass)} part=\"text\">\n        <slot>{this.text}</slot>\n      </Tag>\n    );\n  }\n}\n"]}
+{"version":3,"file":"text.component.js","sourceRoot":"","sources":["../../../src/components/text/text.component.tsx"],"names":[],"mappings":"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","sourcesContent":["import { Component, h, Prop } from '@stencil/core';\nimport cs from 'classnames';\nimport { TextVariant, TextSize } from './text.types';\nimport { variantTagMap } from './text.utils';\n\n@Component({\n  tag: 'bcm-text',\n  styleUrl: 'text.scss',\n  shadow: true,\n})\nexport class BcmText {\n  /** Text content */\n  @Prop()\n  text: string;\n\n  /** Text variant */\n  @Prop()\n  variant: TextVariant = 'body';\n\n  /** Text size */\n  @Prop()\n  size: TextSize = 'medium';\n\n  /** Text overflow behavior */\n  @Prop()\n  overflow: boolean = false;\n\n  private readonly variantClassMap = {\n    display: 'font-semibold text-size-12 text-color-header',\n    heading1: 'font-semibold text-size-7 text-color-header',\n    heading2: 'font-semibold text-size-6 text-color-header',\n    title1: {\n      small: 'font-semibold text-size-5 text-color-header',\n      medium: 'font-semibold text-size-6 text-color-header',\n      large: 'font-semibold text-size-7 text-color-header',\n    },\n    title2: {\n      small: 'font-semibold text-size-4 text-color-default',\n      medium: 'font-semibold text-size-5 text-color-default',\n      large: 'font-semibold text-size-6 text-color-default',\n    },\n    title3: {\n      small: 'font-semibold text-size-3 text-color-disabled',\n      medium: 'font-semibold text-size-4 text-color-disabled',\n      large: 'font-semibold text-size-5 text-color-disabled',\n    },\n    body: {\n      small: 'font-regular text-size-4 text-color-default',\n      medium: 'font-regular text-size-5 text-color-default',\n      large: 'font-regular text-size-6 text-color-default',\n    },\n    bodyAccent: {\n      small: 'font-medium text-size-4 text-color-default',\n      medium: 'font-medium text-size-5 text-color-default',\n      large: 'font-medium text-size-6 text-color-default',\n    },\n    helper: {\n      small: 'font-regular text-size-4 text-color-helper',\n      medium: 'font-regular text-size-5 text-color-helper',\n      large: 'font-regular text-size-6 text-color-helper',\n    },\n    caption: {\n      small: 'font-regular text-size-3 text-color-caption',\n      medium: 'font-regular text-size-4 text-color-caption',\n      large: 'font-regular text-size-5 text-color-caption',\n    },\n    link: {\n      small: 'font-medium text-size-4 underline text-color-primary',\n      medium: 'font-medium text-size-5 underline text-color-primary',\n      large: 'font-medium text-size-6 underline text-color-primary',\n    },\n    label: {\n      small: 'font-medium text-size-3 text-color-label',\n      medium: 'font-medium text-size-4 text-color-label',\n      large: 'font-medium text-size-5 text-color-label',\n    },\n    placeholder: {\n      small: 'font-regular text-size-4 text-color-placeholder',\n      medium: 'font-regular text-size-5 text-color-placeholder',\n      large: 'font-regular text-size-6 text-color-placeholder',\n    },\n    info: {\n      small: 'font-regular text-size-3 text-color-default',\n      medium: 'font-regular text-size-4 text-color-default',\n      large: 'font-regular text-size-5 text-color-default',\n    },\n    infoAccent: {\n      small: 'font-medium text-size-3 text-color-header',\n      medium: 'font-medium text-size-4 text-color-header',\n      large: 'font-medium text-size-5 text-color-header',\n    },\n  } as const;\n\n  private getTextClass = (variant: TextVariant, size: TextSize): string => {\n    const variantClasses = this.variantClassMap[variant];\n\n    if (typeof variantClasses === 'string') {\n      return variantClasses;\n    }\n\n    return variantClasses[size];\n  };\n\n  private getOverflowClass = (overflow: boolean): string => {\n    return overflow ? 'truncate' : '';\n  };\n\n  render() {\n    const Tag = variantTagMap[this.variant];\n    const variantClass = this.getTextClass(this.variant, this.size);\n    const overflowClass = this.getOverflowClass(this.overflow ?? false);\n\n    return (\n      <Tag class={cs('bcm-text appearance-none m-0 p-0', variantClass, overflowClass)} part=\"text\">\n        <slot>{this.text}</slot>\n      </Tag>\n    );\n  }\n}\n"]}

package/dist/collection/components/text/text.css

@@ -1 +1 @@
-.m-0{margin:0}.appearance-none{appearance:none}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.p-0{padding:0}.text-size-12{font-size:var(--bcm-ui-font-size-12,60px);line-height:var(--bcm-ui-line-height-12,72px)}.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)}.text-size-7{font-size:var(--bcm-ui-font-size-7,20px);line-height:var(--bcm-ui-line-height-7,28px)}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-color-caption{color:var(--bcm-ui-color-text-caption)}.text-color-default{color:var(--bcm-ui-color-text-default)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.text-color-header{color:var(--bcm-ui-color-text-header)}.text-color-helper{color:var(--bcm-ui-color-text-helper)}.text-color-label{color:var(--bcm-ui-color-text-label)}.text-color-placeholder{color:var(--bcm-ui-color-text-placeholder)}.text-color-primary{color:var(--bcm-ui-color-text-primary)}.underline{text-decoration-line:underline}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}
+.static{position:static}.m-0{margin:0}.appearance-none{appearance:none}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.p-0{padding:0}.text-size-12{font-size:var(--bcm-ui-font-size-12,60px);line-height:var(--bcm-ui-line-height-12,72px)}.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)}.text-size-7{font-size:var(--bcm-ui-font-size-7,20px);line-height:var(--bcm-ui-line-height-7,28px)}.font-medium{font-weight:500}.font-semibold{font-weight:600}.text-color-caption{color:var(--bcm-ui-color-text-caption)}.text-color-default{color:var(--bcm-ui-color-text-default)}.text-color-disabled{color:var(--bcm-ui-color-text-disabled)}.text-color-header{color:var(--bcm-ui-color-text-header)}.text-color-helper{color:var(--bcm-ui-color-text-helper)}.text-color-label{color:var(--bcm-ui-color-text-label)}.text-color-placeholder{color:var(--bcm-ui-color-text-placeholder)}.text-color-primary{color:var(--bcm-ui-color-text-primary)}.underline{text-decoration-line:underline}.shadow{--tw-shadow:var(--bcm-ui-box-shadow-default);--tw-shadow-colored:var(--bcm-ui-box-shadow-default);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}