@beeq/core 1.8.3 → 1.8.4

package/dist/stencil.config.js

@@ -10,14 +10,15 @@ import { vueOutputTarget as vue } from "@stencil/vue-output-target";
 import tailwind, { tailwindHMR } from "stencil-tailwind-plugin";
 import { angularValueAccessorBindings, generateCustomElementsJson, vueComponentModels } from "./src/tools";
 import tailwindConf from "../../tailwind.config";
+const namespace = 'beeq';
+const componentCorePackage = `@${namespace}/core`;
+const customElementsDir = 'dist/components';
+const resolvePath = (path) => resolve(__dirname, path).replace(/\\/g, '/');
 const tailwindOpts = {
-    postcss: resolve(__dirname, '../../postcss.config.js').replace(/\\/g, '/'),
+    postcss: resolvePath('../../postcss.config.js'),
     tailwindConf: tailwindConf,
     stripComments: true,
 };
-const namespace = 'beeq';
-const componentCorePackage = `@${namespace}/core`;
-const customElementsDir = 'dist/components';
 export const config = {
     namespace,
     taskQueue: 'async',
@@ -26,14 +27,11 @@ export const config = {
     env: {
         BEEQ_ASSETS_BASE_PATH: process.env.BEEQ_ASSETS_BASE_PATH,
     },
-    globalStyle: resolve(__dirname, './src/global/styles/default.scss').replace(/\\/g, '/'),
+    globalStyle: resolvePath('./src/global/styles/default.scss'),
     plugins: [
         sass({
-            includePaths: [
-                resolve(__dirname, '../../node_modules').replace(/\\/g, '/'),
-                resolve(__dirname, 'src/global/styles').replace(/\\/g, '/'),
-            ],
-            injectGlobalPaths: [resolve(__dirname, 'src/global/styles/mixins/index.scss').replace(/\\/g, '/')],
+            includePaths: [resolvePath('../../node_modules'), resolvePath('src/global/styles')],
+            injectGlobalPaths: [resolvePath('src/global/styles/mixins/index.scss')],
             outputStyle: 'compressed',
             sourceMap: true,
             sourceMapEmbed: true,
@@ -73,34 +71,39 @@ export const config = {
             serviceWorker: null, // disable service workers
         },
         angular({
+            /* --------------------------- Angular output target -------------------------- */
             componentCorePackage,
             outputType: 'component', // Generate many component wrappers tied to a single Angular module (lazy/hydrated approach)
-            directivesProxyFile: resolve(__dirname, '../beeq-angular/src/directives/components.ts').replace(/\\/g, '/'),
-            directivesArrayFile: resolve(__dirname, '../beeq-angular/src/directives/index.ts').replace(/\\/g, '/'),
+            directivesProxyFile: resolvePath('../beeq-angular/src/directives/components.ts'),
+            directivesArrayFile: resolvePath('../beeq-angular/src/directives/index.ts'),
             valueAccessorConfigs: angularValueAccessorBindings,
             inlineProperties: true,
             customElementsDir,
         }),
         angular({
+            /* -------------------- Angular Standalone output target -------------------- */
             componentCorePackage,
             outputType: 'standalone', // Generate a component with the standalone flag set to true.
-            directivesProxyFile: resolve(__dirname, '../beeq-angular/standalone/src/directives/components.ts').replace(/\\/g, '/'),
-            directivesArrayFile: resolve(__dirname, '../beeq-angular/standalone/src/directives/index.ts').replace(/\\/g, '/'),
+            directivesProxyFile: resolvePath('../beeq-angular/standalone/src/directives/components.ts'),
+            directivesArrayFile: resolvePath('../beeq-angular/standalone/src/directives/index.ts'),
             valueAccessorConfigs: angularValueAccessorBindings,
             customElementsDir,
         }),
         react({
-            outDir: resolve(__dirname, '../beeq-react/src/').replace(/\\/g, '/'),
+            /* --------------------------- React output target -------------------------- */
+            outDir: resolvePath('../beeq-react/src/'),
             customElementsDir,
         }),
         react({
-            outDir: resolve(__dirname, '../beeq-react/ssr').replace(/\\/g, '/'),
+            /* ------------------------- React SSR output target ------------------------ */
+            outDir: resolvePath('../beeq-react/ssr'),
             hydrateModule: '@beeq/core/dist/hydrate',
             customElementsDir,
         }),
         vue({
+            /* ---------------------------- Vue output target --------------------------- */
             componentCorePackage,
-            proxiesFile: resolve(__dirname, '../beeq-vue/src/components.ts').replace(/\\/g, '/'),
+            proxiesFile: resolvePath('../beeq-vue/src/components.ts'),
             includeImportCustomElements: true,
             includePolyfills: false,
             includeDefineCustomElements: false,

package/dist/stencil.config.js.map

@@ -1 +1 @@
-{"version":3,"file":"stencil.config.js","sourceRoot":"","sources":["../../../stencil.config.ts"],"names":[],"mappings":"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","sourcesContent":["import { resolve } from 'path';\n\nimport { angularOutputTarget as angular } from '@stencil/angular-output-target';\nimport { Config } from '@stencil/core';\nimport { reactOutputTarget as react } from '@stencil/react-output-target';\nimport { sass } from '@stencil/sass';\nimport { vueOutputTarget as vue } from '@stencil/vue-output-target';\nimport tailwind, { PluginConfigOpts, tailwindHMR } from 'stencil-tailwind-plugin';\n\nimport { angularValueAccessorBindings, generateCustomElementsJson, vueComponentModels } from './src/tools';\nimport tailwindConf from '../../tailwind.config';\n\nconst tailwindOpts: PluginConfigOpts = {\n  postcss: resolve(__dirname, '../../postcss.config.js').replace(/\\\\/g, '/'),\n  tailwindConf: tailwindConf,\n  stripComments: true,\n};\n\nconst namespace = 'beeq';\nconst componentCorePackage = `@${namespace}/core`;\nconst customElementsDir = 'dist/components';\n\nexport const config: Config = {\n  namespace,\n  taskQueue: 'async',\n  buildDist: true,\n  enableCache: true,\n  env: {\n    BEEQ_ASSETS_BASE_PATH: process.env.BEEQ_ASSETS_BASE_PATH,\n  },\n  globalStyle: resolve(__dirname, './src/global/styles/default.scss').replace(/\\\\/g, '/'),\n  plugins: [\n    sass({\n      includePaths: [\n        resolve(__dirname, '../../node_modules').replace(/\\\\/g, '/'),\n        resolve(__dirname, 'src/global/styles').replace(/\\\\/g, '/'),\n      ],\n      injectGlobalPaths: [resolve(__dirname, 'src/global/styles/mixins/index.scss').replace(/\\\\/g, '/')],\n      outputStyle: 'compressed',\n      sourceMap: true,\n      sourceMapEmbed: true,\n      sourceMapContents: true,\n    }),\n    tailwind(tailwindOpts),\n    tailwindHMR({ tailwindConf }),\n  ],\n  outputTargets: [\n    { type: 'docs-readme' },\n    /**\n     * The output custom-elements.json file is used by Storybook to generate the documentation.\n     * @see packages/beeq/.storybook/custom-elements.json\n     */\n    { type: 'docs-custom', generator: generateCustomElementsJson },\n    {\n      type: 'dist',\n      copy: [\n        { src: '../README.md', dest: '../../README.md', warn: true },\n        { src: '../cem/*.*', dest: '../', warn: true },\n      ],\n    },\n    { type: 'dist-hydrate-script', dir: 'dist/hydrate' },\n    {\n      type: 'dist-custom-elements',\n      customElementsExportBehavior: 'single-export-module',\n      externalRuntime: false,\n      dir: customElementsDir,\n      minify: true,\n    },\n    {\n      type: 'www',\n      copy: [\n        { src: 'global/assets', dest: 'assets' },\n        { src: 'global/scripts', dest: 'scripts' },\n      ],\n      serviceWorker: null, // disable service workers\n    },\n    angular({\n      componentCorePackage,\n      outputType: 'component', // Generate many component wrappers tied to a single Angular module (lazy/hydrated approach)\n      directivesProxyFile: resolve(__dirname, '../beeq-angular/src/directives/components.ts').replace(/\\\\/g, '/'),\n      directivesArrayFile: resolve(__dirname, '../beeq-angular/src/directives/index.ts').replace(/\\\\/g, '/'),\n      valueAccessorConfigs: angularValueAccessorBindings,\n      inlineProperties: true,\n      customElementsDir,\n    }),\n    angular({\n      componentCorePackage,\n      outputType: 'standalone', // Generate a component with the standalone flag set to true.\n      directivesProxyFile: resolve(__dirname, '../beeq-angular/standalone/src/directives/components.ts').replace(\n        /\\\\/g,\n        '/',\n      ),\n      directivesArrayFile: resolve(__dirname, '../beeq-angular/standalone/src/directives/index.ts').replace(/\\\\/g, '/'),\n      valueAccessorConfigs: angularValueAccessorBindings,\n      customElementsDir,\n    }),\n    react({\n      outDir: resolve(__dirname, '../beeq-react/src/').replace(/\\\\/g, '/'),\n      customElementsDir,\n    }),\n    react({\n      outDir: resolve(__dirname, '../beeq-react/ssr').replace(/\\\\/g, '/'),\n      hydrateModule: '@beeq/core/dist/hydrate',\n      customElementsDir,\n    }),\n    vue({\n      componentCorePackage,\n      proxiesFile: resolve(__dirname, '../beeq-vue/src/components.ts').replace(/\\\\/g, '/'),\n      includeImportCustomElements: true,\n      includePolyfills: false,\n      includeDefineCustomElements: false,\n      componentModels: vueComponentModels,\n      // hydrateModule: '@beeq/core/dist/hydrate',\n      customElementsDir,\n    }),\n  ],\n  extras: {\n    /**\n     * Details:\n     * https://stenciljs.com/docs/config-extras\n     */\n    enableImportInjection: true,\n    experimentalScopedSlotChanges: true,\n    experimentalSlotFixes: true,\n  },\n  testing: {\n    browserHeadless: 'shell',\n  },\n  preamble: 'Built by Endavans\\n© https://beeq.design - Apache 2 License.',\n  watchIgnoredRegex: /(custom-elements\\.)((d\\.ts)|(json))$/g,\n  devServer: {\n    openBrowser: false,\n    port: 8001,\n    reloadStrategy: 'pageReload',\n  },\n};\n"]}
+{"version":3,"file":"stencil.config.js","sourceRoot":"","sources":["../../../stencil.config.ts"],"names":[],"mappings":"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","sourcesContent":["import { resolve } from 'path';\n\nimport { angularOutputTarget as angular } from '@stencil/angular-output-target';\nimport { Config } from '@stencil/core';\nimport { reactOutputTarget as react } from '@stencil/react-output-target';\nimport { sass } from '@stencil/sass';\nimport { vueOutputTarget as vue } from '@stencil/vue-output-target';\nimport tailwind, { PluginConfigOpts, tailwindHMR } from 'stencil-tailwind-plugin';\n\nimport { angularValueAccessorBindings, generateCustomElementsJson, vueComponentModels } from './src/tools';\nimport tailwindConf from '../../tailwind.config';\n\nconst namespace = 'beeq';\nconst componentCorePackage = `@${namespace}/core`;\nconst customElementsDir = 'dist/components';\nconst resolvePath = (path: string) => resolve(__dirname, path).replace(/\\\\/g, '/');\n\nconst tailwindOpts: PluginConfigOpts = {\n  postcss: resolvePath('../../postcss.config.js'),\n  tailwindConf: tailwindConf,\n  stripComments: true,\n};\n\nexport const config: Config = {\n  namespace,\n  taskQueue: 'async',\n  buildDist: true,\n  enableCache: true,\n  env: {\n    BEEQ_ASSETS_BASE_PATH: process.env.BEEQ_ASSETS_BASE_PATH,\n  },\n  globalStyle: resolvePath('./src/global/styles/default.scss'),\n  plugins: [\n    sass({\n      includePaths: [resolvePath('../../node_modules'), resolvePath('src/global/styles')],\n      injectGlobalPaths: [resolvePath('src/global/styles/mixins/index.scss')],\n      outputStyle: 'compressed',\n      sourceMap: true,\n      sourceMapEmbed: true,\n      sourceMapContents: true,\n    }),\n    tailwind(tailwindOpts),\n    tailwindHMR({ tailwindConf }),\n  ],\n  outputTargets: [\n    { type: 'docs-readme' },\n    /**\n     * The output custom-elements.json file is used by Storybook to generate the documentation.\n     * @see packages/beeq/.storybook/custom-elements.json\n     */\n    { type: 'docs-custom', generator: generateCustomElementsJson },\n    {\n      type: 'dist',\n      copy: [\n        { src: '../README.md', dest: '../../README.md', warn: true },\n        { src: '../cem/*.*', dest: '../', warn: true },\n      ],\n    },\n    { type: 'dist-hydrate-script', dir: 'dist/hydrate' },\n    {\n      type: 'dist-custom-elements',\n      customElementsExportBehavior: 'single-export-module',\n      externalRuntime: false,\n      dir: customElementsDir,\n      minify: true,\n    },\n    {\n      type: 'www',\n      copy: [\n        { src: 'global/assets', dest: 'assets' },\n        { src: 'global/scripts', dest: 'scripts' },\n      ],\n      serviceWorker: null, // disable service workers\n    },\n    angular({\n      /* --------------------------- Angular output target -------------------------- */\n      componentCorePackage,\n      outputType: 'component', // Generate many component wrappers tied to a single Angular module (lazy/hydrated approach)\n      directivesProxyFile: resolvePath('../beeq-angular/src/directives/components.ts'),\n      directivesArrayFile: resolvePath('../beeq-angular/src/directives/index.ts'),\n      valueAccessorConfigs: angularValueAccessorBindings,\n      inlineProperties: true,\n      customElementsDir,\n    }),\n    angular({\n      /* -------------------- Angular Standalone output target -------------------- */\n      componentCorePackage,\n      outputType: 'standalone', // Generate a component with the standalone flag set to true.\n      directivesProxyFile: resolvePath('../beeq-angular/standalone/src/directives/components.ts'),\n      directivesArrayFile: resolvePath('../beeq-angular/standalone/src/directives/index.ts'),\n      valueAccessorConfigs: angularValueAccessorBindings,\n      customElementsDir,\n    }),\n    react({\n      /* --------------------------- React output target -------------------------- */\n      outDir: resolvePath('../beeq-react/src/'),\n      customElementsDir,\n    }),\n    react({\n      /* ------------------------- React SSR output target ------------------------ */\n      outDir: resolvePath('../beeq-react/ssr'),\n      hydrateModule: '@beeq/core/dist/hydrate',\n      customElementsDir,\n    }),\n    vue({\n      /* ---------------------------- Vue output target --------------------------- */\n      componentCorePackage,\n      proxiesFile: resolvePath('../beeq-vue/src/components.ts'),\n      includeImportCustomElements: true,\n      includePolyfills: false,\n      includeDefineCustomElements: false,\n      componentModels: vueComponentModels,\n      // hydrateModule: '@beeq/core/dist/hydrate',\n      customElementsDir,\n    }),\n  ],\n  extras: {\n    /**\n     * Details:\n     * https://stenciljs.com/docs/config-extras\n     */\n    enableImportInjection: true,\n    experimentalScopedSlotChanges: true,\n    experimentalSlotFixes: true,\n  },\n  testing: {\n    browserHeadless: 'shell',\n  },\n  preamble: 'Built by Endavans\\n© https://beeq.design - Apache 2 License.',\n  watchIgnoredRegex: /(custom-elements\\.)((d\\.ts)|(json))$/g,\n  devServer: {\n    openBrowser: false,\n    port: 8001,\n    reloadStrategy: 'pageReload',\n  },\n};\n"]}

package/dist/types/components/accordion/bq-accordion.d.ts

@@ -145,8 +145,7 @@ export declare class BqAccordion {
     private handleClick;
     private handleFocus;
     private handleBlur;
-    private handlePrefixSlotChange;
-    private handleSuffixSlotChange;
+    private handleSlotChange;
     private get open();
     private get isCssInterpolateSizeSupported();
     render(): any;

package/dist/types/components/alert/bq-alert.d.ts

@@ -129,8 +129,7 @@ export declare class BqAlert {
     private handleHide;
     private handleShow;
     private handleTransitionEnd;
-    private handleContentSlotChange;
-    private handleFooterSlotChange;
+    private handleSlotChange;
     private get iconName();
     render(): any;
 }

package/dist/types/components/badge/bq-badge.d.ts

@@ -44,8 +44,9 @@ export declare class BqBadge {
     size?: TBadgeSize;
     handleSizePropChange(): void;
     componentWillLoad(): void;
+    componentDidLoad(): void;
     disconnectedCallback(): void;
-    private onSlotChange;
+    private handleSlotChange;
     private get slot();
     render(): any;
 }

package/dist/types/components/breadcrumb/bq-breadcrumb.d.ts

@@ -28,6 +28,7 @@ export declare class BqBreadcrumb {
     el: HTMLBqBreadcrumbElement;
     /** The `aria-label` attribute to describe the type of navigation */
     label: string;
+    componentDidLoad(): void;
     private handleSlotChange;
     private getSeparatorElem;
     private get separatorFromSlot();

package/dist/types/components/button/bq-button.d.ts

@@ -104,6 +104,7 @@ export declare class BqButton {
     /** Handler to be called when button gets focus */
     bqClick: EventEmitter<HTMLBqButtonElement>;
     componentWillLoad(): void;
+    componentDidLoad(): void;
     private handleBlur;
     private handleFocus;
     private handleClick;

package/dist/types/components/date-picker/bq-date-picker.d.ts

@@ -135,6 +135,7 @@ export declare class BqDatePicker {
     private readonly BUTTON_EXPORT_PARTS;
     internals: ElementInternals;
     el: HTMLBqDatePickerElement;
+    isCallyLoaded: boolean;
     focusedDate: string;
     displayDate: string;
     hasLabel: boolean;
@@ -236,7 +237,7 @@ export declare class BqDatePicker {
     /** Callback handler emitted when the input has received focus */
     bqFocus: EventEmitter<HTMLBqDatePickerElement>;
     connectedCallback(): Promise<void>;
-    componentWillLoad(): void;
+    componentDidLoad(): Promise<void>;
     formAssociatedCallback(): void;
     formResetCallback(): void;
     handleOpenChange(ev: CustomEvent<{
@@ -258,9 +259,7 @@ export declare class BqDatePicker {
     private handleCalendarRangeStart;
     private handleCalendarRangeEnd;
     private handleClearClick;
-    private handleLabelSlotChange;
-    private handlePrefixSlotChange;
-    private handleSuffixSlotChange;
+    private handleSlotChange;
     private generateCalendarMonth;
     /**
      * Generates an array of Elements representing the calendar months.

package/dist/types/components/date-picker/bq-date-picker.types.d.ts

@@ -1,3 +1,19 @@
 export type DaysOfWeek = 0 | 1 | 2 | 3 | 4 | 5 | 6;
 export declare const DATE_PICKER_TYPE: readonly ["single", "multi", "range"];
 export type TDatePickerType = (typeof DATE_PICKER_TYPE)[number];
+export type TCalendarDate = {
+    focusedDate: string;
+    value: string;
+    min?: string;
+    max?: string;
+    months?: number;
+    tentative?: string;
+    pageBy?: 'single' | 'months';
+    firstDayOfWeek?: number;
+    showOutsideDays?: boolean;
+    isDateDisallowed?: (date: Date) => boolean;
+    locale?: string;
+    onChange?: (ev: Event) => void;
+    onRangestart?: (ev: CustomEvent) => void;
+    onRangeend?: (ev: CustomEvent) => void;
+};

package/dist/types/components/date-picker/helper/callyLibrary.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Checks if the Cally library is already loaded in the document
+ * @returns {boolean} True if the library is loaded
+ */
+export declare const isCallyLibraryLoaded: () => boolean;
+/**
+ * Loads the Cally library for the date picker component
+ * @throws {Error} If the library fails to load
+ * @return {Promise<void>}
+ */
+export declare const loadCallyLibrary: () => Promise<void>;

package/dist/types/components/dialog/bq-dialog.d.ts

@@ -128,7 +128,6 @@ export declare class BqDialog {
     private handleClose;
     private handleOpen;
     private handleTransitionEnd;
-    private handleContentSlotChange;
-    private handleFooterSlotChange;
+    private handleSlotChange;
     render(): any;
 }

package/dist/types/components/drawer/bq-drawer.d.ts

@@ -96,6 +96,7 @@ export declare class BqDrawer {
     /** Callback handler to be called after the drawer has been closed */
     bqAfterClose: EventEmitter;
     componentWillLoad(): void;
+    componentDidLoad(): void;
     handleMouseClick(event: MouseEvent): Promise<void>;
     handleKeyDown(event: KeyboardEvent): Promise<void>;
     /** Method to be called to hide the drawer component */

package/dist/types/components/empty-state/bq-empty-state.d.ts

@@ -35,8 +35,8 @@ export declare class BqEmptyState {
     size: TEmptyStateSize;
     checkPropValues(): void;
     componentWillLoad(): void;
-    private handleContentSlotChange;
-    private handleFooterSlotChange;
+    componentDidLoad(): void;
+    private handleSlotChange;
     private get iconSize();
     render(): any;
 }

package/dist/types/components/input/bq-input.d.ts

@@ -216,6 +216,7 @@ export declare class BqInput {
         el: HTMLBqInputElement;
     }>;
     componentWillLoad(): void;
+    componentDidLoad(): void;
     formAssociatedCallback(): void;
     formResetCallback(): void;
     private handleBlur;
@@ -226,9 +227,6 @@ export declare class BqInput {
     private handleClearClick;
     private setFormValue;
     private updateFormValidity;
-    private handleLabelSlotChange;
-    private handlePrefixSlotChange;
-    private handleSuffixSlotChange;
-    private handleHelperTextSlotChange;
+    private handleSlotChange;
     render(): any;
 }

package/dist/types/components/notification/bq-notification.d.ts

@@ -107,6 +107,7 @@ export declare class BqNotification {
     bqAfterClose: EventEmitter;
     connectedCallback(): void;
     componentWillLoad(): void;
+    componentDidLoad(): void;
     afterNotificationClose(): void;
     /** Method to be called to hide the notification component */
     hide(): Promise<void>;
@@ -117,8 +118,7 @@ export declare class BqNotification {
     private handleHide;
     private handleShow;
     private handleTransitionEnd;
-    private handleContentSlotChange;
-    private handleFooterSlotChange;
+    private handleSlotChange;
     private get iconName();
     render(): any;
 }

package/dist/types/components/option/bq-option.d.ts

@@ -67,12 +67,12 @@ export declare class BqOption {
     bqClick: EventEmitter<HTMLBqOptionElement>;
     /** Handler to be called on enter key press */
     bqEnter: EventEmitter<HTMLBqOptionElement>;
+    componentDidLoad(): void;
     onKeyDown(event: KeyboardEvent): void;
     private onBlur;
     private onFocus;
     private onClick;
-    private onSlotChange;
-    private handleSuffixSlotChange;
+    private handleSlotChange;
     private get isDisabledOrHidden();
     render(): any;
 }

package/dist/types/components/page-title/bq-page-title.d.ts

@@ -52,6 +52,7 @@ export declare class BqPageTitle {
     private haveBackNavigation;
     private hasSuffix;
     private hasSubTitle;
+    componentDidLoad(): void;
     private handleSlotChange;
     render(): any;
 }

package/dist/types/components/select/bq-select.d.ts

@@ -219,10 +219,7 @@ export declare class BqSelect {
     private handleSearchFilter;
     private handleClearClick;
     private handleTagRemove;
-    private handleLabelSlotChange;
-    private handlePrefixSlotChange;
-    private handleSuffixSlotChange;
-    private handleHelperTextSlotChange;
+    private handleSlotChange;
     private resetOptionsVisibility;
     private syncItemsFromValue;
     /**

package/dist/types/components/tab/bq-tab.d.ts

@@ -79,6 +79,7 @@ export declare class BqTab {
     /** Handler to be called when the tab key is pressed */
     bqKeyDown: EventEmitter<KeyboardEvent>;
     componentWillLoad(): void;
+    componentDidLoad(): void;
     /**
      * Simulate a click event on the native `<button>` HTML element used under the hood.
      * Use this method instead of the global `element.click()`.

package/dist/types/components/tag/bq-tag.d.ts

@@ -89,6 +89,7 @@ export declare class BqTag {
     /** Handler to be called when tag is focused */
     bqFocus: EventEmitter<HTMLBqTagElement>;
     componentWillLoad(): void;
+    componentDidLoad(): void;
     /** Method to be called to remove the tag component */
     hide(): Promise<void>;
     /** Method to be called to show the tag component */

package/dist/types/components/textarea/bq-textarea.d.ts

@@ -185,8 +185,7 @@ export declare class BqTextarea {
     private handleChange;
     private handleInput;
     private autoResize;
-    private handleLabelSlotChange;
-    private handleHelperTextSlotChange;
+    private handleSlotChange;
     private setFormValue;
     private updateFormValidity;
     private clearSelection;

package/dist/types/global.d.ts

@@ -1,24 +1,14 @@
 import type { JSXBase } from './stencil-public-runtime';
-import type { CalendarDateProps, CalendarMonthProps, CalendarMultiProps, CalendarRangeProps } from 'cally';
 
 /* eslint-disable @typescript-eslint/ban-ts-comment */
 // @ts-ignore: this imported file declaration is generated by the build process
 // eslint-disable-next-line import-x/no-unresolved
 import type { CustomElements } from '../cem/beeq';
 
-type EventName<T> = T extends `on${infer Rest}` ? `on${Capitalize<Lowercase<Rest>>}` : T;
-type MapEvents<T> = {
-  [K in keyof T as EventName<K>]: T[K];
-};
-
 declare module '@stencil/core' {
   // eslint-disable-next-line @typescript-eslint/no-namespace
   export namespace JSX {
     interface IntrinsicElements extends CustomElements {
-      'calendar-multi': CalendarMultiProps & JSXBase.HTMLAttributes<CalendarMultiProps>;
-      'calendar-range': MapEvents<CalendarRangeProps> & JSXBase.HTMLAttributes<CalendarDateProps>;
-      'calendar-date': CalendarDateProps & JSXBase.HTMLAttributes<CalendarDateProps>;
-      'calendar-month': CalendarMonthProps & JSXBase.HTMLAttributes<CalendarMonthProps>;
       // Extend the global slot HTML element to include the id and class attributes
       slot: JSXBase.SlotAttributes & { id?: string; class?: string };
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@beeq/core",
-  "version": "1.8.3",
+  "version": "1.8.4",
   "license": "Apache-2.0",
   "description": "BEEQ, a Design System components ruled by Endavan developers :)",
   "main": "./dist/index.cjs.js",
@@ -15,8 +15,7 @@
   "dependencies": {
     "@floating-ui/core": "^1.6.9",
     "@floating-ui/dom": "^1.6.13",
-    "@stencil/core": "^4.25.1",
-    "cally": "^0.7.2"
+    "@stencil/core": "^4.25.1"
   },
   "repository": {
     "type": "git",

package/dist/beeq/p-15bf8ffd.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["ALERT_TYPE","bqAlertCss","BqAlertStyle0","BqAlert","autoDismissDebounce","bodyElem","footerElem","alertElement","hasContent","hasFooter","autoDismiss","border","disableClose","hideIcon","open","time","type","sticky","handleTimeout","this","cancel","debounce","hide","handleOpenChange","handleHide","handleShow","checkPropValues","validatePropValue","el","bqHide","bqShow","bqAfterShow","bqAfterHide","componentWillLoad","componentDidLoad","classList","add","show","async","ev","emit","defaultPrevented","leave","handleTransitionEnd","remove","enter","handleContentSlotChange","hasSlotContent","handleFooterSlotChange","iconName","error","success","warning","render","style","h","Host","key","class","hidden","role","ref","div","part","appearance","size","onClick","bind","name","exportparts","onSlotchange"],"sources":["../../packages/beeq/src/components/alert/bq-alert.types.ts","../../packages/beeq/src/components/alert/scss/bq-alert.scss?tag=bq-alert&encapsulation=shadow","../../packages/beeq/src/components/alert/bq-alert.tsx"],"sourcesContent":["export const ALERT_TYPE = ['info', 'success', 'warning', 'error', 'default'] as const;\nexport type TAlertType = (typeof ALERT_TYPE)[number];\n\nexport const ALERT_BORDER_RADIUS = ['none', 'xs2', 'xs', 's', 'm', 'l', 'full'] as const;\nexport type TAlertBorderRadius = (typeof ALERT_BORDER_RADIUS)[number];\n","/* -------------------------------------------------------------------------- */\n/*                        Alert styles                        */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-alert.variables';\n\n:host {\n  @apply block;\n}\n\n:host(.is-hidden) {\n  @apply hidden;\n}\n\n:host(.is-sticky) {\n  @apply fixed inset-0 z-[var(--bq-alert--z-index)] is-full inset-bs-0;\n\n  .bq-alert {\n    @apply items-center justify-center rounded-none;\n  }\n}\n\n.bq-alert {\n  @apply relative flex transition-all min-is-[--bq-alert--min-width] p-b-[--bq-alert--padding] p-i-[--bq-alert--padding];\n  @apply rounded-[var(--bq-alert--border-radius)] border-[length:--bq-alert--border-width];\n\n  border-style: var(--bq-alert--border-style);\n}\n\n/**\n * Set the alert background and border color based on the type value selected\n */\n\n.bq-alert__default {\n  @apply border-[color:--bq-alert--border-default] bg-[color:--bq-alert--background-default];\n}\n\n.bq-alert__error {\n  @apply border-[color:--bq-alert--border-error] bg-[color:--bq-alert--background-error];\n}\n\n.bq-alert__info {\n  @apply border-[color:--bq-alert--border-info] bg-[color:--bq-alert--background-info];\n}\n\n.bq-alert__success {\n  @apply border-[color:--bq-alert--border-success] bg-[color:--bq-alert--background-success];\n}\n\n.bq-alert__warning {\n  @apply border-[color:--bq-alert--border-warning] bg-[color:--bq-alert--background-warning];\n}\n\n/**\n * Set the alert icon color based on the type value selected\n */\n.bq-alert__icon {\n  &--default {\n    @apply text-[color:--bq-alert--icon-color-default];\n  }\n\n  &--error {\n    @apply text-[color:--bq-alert--icon-color-error];\n  }\n\n  &--info {\n    @apply text-[color:--bq-alert--icon-color-info];\n  }\n\n  &--success {\n    @apply text-[color:--bq-alert--icon-color-success];\n  }\n\n  &--warning {\n    @apply text-[color:--bq-alert--icon-color-warning];\n  }\n}\n\n/**\n * Tweak the close bq-button styles so it remain small without extra padding\n */\n.bq-alert__close::part(button) {\n  @apply rounded-s border-0 bs-fit p-b-0 p-i-0;\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Method, Prop, State, Watch } from '@stencil/core';\n\nimport { ALERT_TYPE, TAlertBorderRadius, TAlertType } from './bq-alert.types';\nimport { debounce, enter, hasSlotContent, leave, TDebounce, validatePropValue } from '../../shared/utils';\n\n/**\n * The Alert is a user interface component used to convey important information to the user in a clear and concise manner.\n * It can be used to notify users of success, failure, warning, or any other type of information that needs to be brought to their attention.\n *\n * @example How to use it\n * ```html\n * <bq-alert>\n *   <bq-icon name=\"star\" slot=\"icon\"></bq-icon>\n *   Title\n *   <span slot=\"body\">\n *     Description\n *     <a class=\"bq-link\" href=\"https://example.com\">Link</a>\n *   </span>\n *   <div slot=\"footer\">\n *     <bq-button appearance=\"primary\" size=\"small\">Button</bq-button>\n *     <bq-button appearance=\"link\" size=\"small\">Button</bq-button>\n *   </div>\n * </bq-alert>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/848a50-alert\n * @status stable\n *\n * @dependency bq-button\n * @dependency bq-icon\n *\n * @attr {boolean} [auto-dismiss=false] - If true, the alert will automatically hide after the specified amount of time\n * @attr {\"none\" | \"xs2\" | \"xs\" | \"s\" | \"m\" | \"l\" | \"full\"} [border='s'] - The corner radius of the alert component\n * @attr {boolean} [disable-close=false] - If true, the close button at the top right of the alert won't be shown\n * @attr {boolean} [hide-icon=false] - If true, the alert icon won't be shown\n * @attr {boolean} [open=false] - If true, the alert will be shown\n * @attr {number} [time=3000] - The length of time, in milliseconds, after which the alert will close itself. Only valid if `autoDismiss=\"true\"`\n * @attr {\"info\" | \"success\" | \"warning\" | \"error\" | \"default\"} [type='default'] - Type of Alert\n * @attr {boolean} [sticky=false] - If true, the alert component will remain fixed at the top of the page, occupying the full viewport\n *\n * @event bqHide - Callback handler to be called when the alert is hidden\n * @event bqShow - Callback handler to be called when the alert is shown\n * @event bqAfterShow - Callback handler to be called after the alert has been shown\n * @event bqAfterHide - Callback handler to be called after the alert has been hidden\n *\n * @slot - The alert title content (no slot name required)\n * @slot body - The alert description content\n * @slot footer - The alert footer content\n * @slot icon - The predefined icon based on the alert type (info, success, warning, error, default)\n * @slot btn-close - The close button of the alert\n *\n * @part base - The `<div>` container of the predefined bq-icon component\n * @part body - The container `<div>` that wraps the alert description content\n * @part btn-close - The `bq-button` used to close the alert\n * @part content - The container `<div>` that wraps all the alert content (title, description, footer)\n * @part footer - The container `<div>` that wraps the alert footer content\n * @part icon - The `<bq-icon>` element used to render a predefined icon based on the alert type (info, success, warning, error, default)\n * @part icon-outline - The container `<div>` that wraps the icon element\n * @part main - The container `<div>` that wraps the alert main content (title, description)\n * @part svg - The `<svg>` element of the predefined bq-icon component\n * @part title - The container `<div>` that wraps the alert title content\n * @part wrapper - The wrapper container `<div>` of the element inside the shadow DOM\n *\n * @cssprop --bq-alert--background - The alert background color\n * @cssprop --bq-alert--border-radius - The alert border radius\n * @cssprop --bq-alert--content-footer-gap - The alert content and footer gap\n * @cssprop --bq-alert--title-body-gap - The alert title and body gap\n *\n * @cssprop --bq-alert--border-color - The alert border color\n * @cssprop --bq-alert--border-style - The alert border style\n * @cssprop --bq-alert--border-width - The alert border width\n *\n * @cssprop --bq-alert--background-info - The alert background color for info type\n * @cssprop --bq-alert--background-success - The alert background color for success type\n * @cssprop --bq-alert--background-warning - The alert background color for warning type\n * @cssprop --bq-alert--background-error - The alert background color for error type\n *\n * @cssprop --bq-alert--border-info - The alert border color for info type\n * @cssprop --bq-alert--border-success - The alert border color for success type\n * @cssprop --bq-alert--border-warning - The alert border color for warning type\n * @cssprop --bq-alert--border-error - The alert border color for error type\n *\n * @cssprop --bq-alert--icon-color-info - The alert icon color for info type\n * @cssprop --bq-alert--icon-color-success - The alert icon color for success type\n * @cssprop --bq-alert--icon-color-warning - The alert icon color for warning type\n * @cssprop --bq-alert--icon-color-error - The alert icon color for error type\n *\n * @cssprop --bq-alert--padding - The alert padding\n * @cssprop --bq-alert--min-width - The alert min width\n */\n@Component({\n  tag: 'bq-alert',\n  styleUrl: './scss/bq-alert.scss',\n  shadow: true,\n})\nexport class BqAlert {\n  // Own Properties\n  // ====================\n\n  private autoDismissDebounce: TDebounce<void>;\n  private bodyElem: HTMLDivElement;\n  private footerElem: HTMLDivElement;\n  private alertElement: HTMLDivElement;\n\n  // Reference to host HTML element\n  // ===================================\n\n  @Element() el!: HTMLBqAlertElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  @State() private hasContent = false;\n  @State() private hasFooter = false;\n\n  // Public Property API\n  // ========================\n\n  /** If true, the alert will automatically hide after the specified amount of time */\n  @Prop({ reflect: true }) autoDismiss: boolean;\n\n  /** The corner radius of the alert component */\n  @Prop({ reflect: true }) border: TAlertBorderRadius = 's';\n\n  /** If true, the close button at the top right of the alert won't be shown */\n  @Prop({ reflect: true }) disableClose: boolean;\n\n  /** If true, the alert icon won't be shown */\n  @Prop({ reflect: true }) hideIcon: boolean;\n\n  /** If true, the alert will be shown */\n  @Prop({ reflect: true, mutable: true }) open: boolean;\n\n  /** The length of time, in milliseconds, after which the alert will close itself. Only valid if `autoDismiss=\"true\"` */\n  @Prop({ reflect: true }) time: number = 3000;\n\n  /** Type of Alert */\n  @Prop({ reflect: true }) type: TAlertType = 'default';\n\n  /** If true, the alert component will remain fixed at the top of the page, occupying the full viewport */\n  @Prop({ reflect: true }) sticky: boolean;\n\n  // Prop lifecycle events\n  // =======================\n  @Watch('autoDismiss')\n  @Watch('time')\n  handleTimeout() {\n    this.autoDismissDebounce?.cancel();\n    if (!this.autoDismiss) return;\n\n    this.autoDismissDebounce = debounce(() => {\n      this.hide();\n    }, this.time);\n    // Make sure to autodismiss the notification if the `auto-dismiss` value changed while open\n    if (this.open) this.autoDismissDebounce();\n  }\n\n  @Watch('open')\n  handleOpenChange() {\n    this.autoDismissDebounce?.cancel();\n\n    if (!this.open) {\n      this.handleHide();\n      return;\n    }\n\n    this.handleShow();\n\n    if (this.autoDismiss) {\n      this.autoDismissDebounce();\n    }\n  }\n\n  @Watch('type')\n  checkPropValues() {\n    validatePropValue(ALERT_TYPE, 'info', this.el, 'type');\n  }\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  /** Callback handler to be called when the alert is hidden */\n  @Event() bqHide!: EventEmitter;\n\n  /** Callback handler to be called when the alert is shown */\n  @Event() bqShow!: EventEmitter;\n\n  /** Callback handler to be called after the alert has been shown */\n  @Event() bqAfterShow!: EventEmitter;\n\n  /** Callback handler to be called after the alert has been hidden */\n  @Event() bqAfterHide!: EventEmitter;\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentWillLoad() {\n    this.checkPropValues();\n    this.handleTimeout();\n  }\n\n  componentDidLoad() {\n    if (!this.open) {\n      this.el.classList.add('is-hidden');\n    }\n  }\n\n  // Listeners\n  // ==============\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  /** Method to be called to hide the alert component */\n  @Method()\n  async hide(): Promise<void> {\n    this.open = false;\n  }\n\n  /** Method to be called to show the alert component */\n  @Method()\n  async show(): Promise<void> {\n    this.open = true;\n  }\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  private handleHide = async () => {\n    const ev = this.bqHide.emit(this.el);\n    if (!ev.defaultPrevented) {\n      await leave(this.alertElement);\n      this.el.classList.add('is-hidden');\n      this.handleTransitionEnd();\n    }\n  };\n\n  private handleShow = async () => {\n    const ev = this.bqShow.emit(this.el);\n    if (!ev.defaultPrevented) {\n      this.el.classList.remove('is-hidden');\n      await enter(this.alertElement);\n      this.handleTransitionEnd();\n    }\n  };\n\n  private handleTransitionEnd = () => {\n    if (this.open) {\n      this.bqAfterShow.emit();\n      return;\n    }\n\n    this.bqAfterHide.emit();\n  };\n\n  private handleContentSlotChange = () => {\n    this.hasContent = hasSlotContent(this.bodyElem, 'body');\n  };\n\n  private handleFooterSlotChange = () => {\n    this.hasFooter = hasSlotContent(this.footerElem, 'footer');\n  };\n\n  private get iconName(): string {\n    const iconName = {\n      error: 'x-circle',\n      success: 'check-circle',\n      warning: 'warning-circle',\n    };\n\n    return iconName[this.type] || 'info';\n  }\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    const style = {\n      ...(this.border && { '--bq-alert--border-radius': `var(--bq-radius--${this.border})` }),\n    };\n\n    return (\n      <Host\n        style={style}\n        class={{ 'is-sticky': this.sticky }}\n        aria-hidden={!this.open ? 'true' : 'false'}\n        hidden={!this.open ? 'true' : 'false'}\n        role=\"alert\"\n      >\n        <div\n          class={{\n            [`bq-alert bq-alert__${this.type}`]: true,\n            'is-sticky': this.sticky,\n          }}\n          data-transition-enter=\"transition ease-out duration-300\"\n          data-transition-enter-start=\"opacity-0\"\n          data-transition-enter-end=\"opacity-100\"\n          data-transition-leave=\"transition ease-in duration-200\"\n          data-transition-leave-start=\"opacity-100\"\n          data-transition-leave-end=\"opacity-0\"\n          ref={(div) => (this.alertElement = div)}\n          part=\"wrapper\"\n        >\n          {/* CLOSE BUTTON */}\n          {!this.disableClose && (\n            <bq-button\n              class=\"bq-alert__close absolute end-5 focus-visible:focus [&::part(label)]:inline-flex\"\n              appearance=\"text\"\n              size=\"small\"\n              onClick={this.hide.bind(this)}\n              part=\"btn-close\"\n            >\n              <slot name=\"btn-close\">\n                <bq-icon name=\"x\" />\n              </slot>\n            </bq-button>\n          )}\n          {/* ICON */}\n          <div\n            class={{\n              [`bq-alert__icon--${this.type} me-s flex text-left align-top`]: true,\n              '!hidden': this.hideIcon,\n            }}\n            part=\"icon-outline\"\n          >\n            <slot name=\"icon\">\n              {this.type !== 'default' && <bq-icon name={this.iconName} part=\"icon\" exportparts=\"base,svg\" />}\n            </slot>\n          </div>\n          {/* MAIN */}\n          <div class=\"flex flex-col items-start gap-[--bq-alert--content-footer-gap]\" part=\"main\">\n            <div class=\"flex flex-col gap-[--bq-alert--title-body-gap]\" part=\"content\">\n              {/* TITLE */}\n              <div\n                class={{\n                  'title-font font-semibold leading-regular text-primary': true,\n                  'flex items-center': this.sticky,\n                }}\n                part=\"title\"\n              >\n                <slot />\n              </div>\n              {/* BODY */}\n              <div\n                class={{ 'text-s leading-regular': true, '!hidden': !this.hasContent }}\n                ref={(div) => (this.bodyElem = div)}\n                part=\"body\"\n              >\n                <slot name=\"body\" onSlotchange={this.handleContentSlotChange} />\n              </div>\n            </div>\n            {/* FOOTER */}\n            <div\n              class={{ 'flex items-start gap-xs': true, '!hidden': !this.hasFooter }}\n              ref={(div) => (this.footerElem = div)}\n              part=\"footer\"\n            >\n              <slot name=\"footer\" onSlotchange={this.handleFooterSlotChange} />\n            </div>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/beeq/p-19ea2c90.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["DRAWER_POSITIONS","DRAWER_PLACEMENT","bqDrawerCss","BqDrawerStyle0","BqDrawer","footerElem","drawerElem","OPEN_CSS_CLASS","hasFooter","hasIcon","enableBackdrop","closeOnClickOutside","closeOnEsc","open","placement","position","handleOpenChange","this","handleAfterHide","handleAfterShow","handlePlacementChange","isNil","console","warn","validatePropValue","el","synPositionMap","right","left","handlePositionChange","syncPlacementMap","end","start","bqClose","bqOpen","bqAfterOpen","bqAfterClose","componentWillLoad","handleMouseClick","event","button","rect","getBoundingClientRect","clientX","hide","handleKeyDown","key","ev","emit","defaultPrevented","show","handleFooterSlotChange","hasSlotContent","async","leave","handleTransitionEnd","classList","add","enter","remove","isPositionStart","isPositionEnd","render","h","Host","class","tabIndex","part","ref","div","hidden","role","id","name","appearance","size","slot","exportparts","onClick","bind","title","block","dashed","onSlotchange"],"sources":["../../packages/beeq/src/components/drawer/bq-drawer.types.ts","../../packages/beeq/src/components/drawer/scss/bq-drawer.scss?tag=bq-drawer&encapsulation=shadow","../../packages/beeq/src/components/drawer/bq-drawer.tsx"],"sourcesContent":["export const DRAWER_POSITIONS = ['start', 'end'] as const;\nexport type TDrawerPosition = (typeof DRAWER_POSITIONS)[number];\n// !TO BE REMOVED: `placement` is deprecated and it will be removed in the future\nexport const DRAWER_PLACEMENT = ['left', 'right'] as const;\nexport type TDrawerPlacement = (typeof DRAWER_PLACEMENT)[number];\n","/* -------------------------------------------------------------------------- */\n/*                        Drawer styles                        */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-drawer.variables';\n\n:host {\n  @apply invisible #{!important};\n}\n\n:host(.bq-drawer--open) {\n  @apply visible #{!important};\n}\n\n.bq-drawer {\n  @apply fixed z-[--bq-drawer--zIndex] flex flex-col gap-[--bq-drawer--gap] bg-primary shadow-m is-[--bq-drawer--width] max-is-full p-b-[--bq-drawer--paddingY] p-i-[--bq-drawer--paddingX] inset-b-0;\n}\n","import { Component, Element, Event, EventEmitter, h, Host, Listen, Method, Prop, State, Watch } from '@stencil/core';\n\nimport { DRAWER_PLACEMENT, DRAWER_POSITIONS, TDrawerPlacement, TDrawerPosition } from './bq-drawer.types';\nimport { enter, hasSlotContent, isNil, leave, validatePropValue } from '../../shared/utils';\n\n/**\n * The Drawer component provides a sliding panel interface commonly used for navigation or presenting additional content without taking up significant screen space.\n *\n * @example How to use it\n * ```html\n * <bq-drawer position=\"end\">\n *   <div class=\"flex gap-xs\" slot=\"title\">Title</div>\n *   <div class=\"...\">\n *     Content\n *   </div>\n *   <div class=\"flex flex-1 justify-center gap-xs\" slot=\"footer\">\n *     <bq-button appearance=\"primary\" block=\"\" size=\"small\">Button</bq-button>\n *     <bq-button appearance=\"link\" block=\"\" size=\"small\">Button</bq-button>\n *   </div>\n * </bq-drawer>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/871139-drawer\n * @status stable\n *\n * @dependency bq-button\n * @dependency bq-icon\n * @dependency bq-divider\n *\n * @attr {boolean} enable-backdrop - If true, the backdrop overlay will be shown when the drawer opens.\n * @attr {boolean} close-on-click-outside - If true, the drawer will not close when clicking outside the panel.\n * @attr {boolean} close-on-esc - If true, the drawer will not close when the [Esc] key is pressed.\n * @attr {boolean} open - If true, the drawer component will be shown.\n * @attr {\"start\" | \"end\"} position - Defines the position of the drawer.\n *\n * @method show - Method to be called to show the drawer component.\n * @method hide - Method to be called to hide the drawer component.\n *\n * @event bqClose - Callback handler to be called when the drawer is closed.\n * @event bqOpen - Callback handler to be called when the drawer is opened.\n * @event bqAfterOpen - Callback handler to be called after the drawer has been opened.\n * @event bqAfterClose - Callback handler to be called after the drawer has been closed.\n *\n * @slot title - The title content of the drawer.\n * @slot - The body content of the drawer.\n * @slot footer - The footer content of the drawer.\n * @slot button-close - The close button content of the drawer.\n * @slot footer-divider - The footer divider content of the drawer.\n *\n * @part backdrop - The `<div>` that holds the backdrop overlay.\n * @part button-close - The BqButton that closes the drawer.\n * @part button-close__btn - The native button used under the hood that closes the drawer.\n * @part button-close__label - The text inside the native button that closes the drawer.\n * @part panel - The `<div>` that holds the drawer entire content.\n * @part header - The `<header>` that holds the icon, title, and close button.\n * @part title - The `<div>` that holds the title content.\n * @part body - The `<main>` that holds the drawer body content.\n * @part footer - The `<footer>` that holds footer content.\n *\n * @cssprop --bq-drawer--backgroundBackdrop - Background color of the backdrop\n * @cssprop --bq-drawer--gap - Gap between the drawer and the viewport\n * @cssprop --bq-drawer--width - Width of the drawer\n * @cssprop --bq-drawer--paddingX - Padding left and right of the drawer\n * @cssprop --bq-drawer--paddingY - Padding top and bottom of the drawer\n * @cssprop --bq-drawer--zIndex - Z-index of the drawer component\n */\n@Component({\n  tag: 'bq-drawer',\n  styleUrl: './scss/bq-drawer.scss',\n  shadow: true,\n})\nexport class BqDrawer {\n  // Own Properties\n  // ====================\n\n  private footerElem: HTMLElement;\n  private drawerElem: HTMLDivElement;\n  private OPEN_CSS_CLASS = 'bq-drawer--open';\n\n  // Reference to host HTML element\n  // ===================================\n\n  @Element() el!: HTMLBqDrawerElement;\n\n  // State() variables\n  // Inlined decorator, alphabetical order\n  // =======================================\n\n  @State() private hasFooter = false;\n  @State() hasIcon: boolean = false;\n\n  // Public Property API\n  // ========================\n\n  /** If true, the backdrop overlay will be shown when the drawer opens */\n  @Prop({ reflect: true }) enableBackdrop = false;\n\n  /** If true, the drawer will not close when clicking outside the panel */\n  @Prop({ reflect: true }) closeOnClickOutside = false;\n\n  /** If true, the dialog will not close when the [Esc] key is pressed */\n  @Prop({ reflect: true }) closeOnEsc = false;\n\n  /** If true, the drawer component will be shown */\n  @Prop({ reflect: true, mutable: true }) open: boolean;\n\n  /** @deprecated Defines the position of the drawer */\n  @Prop({ reflect: true, mutable: true }) placement: TDrawerPlacement = 'right';\n\n  /** Defines the position of the drawer */\n  @Prop({ reflect: true, mutable: true }) position: TDrawerPosition = 'end';\n\n  // Prop lifecycle events\n  // =======================\n\n  @Watch('open')\n  async handleOpenChange() {\n    if (!this.open) {\n      await this.handleAfterHide();\n      return;\n    }\n\n    await this.handleAfterShow();\n  }\n\n  /**\n   * !TO BE REMOVED: Delete this `@Watch()` once the deprecated `placement` property is removed\n   * We need to maintain retro-compatibility with the deprecated `placement` property\n   */\n  @Watch('placement')\n  handlePlacementChange() {\n    if (!isNil(this.placement)) {\n      console.warn(\n        `❗️ [bq-drawer]: the 'placement' prop is deprecated and it will be removed in the future. Please use 'position' instead.`,\n      );\n    }\n    validatePropValue(DRAWER_PLACEMENT, 'right', this.el, 'placement');\n    // Sync 'position' property\n    const synPositionMap = {\n      right: 'end',\n      left: 'start',\n    };\n    this.position = (synPositionMap[this.placement] as TDrawerPosition) || this.position;\n  }\n\n  @Watch('position')\n  handlePositionChange() {\n    validatePropValue(DRAWER_POSITIONS, 'start', this.el, 'position');\n    /**\n     * Sync 'placement' property\n     * !TO BE REMOVED: Delete the code below once the deprecated `placement` property is removed\n     */\n    const syncPlacementMap = {\n      end: 'right',\n      start: 'left',\n    };\n    this.placement = (syncPlacementMap[this.position] as TDrawerPlacement) || this.placement;\n  }\n\n  // Events section\n  // Requires JSDocs for public API documentation\n  // ==============================================\n\n  /** Callback handler to be called when the drawer is closed */\n  @Event() bqClose!: EventEmitter;\n\n  /** Callback handler to be called when the drawer is opened */\n  @Event() bqOpen!: EventEmitter;\n\n  /** Callback handler to be called after the drawer has been opened */\n  @Event() bqAfterOpen!: EventEmitter;\n\n  /** Callback handler to be called after the drawer has been closed */\n  @Event() bqAfterClose!: EventEmitter;\n\n  // Component lifecycle events\n  // Ordered by their natural call order\n  // =====================================\n\n  componentWillLoad() {\n    this.handlePositionChange();\n    // !TO BE REMOVED: Delete this once the deprecated `placement` property is removed\n    this.handlePlacementChange();\n  }\n\n  // Listeners\n  // ==============\n\n  @Listen('mousedown', { target: 'window', capture: true })\n  async handleMouseClick(event: MouseEvent) {\n    if (!this.open) return;\n    if (!this.drawerElem || this.closeOnClickOutside) return;\n    // Skip if the mouse button is not the main button\n    if (event.button !== 0) return;\n\n    const rect = this.drawerElem.getBoundingClientRect();\n    if (event.clientX < rect.left || event.clientX > rect.right) {\n      await this.hide();\n    }\n  }\n\n  @Listen('keydown', { target: 'window', capture: true })\n  async handleKeyDown(event: KeyboardEvent) {\n    if (!this.open) return;\n    if (!this.drawerElem || this.closeOnEsc || !(event.key === 'Escape' || event.key === 'Esc')) return;\n\n    await this.hide();\n  }\n\n  // Public methods API\n  // These methods are exposed on the host element.\n  // Always use two lines.\n  // Public Methods must be async.\n  // Requires JSDocs for public API documentation.\n  // ===============================================\n\n  /** Method to be called to hide the drawer component */\n  @Method()\n  async hide(): Promise<void> {\n    const ev = this.bqClose.emit();\n    if (ev.defaultPrevented) return;\n\n    this.open = false;\n  }\n\n  /** Method to be called to show the drawer component */\n  @Method()\n  async show(): Promise<void> {\n    const ev = this.bqOpen.emit();\n    if (ev.defaultPrevented) return;\n\n    this.open = true;\n  }\n\n  // Local methods\n  // Internal business logic.\n  // These methods cannot be called from the host element.\n  // =======================================================\n\n  private handleFooterSlotChange = () => {\n    this.hasFooter = hasSlotContent(this.footerElem, 'footer');\n  };\n\n  private handleAfterHide = async () => {\n    if (!this.drawerElem) return;\n\n    await leave(this.drawerElem);\n    this.handleTransitionEnd();\n  };\n\n  private handleAfterShow = async () => {\n    if (!this.drawerElem) return;\n\n    this.el.classList.add(this.OPEN_CSS_CLASS);\n    await enter(this.drawerElem);\n    this.handleTransitionEnd();\n  };\n\n  private handleTransitionEnd = () => {\n    if (this.open) {\n      this.bqAfterOpen.emit();\n      return;\n    }\n\n    this.bqAfterClose.emit();\n    this.el.classList.remove(this.OPEN_CSS_CLASS);\n  };\n\n  private get isPositionStart() {\n    // !TO BE REMOVED: `placement` is deprecated and will be removed in the future\n    return this.position === 'start' || this.placement === 'left';\n  }\n\n  private get isPositionEnd() {\n    // !TO BE REMOVED: `placement` is deprecated and will be removed in the future\n    return this.position === 'end' || this.placement === 'right';\n  }\n\n  // render() function\n  // Always the last one in the class.\n  // ===================================\n\n  render() {\n    return (\n      <Host>\n        {/* BACKDROP */}\n        {this.enableBackdrop && (\n          <div\n            class={{\n              'fixed inset-0 block bg-[--bq-drawer--backgroundBackdrop] opacity-0 transition-opacity duration-300':\n                true,\n              'pointer-events-none': !this.open,\n              'opacity-60': this.open,\n            }}\n            tabIndex={-1}\n            part=\"backdrop\"\n          />\n        )}\n        {/* DRAWER PANEL */}\n        <div\n          class={{\n            [`bq-drawer transition-all duration-300 ease-in-out ${this.position || this.placement}`]: true,\n            '-start-[--bq-drawer--width]': this.isPositionStart,\n            '-end-[--bq-drawer--width]': this.isPositionEnd,\n            'start-0': this.open && this.isPositionStart,\n            'end-0': this.open && this.isPositionEnd,\n          }}\n          ref={(div) => (this.drawerElem = div)}\n          aria-hidden={!this.open ? 'true' : 'false'}\n          aria-labelledby=\"bq-drawer__title\"\n          aria-modal=\"true\"\n          hidden={!this.open}\n          part=\"panel\"\n          role=\"dialog\"\n        >\n          <header class=\"flex items-center\" part=\"header\">\n            <h2\n              class=\"flex-1 items-center justify-between font-bold leading-regular text-primary\"\n              id=\"bq-drawer__title\"\n              part=\"title\"\n            >\n              <slot name=\"title\" />\n            </h2>\n            <div class=\"flex\" part=\"button-close\">\n              <bq-button\n                class=\"[&::part(button)]:rounded-s [&::part(button)]:border-0 [&::part(button)]:bs-fit [&::part(button)]:p-b-0 [&::part(button)]:p-i-0 [&::part(label)]:inline-flex\"\n                appearance=\"text\"\n                size=\"small\"\n                slot=\"button-close\"\n                exportparts=\"button:button-close__btn,label:button-close__label\"\n                onClick={this.hide.bind(this)}\n              >\n                <slot name=\"button-close\">\n                  <bq-icon name=\"x-bold\" role=\"img\" title=\"Close\" />\n                </slot>\n              </bq-button>\n            </div>\n          </header>\n          <main class=\"block flex-auto overflow-auto\" part=\"body\">\n            <slot />\n          </main>\n          <footer\n            class={{\n              block: true,\n              '!hidden': !this.hasFooter,\n            }}\n            ref={(footerElem) => (this.footerElem = footerElem)}\n            part=\"footer\"\n          >\n            <slot name=\"footer-divider\">\n              <bq-divider class=\"mb-m block\" dashed />\n            </slot>\n            <slot name=\"footer\" onSlotchange={this.handleFooterSlotChange} />\n          </footer>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}