@agnos-ui/core 0.2.0 → 0.3.0

package/components/pagination/pagination.d.ts

@@ -1,18 +1,5 @@
-import type { PropsConfig, Widget, SlotContent, WidgetSlotContext } from '../../types';
+import type { PropsConfig, Widget, Directive } from '../../types';
 import type { WidgetsCommonPropsAndState } from '../commonProps';
-/**
- * A type for the slot context of the pagination widget
- */
-export type PaginationContext = WidgetSlotContext<PaginationWidget>;
-/**
- * A type for the slot context of the pagination widget when the slot is the number label
- */
-export interface PaginationNumberContext extends PaginationContext {
-    /**
-     * Displayed page
-     */
-    displayedPage: number;
-}
 export interface PaginationCommonPropsAndState extends WidgetsCommonPropsAndState {
     /**
      * The current page.
@@ -71,6 +58,13 @@ export interface PaginationCommonPropsAndState extends WidgetsCommonPropsAndStat
      * @defaultValue 'Action link for last page'
      */
     ariaLastLabel: string;
+    /**
+     * The label for the "Ellipsis" page.
+     * for I18n, we suggest to use the global configuration
+     * override any configuration parameters provided for this
+     * @defaultValue 'Ellipsis page element'
+     */
+    ariaEllipsisLabel: string;
     /**
      * If `true`, pagination links will be disabled.
      * @defaultValue false
@@ -86,66 +80,6 @@ export interface PaginationCommonPropsAndState extends WidgetsCommonPropsAndStat
      * @defaultValue false
      */
     boundaryLinks: boolean;
-    /**
-     * The template to use for the structure of the pagination component
-     * The default structure uses {@link PaginationCommonPropsAndState.slotEllipsis|slotEllipsis}, {@link PaginationCommonPropsAndState.slotFirst|slotFirst},
-     * {@link PaginationCommonPropsAndState.slotPrevious|slotPrevious}, {@link PaginationCommonPropsAndState.slotNext|slotNext},
-     * {@link PaginationCommonPropsAndState.slotLast|slotLast}, {@link PaginationCommonPropsAndState.slotPages|slotPages},
-     * {@link PaginationCommonPropsAndState.slotNumberLabel|slotNumberLabel},
-     */
-    slotStructure: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the ellipsis slot
-     * for I18n, we suggest to use the global configuration
-     * override any configuration parameters provided for this
-     * @defaultValue '…'
-     */
-    slotEllipsis: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the first slot
-     * for I18n, we suggest to use the global configuration
-     * override any configuration parameters provided for this
-     * @defaultValue '«'
-     */
-    slotFirst: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the previous slot
-     * for I18n, we suggest to use the global configuration
-     * override any configuration parameters provided for this
-     * @defaultValue '‹'
-     */
-    slotPrevious: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the next slot
-     * for I18n, we suggest to use the global configuration
-     * override any configuration parameters provided for this
-     * @defaultValue '›'
-     */
-    slotNext: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the last slot
-     * for I18n, we suggest to use the global configuration
-     * override any configuration parameters provided for this
-     * @defaultValue '»'
-     */
-    slotLast: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the pages slot
-     * To use to customize the pages view
-     * override any configuration parameters provided for this
-     */
-    slotPages: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the number slot
-     * override any configuration parameters provided for this
-     * for I18n, we suggest to use the global configuration
-     * @defaultValue
-     * ```ts
-     * ({displayedPage}) => `${displayedPage}`
-     * ```
-     * @param displayedPage - The current page number
-     */
-    slotNumberLabel: SlotContent<PaginationNumberContext>;
 }
 export interface PaginationProps extends PaginationCommonPropsAndState {
     /**
@@ -209,6 +143,19 @@ export interface PaginationProps extends PaginationCommonPropsAndState {
      * ```
      */
     ariaPageLabel: (processPage: number, pageCount: number) => string;
+    /**
+     * Provide the label for the aria-live element
+     * This is used for accessibility purposes.
+     * for I18n, we suggest to use the global configuration
+     * override any configuration parameters provided for this
+     * @param currentPage - The current page number
+     * @param pageCount - The total number of pages
+     * @defaultValue
+     * ```ts
+     * ({currentPage, pageCount}) => `Current page is ${currentPage}`
+     * ```
+     */
+    ariaLiveLabel: (currentPage: number, pageCount: number) => string;
     /**
      * Factory function providing the href for a "Page" page anchor,
      * based on the current page number
@@ -255,6 +202,8 @@ export interface PaginationState extends PaginationCommonPropsAndState {
     pagesHrefs: string[];
     /** The hrefs for the direction links  */
     directionsHrefs: DirectionsHrefs;
+    /** The aria-live text */
+    ariaLiveLabelText: string;
 }
 export interface PaginationActions {
     /**
@@ -279,14 +228,34 @@ export interface PaginationActions {
      */
     last(event?: MouseEvent): void;
 }
-export interface PaginationApi {
+export interface PaginationDirectives {
+    /**
+     * A directive to be applied to each page link
+     * This will handle the click, tabindex and aria attributes
+     */
+    pageLink: Directive<{
+        page: number;
+    }>;
+    /**
+     * A directive to be applied on the previous link
+     */
+    pagePrev: Directive;
+    /**
+     * A directive to be applied on the first link
+     */
+    pageFirst: Directive;
+    /**
+     * A directive to be applied on the next link
+     */
+    pageNext: Directive;
     /**
-     * If the page number is -1 return true
-     * @param page - The page number to check
+     * A directive to be applied on the Last link
      */
-    isEllipsis(page: number): boolean;
+    pageLast: Directive;
 }
-export type PaginationWidget = Widget<PaginationProps, PaginationState, PaginationApi, PaginationActions>;
+export interface PaginationApi {
+}
+export type PaginationWidget = Widget<PaginationProps, PaginationState, PaginationApi, PaginationActions, PaginationDirectives>;
 /**
  * Returns a shallow copy of the default pagination config
  * @returns a copy of the default config
@@ -353,6 +322,19 @@ export declare function getPaginationDefaultConfig(): {
      * ```
      */
     ariaPageLabel: (processPage: number, pageCount: number) => string;
+    /**
+     * Provide the label for the aria-live element
+     * This is used for accessibility purposes.
+     * for I18n, we suggest to use the global configuration
+     * override any configuration parameters provided for this
+     * @param currentPage - The current page number
+     * @param pageCount - The total number of pages
+     * @defaultValue
+     * ```ts
+     * ({currentPage, pageCount}) => `Current page is ${currentPage}`
+     * ```
+     */
+    ariaLiveLabel: (currentPage: number, pageCount: number) => string;
     /**
      * Factory function providing the href for a "Page" page anchor,
      * based on the current page number
@@ -420,6 +402,13 @@ export declare function getPaginationDefaultConfig(): {
      * @defaultValue 'Action link for last page'
      */
     ariaLastLabel: string;
+    /**
+     * The label for the "Ellipsis" page.
+     * for I18n, we suggest to use the global configuration
+     * override any configuration parameters provided for this
+     * @defaultValue 'Ellipsis page element'
+     */
+    ariaEllipsisLabel: string;
     /**
      * If `true`, pagination links will be disabled.
      * @defaultValue false
@@ -435,66 +424,6 @@ export declare function getPaginationDefaultConfig(): {
      * @defaultValue false
      */
     boundaryLinks: boolean;
-    /**
-     * The template to use for the structure of the pagination component
-     * The default structure uses {@link PaginationCommonPropsAndState.slotEllipsis|slotEllipsis}, {@link PaginationCommonPropsAndState.slotFirst|slotFirst},
-     * {@link PaginationCommonPropsAndState.slotPrevious|slotPrevious}, {@link PaginationCommonPropsAndState.slotNext|slotNext},
-     * {@link PaginationCommonPropsAndState.slotLast|slotLast}, {@link PaginationCommonPropsAndState.slotPages|slotPages},
-     * {@link PaginationCommonPropsAndState.slotNumberLabel|slotNumberLabel},
-     */
-    slotStructure: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the ellipsis slot
-     * for I18n, we suggest to use the global configuration
-     * override any configuration parameters provided for this
-     * @defaultValue '…'
-     */
-    slotEllipsis: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the first slot
-     * for I18n, we suggest to use the global configuration
-     * override any configuration parameters provided for this
-     * @defaultValue '«'
-     */
-    slotFirst: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the previous slot
-     * for I18n, we suggest to use the global configuration
-     * override any configuration parameters provided for this
-     * @defaultValue '‹'
-     */
-    slotPrevious: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the next slot
-     * for I18n, we suggest to use the global configuration
-     * override any configuration parameters provided for this
-     * @defaultValue '›'
-     */
-    slotNext: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the last slot
-     * for I18n, we suggest to use the global configuration
-     * override any configuration parameters provided for this
-     * @defaultValue '»'
-     */
-    slotLast: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the pages slot
-     * To use to customize the pages view
-     * override any configuration parameters provided for this
-     */
-    slotPages: SlotContent<PaginationContext>;
-    /**
-     * The template to use for the number slot
-     * override any configuration parameters provided for this
-     * for I18n, we suggest to use the global configuration
-     * @defaultValue
-     * ```ts
-     * ({displayedPage}) => `${displayedPage}`
-     * ```
-     * @param displayedPage - The current page number
-     */
-    slotNumberLabel: SlotContent<PaginationNumberContext>;
     className: string;
 };
 /**

package/components/progressbar/index.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const progressbar = require("../../progressbar-DH7DHYMp.cjs");
+exports.createProgressbar = progressbar.createProgressbar;
+exports.getProgressbarDefaultConfig = progressbar.getProgressbarDefaultConfig;

package/components/progressbar/index.js

@@ -1 +1,5 @@
-export * from './progressbar';
+import { c, g } from "../../progressbar-DuRX7_my.js";
+export {
+  c as createProgressbar,
+  g as getProgressbarDefaultConfig
+};

package/components/progressbar/progressbar.d.ts

@@ -1,6 +1,5 @@
-import type { PropsConfig, SlotContent, Widget, WidgetSlotContext } from '../../types';
+import type { Directive, PropsConfig, Widget } from '../../types';
 import type { WidgetsCommonPropsAndState } from '../commonProps';
-export type ProgressbarContext = WidgetSlotContext<ProgressbarWidget>;
 export interface ProgressbarCommonPropsAndState extends WidgetsCommonPropsAndState {
     /**
      * The minimum value.
@@ -21,27 +20,12 @@ export interface ProgressbarCommonPropsAndState extends WidgetsCommonPropsAndSta
      * The aria label.
      */
     ariaLabel: string;
+}
+export interface ProgressbarDirectives {
     /**
-     * Global template for the Progressbar.
-     */
-    slotStructure: SlotContent<ProgressbarContext>;
-    /**
-     * Label of the progress.
-     */
-    slotDefault: SlotContent<ProgressbarContext>;
-    /**
-     * Height of the progressbar, can be any valid css height value.
-     */
-    height: string;
-    /**
-     * If `true`, shows a striped progressbar.
-     */
-    striped: boolean;
-    /**
-     * If `true`, animates a striped progressbar.
-     * Takes effect only for browsers supporting CSS3 animations, and if `striped` is `true`.
+     * A directive to be applied to the main container that handles aria attributes.
      */
-    animated: boolean;
+    ariaDirective: Directive;
 }
 export interface ProgressbarState extends ProgressbarCommonPropsAndState {
     /**
@@ -72,7 +56,7 @@ export interface ProgressbarProps extends ProgressbarCommonPropsAndState {
 }
 export interface ProgressbarApi {
 }
-export type ProgressbarWidget = Widget<ProgressbarProps, ProgressbarState, ProgressbarApi, object, object>;
+export type ProgressbarWidget = Widget<ProgressbarProps, ProgressbarState, ProgressbarApi, object, ProgressbarDirectives>;
 /**
  * Retrieve a shallow copy of the default Progressbar config
  * @returns the default Progressbar config

package/components/rating/index.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const rating = require("../../rating-CmuYUSxy.cjs");
+exports.createRating = rating.createRating;
+exports.getRatingDefaultConfig = rating.getRatingDefaultConfig;

package/components/rating/index.js

@@ -1 +1,5 @@
-export * from './rating';
+import { c, g } from "../../rating-BR5wD7y2.js";
+export {
+  c as createRating,
+  g as getRatingDefaultConfig
+};

package/components/rating/rating.d.ts

@@ -1,4 +1,4 @@
-import type { PropsConfig, SlotContent, Widget } from '../../types';
+import type { Directive, PropsConfig, Widget } from '../../types';
 import type { WidgetsCommonPropsAndState } from '../commonProps';
 export interface StarContext {
     /**
@@ -38,10 +38,6 @@ export interface RatingCommonPropsAndState extends WidgetsCommonPropsAndState {
      * If the component is disabled, `tabindex` will still be set to `-1`.
      */
     tabindex: number;
-    /**
-     * The template to override the way each star is displayed.
-     */
-    slotStar: SlotContent<StarContext>;
     /**
      * The aria label
      */
@@ -77,6 +73,19 @@ export interface RatingProps extends RatingCommonPropsAndState {
      */
     onLeave: (rating: number) => void;
 }
+export interface RatingDirectives {
+    /**
+     * A directive to be applied to the main container
+     * This will handle the keydown, mouseleave, tabindex and aria attributes
+     */
+    containerDirective: Directive;
+    /**
+     * A directive to be applied on each star element
+     */
+    starDirective: Directive<{
+        index: number;
+    }>;
+}
 export interface RatingState extends RatingCommonPropsAndState {
     /**
      * the aria value of the rating
@@ -89,7 +98,7 @@ export interface RatingState extends RatingCommonPropsAndState {
     /**
      * is the rating interactive i.e. listening to hover, click and keyboard events
      */
-    isInteractive: boolean;
+    interactive: boolean;
     /**
      * the list of stars
      */
@@ -123,7 +132,7 @@ export interface RatingActions {
      */
     handleKey(event: KeyboardEvent): void;
 }
-export type RatingWidget = Widget<RatingProps, RatingState, object, RatingActions>;
+export type RatingWidget = Widget<RatingProps, RatingState, object, RatingActions, RatingDirectives>;
 /**
  * Returns a shallow copy of the default rating config.
  * @returns a copy of the default config
@@ -180,10 +189,6 @@ export declare function getRatingDefaultConfig(): {
      * If the component is disabled, `tabindex` will still be set to `-1`.
      */
     tabindex: number;
-    /**
-     * The template to override the way each star is displayed.
-     */
-    slotStar: SlotContent<StarContext>;
     /**
      * The aria label
      */

package/components/select/index.cjs

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const select = require("../../select-CCIKn8WR.cjs");
+exports.createSelect = select.createSelect;
+exports.defaultConfig = select.defaultConfig;
+exports.getSelectDefaultConfig = select.getSelectDefaultConfig;

package/components/select/index.js

@@ -1 +1,6 @@
-export * from './select';
+import { c, d, g } from "../../select-BCs6HQWn.js";
+export {
+  c as createSelect,
+  d as defaultConfig,
+  g as getSelectDefaultConfig
+};

package/components/select/select.d.ts

@@ -1,18 +1,8 @@
 import type { Placement } from '@floating-ui/dom';
 import type { FloatingUI } from '../../services/floatingUI';
 import type { HasFocus } from '../../services/focustrack';
-import type { Directive, PropsConfig, SlotContent, Widget, WidgetSlotContext } from '../../types';
+import type { Directive, PropsConfig, Widget } from '../../types';
 import type { WidgetsCommonPropsAndState } from '../commonProps';
-/**
- * A type for the slot context of the pagination widget
- */
-export type SelectContext<Item> = WidgetSlotContext<SelectWidget<Item>>;
-export interface SelectItemContext<Item> extends SelectContext<Item> {
-    /**
-     * Contextual data related to an item
-     */
-    itemContext: ItemContext<Item>;
-}
 export interface SelectCommonPropsAndState<Item> extends WidgetsCommonPropsAndState {
     /**
      * id used for the input inside the select
@@ -54,16 +44,6 @@ export interface SelectCommonPropsAndState<Item> extends WidgetsCommonPropsAndSt
      * true if a loading process is being done
      */
     loading: boolean;
-    /**
-     * The template to override the way each badge on the left of the input is displayed.
-     * This define the content of the badge inside the badge container.
-     */
-    slotBadgeLabel: SlotContent<SelectItemContext<Item>>;
-    /**
-     * The template to override the way each item is displayed in the list.
-     * This define the content of the badge inside the badge container.
-     */
-    slotItem: SlotContent<SelectItemContext<Item>>;
 }
 export interface SelectProps<T> extends SelectCommonPropsAndState<T> {
     /**
@@ -200,7 +180,7 @@ export interface SelectApi<Item> {
      */
     toggle(isOpen?: boolean): void;
 }
-export interface SelectDirectives {
+export interface SelectDirectives<Item> {
     /**
      * Directive to be used in the input group and the menu containers
      */
@@ -217,6 +197,18 @@ export interface SelectDirectives {
      * A directive to be applied to the element that contains the badges and the input
      */
     inputContainerDirective: Directive;
+    /**
+     * A directive that applies all the necessary attributes to the container badges
+     */
+    badgeAttributesDirective: Directive<ItemContext<Item>>;
+    /**
+     * A directive that applies all the necessary attributes to the dropdown menu
+     */
+    menuAttributesDirective: Directive;
+    /**
+     * A directive that applies all the necessary attributes to the dropdown item
+     */
+    itemAttributesDirective: Directive<ItemContext<Item>>;
 }
 export interface SelectActions<Item> {
     /**
@@ -242,7 +234,7 @@ export interface SelectActions<Item> {
      */
     onBadgeKeydown: (event: KeyboardEvent, item: Item) => void;
 }
-export type SelectWidget<Item> = Widget<SelectProps<Item>, SelectState<Item>, SelectApi<Item>, SelectActions<Item>, SelectDirectives>;
+export type SelectWidget<Item> = Widget<SelectProps<Item>, SelectState<Item>, SelectApi<Item>, SelectActions<Item>, SelectDirectives<Item>>;
 export declare const defaultConfig: SelectProps<any>;
 /**
  * Returns a shallow copy of the default select config.
@@ -323,16 +315,6 @@ export declare function getSelectDefaultConfig(): {
      * true if a loading process is being done
      */
     loading: boolean;
-    /**
-     * The template to override the way each badge on the left of the input is displayed.
-     * This define the content of the badge inside the badge container.
-     */
-    slotBadgeLabel: SlotContent<SelectItemContext<any>>;
-    /**
-     * The template to override the way each item is displayed in the list.
-     * This define the content of the badge inside the badge container.
-     */
-    slotItem: SlotContent<SelectItemContext<any>>;
     className: string;
 };
 /**

package/components/slider/index.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const slider = require("../../slider-DsLvT87U.cjs");
+exports.createSlider = slider.createSlider;
+exports.getSliderDefaultConfig = slider.getSliderDefaultConfig;

package/components/slider/index.js

@@ -1 +1,5 @@
-export * from './slider';
+import { c, g } from "../../slider-CA_fszn7.js";
+export {
+  c as createSlider,
+  g as getSliderDefaultConfig
+};

package/components/slider/slider.d.ts

@@ -1,12 +1,5 @@
 import type { WidgetsCommonPropsAndState } from '../commonProps';
-import type { Directive, PropsConfig, SlotContent, Widget, WidgetSlotContext } from '../../types';
-export type SliderContext = WidgetSlotContext<SliderWidget>;
-export type SliderSlotLabelContext = SliderContext & {
-    value: number;
-};
-export type SliderSlotHandleContext = SliderContext & {
-    item: SliderHandle;
-};
+import type { Directive, PropsConfig, Widget } from '../../types';
 export interface ProgressDisplayOptions {
     /**
      * Right offset of the progress in %
@@ -102,18 +95,6 @@ export interface SliderCommonPropsAndState extends WidgetsCommonPropsAndState {
      * It `true` slider display is inversed
      */
     rtl: boolean;
-    /**
-     * Slot to change the default display of the slider
-     */
-    slotStructure: SlotContent<SliderContext>;
-    /**
-     * Slot to change the default labels of the slider
-     */
-    slotLabel: SlotContent<SliderSlotLabelContext>;
-    /**
-     *  Slot to change the handlers
-     */
-    slotHandle: SlotContent<SliderSlotHandleContext>;
 }
 export interface SliderState extends SliderCommonPropsAndState {
     /**
@@ -153,10 +134,9 @@ export interface SliderState extends SliderCommonPropsAndState {
      */
     handleDisplayOptions: HandleDisplayOptions[];
     /**
-     * Check if the slider is interactable, meaning it is not disabled or readonly
-     * TODO: rename to `interactive`, issue #510
+     * Check if the slider is interactive, meaning it is not disabled or readonly
      */
-    isInteractable: boolean;
+    interactive: boolean;
 }
 export interface SliderProps extends SliderCommonPropsAndState {
     /**
@@ -187,6 +167,22 @@ export interface SliderDirectives {
      * Directive to get the slider component elementRef
      */
     sliderDirective: Directive;
+    /**
+     * Directive used to style the progress display for each handle
+     */
+    progressDisplayDirective: Directive<{
+        option: ProgressDisplayOptions;
+    }>;
+    /**
+     * Directive to apply to the slider clickable area, to directly move the handle to a given specific position
+     */
+    clickableAreaDirective: Directive;
+    /**
+     * Directive to apply to the slider handle if any
+     */
+    handleDirective: Directive<{
+        item: SliderHandle;
+    }>;
     /**
      * Directive to get the minLabel elementRef
      */
@@ -195,6 +191,16 @@ export interface SliderDirectives {
      * Directive to get the maxLabel elementRef
      */
     maxLabelDirective: Directive;
+    /**
+     * Directive to apply to the handle when combined label display is active
+     */
+    combinedHandleLabelDisplayDirective: Directive;
+    /**
+     * Directive to apply to the handle when combined label display is not active
+     */
+    handleLabelDisplayDirective: Directive<{
+        index: number;
+    }>;
 }
 export interface SliderActions {
     /**
@@ -287,18 +293,6 @@ export declare function getSliderDefaultConfig(): {
      * It `true` slider display is inversed
      */
     rtl: boolean;
-    /**
-     * Slot to change the default display of the slider
-     */
-    slotStructure: SlotContent<SliderContext>;
-    /**
-     * Slot to change the default labels of the slider
-     */
-    slotLabel: SlotContent<SliderSlotLabelContext>;
-    /**
-     *  Slot to change the handlers
-     */
-    slotHandle: SlotContent<SliderSlotHandleContext>;
     className: string;
 };
 /**

package/components/toast/index.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const toast = require("../../toast-Aw8o0Iwe.cjs");
+exports.createToast = toast.createToast;
+exports.getToastDefaultConfig = toast.getToastDefaultConfig;

package/components/toast/index.js

@@ -1 +1,5 @@
-export * from './toast';
+import { c, g } from "../../toast-8tWp6x89.js";
+export {
+  c as createToast,
+  g as getToastDefaultConfig
+};