@design-factory/angular 21.0.4 → 21.1.0-next.0

package/node_modules/@agnos-ui/core/components/carousel/index.js

@@ -0,0 +1,292 @@
+import { writablesForProps, true$, stateStores } from "../../utils/stores.js";
+import { b as bindDirective, d as browserDirective, g as createAttributesDirective, s as mergeDirectives } from "../../directive-Bsreu2z1.js";
+import EmblaCarousel from "embla-carousel";
+import { writable, computed, asReadable, readable } from "@amadeus-it-group/tansu";
+import { e as typeFunction, j as typeString, b as typeBoolean, g as typeNumber, k as typeStringOrNull, a as typeArray, c as createTypeEnum } from "../../writables-DYGjj5T3.js";
+import { createNavManager } from "../../services/navManager.js";
+import { createWidgetFactory } from "../../utils/widget.js";
+const defaultConfig = {
+  align: "center",
+  container: null,
+  containScroll: "trimSnaps",
+  direction: "ltr",
+  dragFree: false,
+  dragThreshold: 10,
+  duration: 25,
+  loop: false,
+  skipSnaps: false,
+  plugins: [],
+  showNavigationArrows: true,
+  showNavigationIndicators: true,
+  ariaPrevLabel: "Select previous slide",
+  ariaNextLabel: "Select next slide",
+  ariaIndicatorLabel: (index) => `Select slide ${index + 1}`
+};
+function getCarouselDefaultConfig() {
+  return { ...defaultConfig };
+}
+const configValidator = {
+  dragFree: typeBoolean,
+  plugins: typeArray,
+  align: createTypeEnum(["start", "center", "end"]),
+  container: typeStringOrNull,
+  containScroll: createTypeEnum([false, "trimSnaps", "keepSnaps"]),
+  direction: createTypeEnum(["ltr", "rtl"]),
+  dragThreshold: typeNumber,
+  duration: typeNumber,
+  loop: typeBoolean,
+  skipSnaps: typeBoolean,
+  showNavigationArrows: typeBoolean,
+  showNavigationIndicators: typeBoolean,
+  ariaPrevLabel: typeString,
+  ariaNextLabel: typeString,
+  ariaIndicatorLabel: typeFunction
+};
+function createEmblaCarousel(options$, plugins$) {
+  let emblaApi;
+  const scrolling$ = writable(false);
+  const canScrollPrev$ = writable(false);
+  const canScrollNext$ = writable(true);
+  const selectedScrollSnap$ = writable(0);
+  const initialized$ = writable(false);
+  const slideNodes$ = writable([]);
+  const directiveArgs$ = computed(() => ({
+    options: options$(),
+    plugins: plugins$ ? plugins$() : []
+  }));
+  return {
+    directive: bindDirective(
+      browserDirective(
+        (element, { options, plugins }) => {
+          if (emblaApi) {
+            throw new Error("Only one Embla directive can be attached per carousel widget !");
+          }
+          emblaApi = EmblaCarousel(element, options, plugins);
+          emblaApi.on("scroll", () => {
+            scrolling$.set(true);
+          });
+          emblaApi.on("settle", () => {
+            scrolling$.set(false);
+          });
+          emblaApi.on("select", (api) => {
+            canScrollNext$.set(api.canScrollNext());
+            canScrollPrev$.set(api.canScrollPrev());
+            selectedScrollSnap$.set(api.selectedScrollSnap());
+          });
+          emblaApi.on("init", () => {
+            initialized$.set(true);
+          });
+          emblaApi.on("reInit", (api) => {
+            canScrollNext$.set(api.canScrollNext());
+            canScrollPrev$.set(api.canScrollPrev());
+            scrolling$.set(false);
+            selectedScrollSnap$.set(api.selectedScrollSnap());
+          });
+          emblaApi.on("slidesChanged", (api) => {
+            slideNodes$.set(api.slideNodes());
+          });
+          canScrollNext$.set(emblaApi.canScrollNext());
+          canScrollPrev$.set(emblaApi.canScrollPrev());
+          slideNodes$.set(emblaApi.slideNodes());
+          return {
+            update: ({ options: options2, plugins: plugins2 }) => {
+              emblaApi.reInit(options2, plugins2);
+            },
+            destroy: () => {
+              emblaApi?.destroy();
+              emblaApi = void 0;
+              initialized$.set(false);
+              scrolling$.set(false);
+              canScrollPrev$.set(false);
+              canScrollNext$.set(true);
+              selectedScrollSnap$.set(0);
+              slideNodes$.set([]);
+            }
+          };
+        }
+      ),
+      directiveArgs$
+    ),
+    stores: {
+      scrolling$: asReadable(scrolling$),
+      canScrollPrev$: asReadable(canScrollPrev$),
+      canScrollNext$: asReadable(canScrollNext$),
+      selectedScrollSnap$: asReadable(selectedScrollSnap$),
+      initialized$: asReadable(initialized$),
+      slideNodes$: asReadable(slideNodes$)
+    },
+    get api() {
+      return emblaApi;
+    }
+  };
+}
+const createCarousel = createWidgetFactory(
+  "carousel",
+  (config) => {
+    const [
+      {
+        align$,
+        container$,
+        containScroll$,
+        direction$,
+        dragFree$,
+        dragThreshold$,
+        duration$,
+        loop$,
+        skipSnaps$,
+        plugins$,
+        ariaPrevLabel$,
+        ariaNextLabel$,
+        ariaIndicatorLabel$,
+        showNavigationIndicators$,
+        ...stateProps
+      },
+      patch
+    ] = writablesForProps(defaultConfig, config, configValidator);
+    const emblaOptions$ = computed(() => ({
+      align: align$(),
+      container: container$(),
+      containScroll: containScroll$(),
+      direction: direction$(),
+      dragFree: dragFree$(),
+      dragThreshold: dragThreshold$(),
+      duration: duration$(),
+      loop: loop$(),
+      skipSnaps: skipSnaps$()
+    }));
+    const emblaCarousel = createEmblaCarousel(emblaOptions$, plugins$);
+    const {
+      stores: { slideNodes$, ...emblaStores }
+    } = emblaCarousel;
+    const {
+      directive: navDirective,
+      refreshElements,
+      focusLeft,
+      focusRight,
+      focusFirst,
+      focusLast
+    } = createNavManager();
+    const navManagerConfig = {
+      keys: {
+        ArrowLeft: focusLeft,
+        ArrowRight: focusRight,
+        Home: focusFirst,
+        End: focusLast
+      },
+      selector: (node) => node.querySelectorAll("[role='tab']")
+    };
+    return {
+      ...stateStores({
+        ...emblaStores,
+        ...stateProps,
+        direction$,
+        showNavigationIndicators$
+      }),
+      patch,
+      api: {
+        scrollPrev: (jump) => {
+          emblaCarousel.api?.scrollPrev?.(jump);
+        },
+        scrollNext: (jump) => {
+          emblaCarousel.api?.scrollNext?.(jump);
+        },
+        scrollTo: (index, jump) => {
+          emblaCarousel.api?.scrollTo?.(index, jump);
+        },
+        plugins: () => emblaCarousel.api?.plugins?.(),
+        emblaApi: () => emblaCarousel.api
+      },
+      directives: {
+        root: mergeDirectives(
+          emblaCarousel.directive,
+          createAttributesDirective(() => ({
+            classNames: {
+              "au-carousel": true$
+            },
+            attributes: {
+              role: readable("region"),
+              "aria-roledescription": readable("carousel"),
+              dir: direction$
+            }
+          }))
+        ),
+        scrollPrev: createAttributesDirective(() => ({
+          attributes: {
+            "aria-label": ariaPrevLabel$,
+            disabled: computed(() => !emblaCarousel.stores.canScrollPrev$() || void 0)
+          },
+          events: {
+            click: () => emblaCarousel.api?.scrollPrev(),
+            pointerdown: (event) => event.preventDefault(),
+            touchstart: (event) => event.stopPropagation()
+          }
+        })),
+        scrollNext: createAttributesDirective(() => ({
+          attributes: {
+            "aria-label": ariaNextLabel$,
+            disabled: computed(() => !emblaCarousel.stores.canScrollNext$() || void 0)
+          },
+          events: {
+            click: () => emblaCarousel.api?.scrollNext(),
+            pointerdown: (event) => event.preventDefault(),
+            touchstart: (event) => event.stopPropagation()
+          }
+        })),
+        tabList: mergeDirectives(
+          bindDirective(navDirective, readable(navManagerConfig)),
+          browserDirective(() => {
+            const unsubscribe = slideNodes$.subscribe(() => {
+              refreshElements();
+            });
+            return {
+              destroy: unsubscribe
+            };
+          }),
+          createAttributesDirective(() => ({
+            attributes: {
+              role: readable("tablist")
+            }
+          }))
+        ),
+        tabIndicator: createAttributesDirective(
+          (slide$) => ({
+            events: {
+              click: () => {
+                emblaCarousel.api?.scrollTo(slide$().index, slide$().jump ?? true);
+              }
+            },
+            attributes: {
+              "aria-label": computed(() => ariaIndicatorLabel$()(slide$().index)),
+              "aria-selected": computed(
+                () => slide$().index === emblaCarousel.stores.selectedScrollSnap$() ? "true" : void 0
+              ),
+              "aria-controls": computed(() => slide$().id),
+              role: readable("tab"),
+              tabindex: computed(() => slide$().index === emblaCarousel.stores.selectedScrollSnap$() ? "0" : "-1")
+            }
+          })
+        ),
+        slide: createAttributesDirective((slide$) => {
+          const selected$ = computed(() => slide$().index === emblaCarousel.stores.selectedScrollSnap$());
+          return {
+            attributes: {
+              id: computed(() => slide$().id),
+              "aria-hidden": computed(() => selected$() ? void 0 : "true"),
+              role: computed(() => showNavigationIndicators$() ? "tabpanel" : "group"),
+              "aria-roledescription": computed(() => showNavigationIndicators$() ? void 0 : "slide"),
+              tabindex: computed(() => showNavigationIndicators$() && selected$() ? "0" : void 0)
+            },
+            classNames: {
+              "au-carousel-slide": true$
+            }
+          };
+        })
+      }
+    };
+  }
+);
+export {
+  createCarousel,
+  createEmblaCarousel,
+  getCarouselDefaultConfig
+};

package/node_modules/@agnos-ui/core/components/collapse/collapse.d.ts

@@ -0,0 +1,135 @@
+import { type TransitionFn } from '../../services/transitions/baseTransitions';
+import type { Directive, Widget, WidgetFactory } from '../../types';
+/**
+ * Interface representing the common properties and state for a collapse component.
+ */
+interface CollapseCommonPropsAndState {
+    /**
+     * If `true` the collapse is visible to the user
+     *
+     * @defaultValue `false`
+     */
+    visible: boolean;
+}
+/**
+ * Represents the state of a Collapse component.
+ */
+export interface CollapseState extends CollapseCommonPropsAndState {
+    /**
+     * Is `true` when the collapse is hidden. Compared to `visible`, this is updated after the transition is executed.
+     */
+    hidden: boolean;
+}
+/**
+ * Properties for the Collapse component.
+ */
+export interface CollapseProps extends CollapseCommonPropsAndState {
+    /**
+     * Callback called when the collapse visibility changed.
+     *
+     * @defaultValue
+     * ```ts
+     * () => {}
+     * ```
+     * @param visible - The new visibility state of the collapse.
+     */
+    onVisibleChange: (visible: boolean) => void;
+    /**
+     * Callback called when the collapse is hidden.
+     *
+     * @defaultValue
+     * ```ts
+     * () => {}
+     * ```
+     */
+    onHidden: () => void;
+    /**
+     * Callback called when the collapse is shown.
+     *
+     * @defaultValue
+     * ```ts
+     * () => {}
+     * ```
+     */
+    onShown: () => void;
+    /**
+     * If `true`, collapse opening will be animated at init time.
+     *
+     * @defaultValue `false`
+     */
+    animatedOnInit: boolean;
+    /**
+     * If `true`, collapse closing and opening will be animated.
+     *
+     * @defaultValue `true`
+     */
+    animated: boolean;
+    /**
+     * id of the collapse
+     *
+     * @defaultValue `''`
+     */
+    id: string;
+    /**
+     * The transition function will be executed when the collapse is displayed or hidden.
+     *
+     * Depending on the value of `animatedOnInit`, the animation can be optionally skipped during the showing process.
+     *
+     * @defaultValue
+     * ```ts
+     * () => {}
+     * ```
+     */
+    transition: TransitionFn;
+}
+/**
+ * Interface representing the API for a collapsible component.
+ */
+export interface CollapseApi {
+    /**
+     * Triggers collapse closing programmatically.
+     */
+    close(animated?: boolean): Promise<void>;
+    /**
+     * Triggers the collapse content to be displayed for the user.
+     */
+    open(animated?: boolean): Promise<void>;
+    /**
+     * Toggles the collapse content visibility.
+     */
+    toggle(animated?: boolean): Promise<void>;
+}
+/**
+ * Interface representing the directives used in a collapse component.
+ */
+export interface CollapseDirectives {
+    /**
+     * Directive to apply the collapse.
+     */
+    collapseDirective: Directive;
+    /**
+     * Directive to apply to a trigger;
+     */
+    triggerDirective: Directive;
+}
+/**
+ * Represents a widget for handling collapse functionality.
+ *
+ * This type defines the structure of a CollapseWidget, which includes properties, state, API, and directives
+ * necessary for managing the collapse behavior in the UI.
+ *
+ * @type {Widget<CollapseProps, CollapseState, CollapseApi, CollapseDirectives>}
+ */
+export type CollapseWidget = Widget<CollapseProps, CollapseState, CollapseApi, CollapseDirectives>;
+/**
+ * Retrieve a shallow copy of the default collapse config
+ * @returns the default collapse config
+ */
+export declare function getCollapseDefaultConfig(): CollapseProps;
+/**
+ * Create an CollapseWidget factory
+ * @param transitionFn - the transition function that will be used for the collapse
+ * @returns an CollapseWidget
+ */
+export declare const createCollapse: WidgetFactory<CollapseWidget>;
+export {};

package/node_modules/@agnos-ui/core/components/collapse/index.cjs

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const collapse = require("../../collapse-COriZO7o.cjs");
+exports.createCollapse = collapse.createCollapse;
+exports.getCollapseDefaultConfig = collapse.getCollapseDefaultConfig;

package/node_modules/@agnos-ui/core/components/collapse/index.d.ts

@@ -0,0 +1 @@
+export * from './collapse';

package/node_modules/@agnos-ui/core/components/collapse/index.js

@@ -0,0 +1,5 @@
+import { c, g } from "../../collapse-CP79atna.js";
+export {
+  c as createCollapse,
+  g as getCollapseDefaultConfig
+};

package/node_modules/@agnos-ui/core/components/commonProps.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Interface representing the common properties and state for widgets.
+ */
+export interface WidgetsCommonPropsAndState {
+    /**
+     * CSS classes to be applied on the widget main container
+     *
+     * @defaultValue `''`
+     */
+    className: string;
+}