@agnos-ui/react-bootstrap 0.3.0 → 0.4.0-next.0

package/components/alert/alert.gen.d.ts

@@ -0,0 +1,119 @@
+import type { WidgetSlotContext, SlotContent, Widget, Directive } from '@agnos-ui/react-headless/types';
+import type { BSContextualClass } from '@agnos-ui/core-bootstrap/types';
+import type { TransitionFn } from '@agnos-ui/react-headless/services/transitions/baseTransitions';
+export type AlertContext = WidgetSlotContext<AlertWidget>;
+export interface AlertState {
+    /**
+     * Is `true` when the alert is hidden. Compared to `visible`, this is updated after the transition is executed.
+     */
+    hidden: boolean;
+    /**
+     * If `true`, alert can be dismissed by the user.
+     * The close button (×) will be displayed and you can be notified of the event with the (close) output.
+     */
+    dismissible: boolean;
+    /**
+     * If `true` the alert is visible to the user
+     */
+    visible: boolean;
+    /**
+     * Accessibility close button label
+     */
+    ariaCloseButtonLabel: string;
+    /**
+     * CSS classes to be applied on the widget main container
+     */
+    className: string;
+    /**
+     * Global template for the alert component
+     */
+    structure: SlotContent<AlertContext>;
+    /**
+     * Template for the alert content
+     */
+    children: SlotContent<AlertContext>;
+    /**
+     * Type of the alert, following bootstrap types.
+     */
+    type: BSContextualClass;
+}
+export interface AlertProps {
+    /**
+     * Callback called when the alert visibility changed.
+     */
+    onVisibleChange: (visible: boolean) => void;
+    /**
+     * Callback called when the alert is hidden.
+     */
+    onHidden: () => void;
+    /**
+     * Callback called when the alert is shown.
+     */
+    onShown: () => void;
+    /**
+     * The transition function will be executed when the alert is displayed or hidden.
+     *
+     * Depending on the value of `animatedOnInit`, the animation can be optionally skipped during the showing process.
+     */
+    transition: TransitionFn;
+    /**
+     * If `true`, alert opening will be animated.
+     *
+     * Animation is triggered  when the `.open()` function is called
+     * or the visible prop is changed
+     */
+    animatedOnInit: boolean;
+    /**
+     * If `true`, alert closing will be animated.
+     *
+     * Animation is triggered  when clicked on the close button (×),
+     * via the `.close()` function or the visible prop is changed
+     */
+    animated: boolean;
+    /**
+     * If `true`, alert can be dismissed by the user.
+     * The close button (×) will be displayed and you can be notified of the event with the (close) output.
+     */
+    dismissible: boolean;
+    /**
+     * If `true` the alert is visible to the user
+     */
+    visible: boolean;
+    /**
+     * Accessibility close button label
+     */
+    ariaCloseButtonLabel: string;
+    /**
+     * CSS classes to be applied on the widget main container
+     */
+    className: string;
+    /**
+     * Global template for the alert component
+     */
+    structure: SlotContent<AlertContext>;
+    /**
+     * Template for the alert content
+     */
+    children: SlotContent<AlertContext>;
+    /**
+     * Type of the alert, following bootstrap types.
+     */
+    type: BSContextualClass;
+}
+export type AlertWidget = Widget<AlertProps, AlertState, AlertApi, object, AlertDirectives>;
+export interface AlertApi {
+    /**
+     * Triggers alert closing programmatically (same as clicking on the close button (×)).
+     */
+    close(): void;
+    /**
+     * Triggers the alert to be displayed for the user.
+     */
+    open(): void;
+}
+export interface AlertDirectives {
+    /**
+     * the transition directive, piloting what is the visual effect of going from hidden to visible
+     */
+    transitionDirective: Directive;
+}

package/components/alert/index.cjs

@@ -1,13 +1,6 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const alert = require("../../alert-DOBOL4nD.cjs");
-const alert$1 = require("@agnos-ui/core-bootstrap/components/alert");
+const alert = require("../../alert-Bn5ooyqK.cjs");
 exports.Alert = alert.Alert;
 exports.createAlert = alert.createAlert;
-Object.keys(alert$1).forEach((k) => {
-  if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k))
-    Object.defineProperty(exports, k, {
-      enumerable: true,
-      get: () => alert$1[k]
-    });
-});
+exports.getAlertDefaultConfig = alert.getAlertDefaultConfig;

package/components/alert/index.js

@@ -1,6 +1,6 @@
-import { A, c } from "../../alert-DWq65Emo.js";
-export * from "@agnos-ui/core-bootstrap/components/alert";
+import { A, c, g } from "../../alert-DKl7HLhb.js";
 export {
   A as Alert,
-  c as createAlert
+  c as createAlert,
+  g as getAlertDefaultConfig
 };

package/components/modal/index.cjs

@@ -1,14 +1,16 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const modal = require("../../modal-2qAV4Hjl.cjs");
-const modal$1 = require("@agnos-ui/core-bootstrap/components/modal");
+const modal = require("../../modal-Vd0W6U05.cjs");
+const modal$1 = require("@agnos-ui/react-headless/components/modal");
 exports.Modal = modal.Modal;
 exports.createModal = modal.createModal;
+exports.getModalDefaultConfig = modal.getModalDefaultConfig;
 exports.openModal = modal.openModal;
-Object.keys(modal$1).forEach((k) => {
-  if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k))
-    Object.defineProperty(exports, k, {
-      enumerable: true,
-      get: () => modal$1[k]
-    });
+Object.defineProperty(exports, "modalCloseButtonClick", {
+  enumerable: true,
+  get: () => modal$1.modalCloseButtonClick
+});
+Object.defineProperty(exports, "modalOutsideClick", {
+  enumerable: true,
+  get: () => modal$1.modalOutsideClick
 });

package/components/modal/index.js

@@ -1,7 +1,10 @@
-import { M, c, o } from "../../modal-B6rJgzVm.js";
-export * from "@agnos-ui/core-bootstrap/components/modal";
+import { M, c, g, o } from "../../modal-B9xclGji.js";
+import { modalCloseButtonClick, modalOutsideClick } from "@agnos-ui/react-headless/components/modal";
 export {
   M as Modal,
   c as createModal,
+  g as getModalDefaultConfig,
+  modalCloseButtonClick,
+  modalOutsideClick,
   o as openModal
 };

package/components/modal/modal.d.ts

@@ -1,11 +1,9 @@
-import type { AdaptSlotContentProps, AdaptWidgetSlots, PropsConfig, WidgetProps, WidgetState } from '@agnos-ui/react-headless/types';
-import type { PropsWithChildren, RefAttributes } from 'react';
-import type { ModalApi } from '@agnos-ui/core-bootstrap/components/modal';
-export * from '@agnos-ui/core-bootstrap/components/modal';
-export type ModalWidget<Data> = AdaptWidgetSlots<import('@agnos-ui/core-bootstrap/components/modal').ModalWidget<Data>>;
-export type ModalProps<Data> = WidgetProps<ModalWidget<Data>>;
-export type ModalState<Data> = WidgetState<ModalWidget<Data>>;
-export type ModalContext<Data> = AdaptSlotContentProps<import('@agnos-ui/core-bootstrap/components/modal').ModalContext<Data>>;
+import type { PropsConfig } from '@agnos-ui/react-headless/types';
+import type { RefAttributes } from 'react';
+import type { ModalApi, ModalProps, ModalWidget } from './modal.gen';
+export type * from './modal.gen';
 export declare const createModal: <Data>(propsConfig?: PropsConfig<ModalProps<Data>>) => ModalWidget<Data>;
-export declare const Modal: <Data>(props: PropsWithChildren<Partial<ModalProps<Data>>> & RefAttributes<ModalApi<Data>>) => JSX.Element;
+export { modalCloseButtonClick, modalOutsideClick } from '@agnos-ui/react-headless/components/modal';
+export declare const getModalDefaultConfig: () => ModalProps<any>;
+export declare const Modal: <Data>(props: Partial<ModalProps<Data>> & RefAttributes<ModalApi<Data>>) => JSX.Element;
 export declare function openModal<Data>(options: Partial<ModalProps<Data>>): Promise<any>;

package/components/modal/modal.gen.d.ts

@@ -0,0 +1,239 @@
+import type { WidgetSlotContext, SlotContent, Widget, Directive } from '@agnos-ui/react-headless/types';
+import type { TransitionFn } from '@agnos-ui/react-headless/services/transitions/baseTransitions';
+export type ModalContext<Data> = WidgetSlotContext<ModalWidget<Data>>;
+export interface ModalState<Data> {
+    /**
+     * Whether the backdrop is fully hidden. This can be true either because {@link ModalProps.backdropbackdrop} is false or
+     * because {@link ModalCommonPropsAndState.visiblevisible} is false and there is no current transition.
+     */
+    backdropHidden: boolean;
+    /**
+     * Whether the modal is fully hidden.
+     */
+    hidden: boolean;
+    /**
+     * Whether there is an active transition to either display or hide the modal.
+     */
+    transitioning: boolean;
+    /**
+     * DOM element of the modal.
+     */
+    modalElement: HTMLElement | null;
+    /**
+     * Value of the aria-label attribute to put on the close button.
+     */
+    ariaCloseButtonLabel: string;
+    /**
+     * Classes to add on the backdrop DOM element.
+     */
+    backdropClass: string;
+    /**
+     * Whether to display the close button.
+     */
+    closeButton: boolean;
+    /**
+     * Which element should contain the modal and backdrop DOM elements.
+     * If it is not null, the modal and backdrop DOM elements are moved to the specified container.
+     * Otherwise, they stay where the widget is located.
+     */
+    container: HTMLElement | null;
+    /**
+     * Whether the modal should be visible when the transition is completed.
+     */
+    visible: boolean;
+    /**
+     * CSS classes to be applied on the widget main container
+     */
+    className: string;
+    /**
+     * Data to use in content slots
+     */
+    contentData: Data;
+    /**
+     * Body of the modal.
+     */
+    children: SlotContent<ModalContext<Data>>;
+    /**
+     * Footer of the modal.
+     */
+    slotFooter: SlotContent<ModalContext<Data>>;
+    /**
+     * Header of the modal. The default header includes {@link ModalCommonPropsAndState.slotTitle slotTitle}.
+     */
+    slotHeader: SlotContent<ModalContext<Data>>;
+    /**
+     * Structure of the modal.
+     * The default structure uses {@link ModalCommonPropsAndState.slotHeader slotHeader}, {@link ModalCommonPropsAndState.children children} and {@link ModalCommonPropsAndState.slotFooter slotFooter}.
+     */
+    slotStructure: SlotContent<ModalContext<Data>>;
+    /**
+     * Title of the modal.
+     */
+    slotTitle: SlotContent<ModalContext<Data>>;
+    /**
+     * Option to create a fullscreen modal, according to the bootstrap documentation.
+     */
+    fullscreen: boolean;
+}
+export interface ModalProps<Data> {
+    /**
+     * Whether the modal and its backdrop (if present) should be animated when shown or hidden.
+     */
+    animated: boolean;
+    /**
+     * Whether a backdrop should be created behind the modal.
+     */
+    backdrop: boolean;
+    /**
+     * The transition to use for the backdrop behind the modal (if present).
+     */
+    backdropTransition: TransitionFn;
+    /**
+     * Whether the modal should be closed when clicking on the viewport outside the modal.
+     */
+    closeOnOutsideClick: boolean;
+    /**
+     * The transition to use for the modal.
+     */
+    modalTransition: TransitionFn;
+    /**
+     * Event to be triggered when the modal is about to be closed (i.e. the {@link ModalApi.closeclose} method was called).
+     */
+    onBeforeClose: (event: ModalBeforeCloseEvent) => void;
+    /**
+     * Event to be triggered when the visible property changes.
+     */
+    onVisibleChange: (visible: boolean) => void;
+    /**
+     * Event to be triggered when the transition is completed and the modal is not visible.
+     */
+    onHidden: () => void;
+    /**
+     * Event to be triggered when the transition is completed and the modal is visible.
+     */
+    onShown: () => void;
+    /**
+     * Value of the aria-label attribute to put on the close button.
+     */
+    ariaCloseButtonLabel: string;
+    /**
+     * Classes to add on the backdrop DOM element.
+     */
+    backdropClass: string;
+    /**
+     * Whether to display the close button.
+     */
+    closeButton: boolean;
+    /**
+     * Which element should contain the modal and backdrop DOM elements.
+     * If it is not null, the modal and backdrop DOM elements are moved to the specified container.
+     * Otherwise, they stay where the widget is located.
+     */
+    container: HTMLElement | null;
+    /**
+     * Whether the modal should be visible when the transition is completed.
+     */
+    visible: boolean;
+    /**
+     * CSS classes to be applied on the widget main container
+     */
+    className: string;
+    /**
+     * Data to use in content slots
+     */
+    contentData: Data;
+    /**
+     * Body of the modal.
+     */
+    children: SlotContent<ModalContext<Data>>;
+    /**
+     * Footer of the modal.
+     */
+    slotFooter: SlotContent<ModalContext<Data>>;
+    /**
+     * Header of the modal. The default header includes {@link ModalCommonPropsAndState.slotTitle slotTitle}.
+     */
+    slotHeader: SlotContent<ModalContext<Data>>;
+    /**
+     * Structure of the modal.
+     * The default structure uses {@link ModalCommonPropsAndState.slotHeader slotHeader}, {@link ModalCommonPropsAndState.children children} and {@link ModalCommonPropsAndState.slotFooter slotFooter}.
+     */
+    slotStructure: SlotContent<ModalContext<Data>>;
+    /**
+     * Title of the modal.
+     */
+    slotTitle: SlotContent<ModalContext<Data>>;
+    /**
+     * Option to create a fullscreen modal, according to the bootstrap documentation.
+     */
+    fullscreen: boolean;
+}
+export interface ModalApi<Data> {
+    /**
+     * Method to change some modal properties.
+     */
+    patch: ModalWidget<Data>['patch'];
+    /**
+     * Closes the modal with the given result.
+     */
+    close(result?: any): void;
+    /**
+     * Opens the modal and returns a promise that is resolved when the modal is closed.
+     * The resolved value is the result passed to the {@link ModalApi.closeclose} method and possibly changed by the
+     * {@link ModalProps.onBeforeCloseonBeforeClose} event handler
+     */
+    open(): Promise<any>;
+}
+export type ModalWidget<Data> = Widget<ModalProps<Data>, ModalState<Data>, ModalApi<Data>, ModalActions, ModalDirectives>;
+export interface ModalBeforeCloseEvent {
+    /**
+     * Result of the modal, which is the value passed to the {@link ModalApi.closeclose} method
+     * and later resolved by the promise returned by the {@link ModalApi.openopen} method.
+     * If needed, it can be changed from the {@link ModalProps.onBeforeCloseonBeforeClose} event handler.
+     */
+    result: any;
+    /**
+     * Whether to cancel the close of the modal.
+     * It can be changed from the {@link ModalProps.onBeforeCloseonBeforeClose} event handler.
+     */
+    cancel: boolean;
+}
+export interface ModalActions {
+    /**
+     * Action to be called when the user clicks on the close button. It closes the modal with the {@link modalCloseButtonClick} result.
+     */
+    closeButtonClick(event: Pick<MouseEvent, never>): void;
+    /**
+     * Action to be called when the user clicks on the modal DOM element (which is supposed to have the size of the full viewport).
+     * If the click is not done on a descendant of the modal DOM element, it is considered to be done outside the modal
+     * and, depending on the value of the {@link ModalProps.closeOnOutsideClickcloseOnOutsideClick} prop, the modal is or isn't closed
+     * (with the {@link modalOutsideClick} result).
+     */
+    modalClick(event: Pick<MouseEvent, 'target' | 'currentTarget'>): void;
+}
+export interface ModalDirectives {
+    /**
+     * Directive to put on the modal DOM element.
+     */
+    modalDirective: Directive;
+    /**
+     * Directive to put on the backdrop DOM element.
+     */
+    backdropDirective: Directive;
+    /**
+     * Portal directive to put on the modal DOM element.
+     */
+    modalPortalDirective: Directive;
+    /**
+     * Portal directive to put on the backdrop DOM element.
+     */
+    backdropPortalDirective: Directive;
+    /**
+     * Directive that adds all the necessary attributes to the close button
+     */
+    closeButtonDirective: Directive;
+    /**
+     * Directive to apply to the dialog element when using the native [HTMLDialogElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLDialogElement)
+     */
+    dialogDirective: Directive;
+}

package/components/pagination/index.cjs

@@ -1,17 +1,10 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const pagination = require("../../pagination-CKUbq-OI.cjs");
-const pagination$1 = require("@agnos-ui/core-bootstrap/components/pagination");
+const pagination = require("../../pagination-BO6qrpA6.cjs");
 exports.DefaultPages = pagination.DefaultPages;
 exports.DefaultStructure = pagination.DefaultStructure;
 exports.NavButton = pagination.NavButton;
 exports.PageItem = pagination.PageItem;
 exports.Pagination = pagination.Pagination;
 exports.createPagination = pagination.createPagination;
-Object.keys(pagination$1).forEach((k) => {
-  if (k !== "default" && !Object.prototype.hasOwnProperty.call(exports, k))
-    Object.defineProperty(exports, k, {
-      enumerable: true,
-      get: () => pagination$1[k]
-    });
-});
+exports.getPaginationDefaultConfig = pagination.getPaginationDefaultConfig;

package/components/pagination/index.js

@@ -1,10 +1,10 @@
-import { D, a, N, b, P, c } from "../../pagination-X2bugeX-.js";
-export * from "@agnos-ui/core-bootstrap/components/pagination";
+import { D, a, N, b, P, c, g } from "../../pagination-BGHP7K6U.js";
 export {
   D as DefaultPages,
   a as DefaultStructure,
   N as NavButton,
   b as PageItem,
   P as Pagination,
-  c as createPagination
+  c as createPagination,
+  g as getPaginationDefaultConfig
 };

package/components/pagination/pagination.d.ts

@@ -1,11 +1,8 @@
-import type { AdaptSlotContentProps, AdaptWidgetSlots, WidgetFactory, WidgetProps, WidgetState } from '@agnos-ui/react-headless/types';
-export * from '@agnos-ui/core-bootstrap/components/pagination';
-export type PaginationWidget = AdaptWidgetSlots<import('@agnos-ui/core-bootstrap/components/pagination').PaginationWidget>;
-export type PaginationProps = WidgetProps<PaginationWidget>;
-export type PaginationState = WidgetState<PaginationWidget>;
-export type PaginationContext = AdaptSlotContentProps<import('@agnos-ui/core-bootstrap/components/pagination').PaginationContext>;
-export type PaginationNumberContext = AdaptSlotContentProps<import('@agnos-ui/core-bootstrap/components/pagination').PaginationNumberContext>;
+import type { WidgetFactory } from '@agnos-ui/react-headless/types';
+import type { PaginationContext, PaginationProps, PaginationWidget } from './pagination.gen';
+export type * from './pagination.gen';
 export declare const createPagination: WidgetFactory<PaginationWidget>;
+export declare const getPaginationDefaultConfig: () => PaginationProps;
 export * from './pageItem';
 export declare function DefaultPages(slotContext: PaginationContext): import("react/jsx-runtime").JSX.Element | null;
 export declare function DefaultStructure(slotContext: PaginationContext): import("react/jsx-runtime").JSX.Element;