@vodafone_de/publish-test 0.0.1 → 53.0.0

package/dist/hooks/useImageComponent/index.d.ts

@@ -0,0 +1,37 @@
+import { ComponentType, JSX, ReactNode } from 'react';
+import { ImageProps } from '../../components/Image';
+/**
+ * Props of the image component.
+ */
+export type ImageComponentProps = JSX.IntrinsicElements['img'] & {
+    src: string;
+    alt: string;
+    width?: number;
+    height?: number;
+    aspectRatio?: `${number}/${number}`;
+};
+/**
+ * Image component type.
+ */
+export type ImageComponentType = ComponentType<ImageComponentProps>;
+/**
+ * Default image component using `<img>`.
+ * @todo Filter out non-standard image props here
+ */
+export declare const DefaultImage: ImageComponentType;
+/**
+ * Context for providing a custom image component.
+ */
+export declare const ImageContext: import('react').Context<ImageComponentType>;
+/**
+ * Hook to access the current image component from context.
+ */
+export declare const useImageComponent: () => ImageComponentType;
+/**
+ * Provider for ImageContext
+ */
+export declare const ImageProvider: ({ imageComponent, children, }: {
+    imageComponent: ImageComponentType;
+    children?: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const filterImagePropsToImageComponentProps: (props: ImageProps) => ImageComponentProps;

package/dist/hooks/useImageComponent/index.js

@@ -0,0 +1,23 @@
+import { jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+import { p as pickDomProps, s as shouldForwardProp } from "../../shouldForwardProp-CONMmlMa.js";
+const DefaultImage = (props) => /* @__PURE__ */ jsx("img", { ...pickDomProps(props) });
+const ImageContext = createContext(DefaultImage);
+const useImageComponent = () => useContext(ImageContext);
+const ImageProvider = ({
+  imageComponent,
+  children
+}) => {
+  return /* @__PURE__ */ jsx(ImageContext, { value: imageComponent, children });
+};
+const imagePropsToPassOn = ["aspectRatio", "width", "height"];
+const filterImagePropsToImageComponentProps = (props) => {
+  return Object.fromEntries(Object.entries(props).filter(([key]) => imagePropsToPassOn.includes(key) || shouldForwardProp(key)));
+};
+export {
+  DefaultImage,
+  ImageContext,
+  ImageProvider,
+  filterImagePropsToImageComponentProps,
+  useImageComponent
+};

package/dist/hooks/useLinkComponent/index.d.ts

@@ -0,0 +1,28 @@
+import { ComponentType, JSX, ReactNode } from 'react';
+/**
+ * Props of the link component.
+ */
+export type LinkComponentProps = JSX.IntrinsicElements['a'];
+/**
+ * Link component type.
+ */
+export type LinkComponentType = ComponentType<LinkComponentProps>;
+/**
+ * Default link component using `<a>`.
+ */
+export declare const DefaultLink: LinkComponentType;
+/**
+ * Context for providing a custom link component.
+ */
+export declare const LinkContext: import('react').Context<LinkComponentType>;
+/**
+ * Hook to access the current link component from context.
+ */
+export declare const useLinkComponent: () => LinkComponentType;
+/**
+ * Provider for LinkContext
+ */
+export declare const LinkProvider: ({ linkComponent, children, }: {
+    linkComponent: LinkComponentType;
+    children?: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;

package/dist/hooks/useLinkComponent/index.js

@@ -0,0 +1,17 @@
+import { jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+const DefaultLink = (props) => /* @__PURE__ */ jsx("a", { ...props });
+const LinkContext = createContext(DefaultLink);
+const useLinkComponent = () => useContext(LinkContext);
+const LinkProvider = ({
+  linkComponent,
+  children
+}) => {
+  return /* @__PURE__ */ jsx(LinkContext, { value: linkComponent, children });
+};
+export {
+  DefaultLink,
+  LinkContext,
+  LinkProvider,
+  useLinkComponent
+};

package/dist/hooks/useMediaQuery/index.d.ts

@@ -0,0 +1,7 @@
+/**
+ * The useMediaQuery hook is a custom React Hook that allows
+ * to respond to changes in a CSS media query.
+ *
+ * It's useful for building responsive UIs that adapt to screen size, orientation, or other media features.
+ */
+export declare const useMediaQuery: (query: string, initialState?: boolean) => boolean;

package/dist/hooks/useMediaQuery/index.js

@@ -0,0 +1,19 @@
+import { useState, useEffect } from "react";
+const useMediaQuery = (query, initialState = false) => {
+  const [mediaQueryMatches, setMediaQueryMatches] = useState(initialState);
+  useEffect(() => {
+    const mediaQuery = window.matchMedia(query);
+    const handleMediaQueryChange = (event) => {
+      setMediaQueryMatches(event.matches);
+    };
+    setMediaQueryMatches(mediaQuery.matches);
+    mediaQuery.addEventListener("change", handleMediaQueryChange);
+    return () => {
+      mediaQuery.removeEventListener("change", handleMediaQueryChange);
+    };
+  }, [query]);
+  return mediaQueryMatches;
+};
+export {
+  useMediaQuery
+};

package/dist/hooks/usePictureComponent/index.d.ts

@@ -0,0 +1,49 @@
+import { ComponentType, JSX, ReactNode } from 'react';
+import { ArtDirectedImageSourceType } from '../../components/ArtDirectedImage';
+import { ImageProps } from '../../components/Image';
+/**
+ * Props of a single source for the picture component.
+ */
+type PictureComponentSourceProps = JSX.IntrinsicElements['source'] & {
+    srcSet: string;
+    media: string;
+};
+/**
+ * Props of the picture component.
+ */
+export type PictureComponentProps = JSX.IntrinsicElements['picture'] & {
+    sources: PictureComponentSourceProps[];
+    image: JSX.IntrinsicElements['img'] & {
+        src: string;
+        alt: string;
+        width?: number;
+        height?: number;
+        aspectRatio: `${number}/${number}`;
+    };
+};
+/**
+ * Picture component type.
+ */
+export type PictureComponentType = ComponentType<PictureComponentProps>;
+/**
+ * Default picture component using `<picture>`.
+ */
+export declare const DefaultPicture: PictureComponentType;
+/**
+ * Context for providing a custom picture component.
+ */
+export declare const PictureContext: import('react').Context<PictureComponentType>;
+/**
+ * Hook to access the current picture component from context.
+ */
+export declare const usePictureComponent: () => PictureComponentType;
+/**
+ * Provider for PictureContext
+ */
+export declare const PictureProvider: ({ pictureComponent, children, }: {
+    pictureComponent: PictureComponentType;
+    children?: ReactNode;
+}) => import("react/jsx-runtime").JSX.Element;
+export declare const filterImagePropsToPictureComponentImageProps: (props: ImageProps) => PictureComponentProps["image"];
+export declare const filterAspectRatioFromSources: (source: ArtDirectedImageSourceType) => PictureComponentSourceProps;
+export {};

package/dist/hooks/usePictureComponent/index.js

@@ -0,0 +1,37 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { createContext, createElement, useContext } from "react";
+import { p as pickDomProps, s as shouldForwardProp } from "../../shouldForwardProp-CONMmlMa.js";
+const DefaultPicture = ({
+  sources,
+  image,
+  ...props
+}) => /* @__PURE__ */ jsxs("picture", { ...pickDomProps(props), children: [
+  sources.map(({
+    srcSet,
+    ...otherSourceProps
+  }) => /* @__PURE__ */ createElement("source", { ...pickDomProps(otherSourceProps), key: srcSet, srcSet })),
+  /* @__PURE__ */ jsx("img", { ...pickDomProps(image) })
+] });
+const PictureContext = createContext(DefaultPicture);
+const usePictureComponent = () => useContext(PictureContext);
+const PictureProvider = ({
+  pictureComponent,
+  children
+}) => {
+  return /* @__PURE__ */ jsx(PictureContext, { value: pictureComponent, children });
+};
+const imagePropsToPassOn = ["aspectRatio"];
+const filterImagePropsToPictureComponentImageProps = (props) => {
+  return Object.fromEntries(Object.entries(props).filter(([key]) => imagePropsToPassOn.includes(key) || shouldForwardProp(key)));
+};
+const filterAspectRatioFromSources = (source) => {
+  return Object.fromEntries(Object.entries(source).filter(([key]) => key !== "aspectRatio"));
+};
+export {
+  DefaultPicture,
+  PictureContext,
+  PictureProvider,
+  filterAspectRatioFromSources,
+  filterImagePropsToPictureComponentImageProps,
+  usePictureComponent
+};

package/dist/hooks/useReducedMotion/index.d.ts

@@ -0,0 +1,5 @@
+/**
+ * The useReducedMotion hook is a custom React Hook that detects
+ * whether the user has requested reduced motion in their system accessibility settings—typically to minimize animations and transitions.
+ */
+export declare const useReducedMotion: () => boolean;

package/dist/hooks/useReducedMotion/index.js

@@ -0,0 +1,9 @@
+import { reducedMotionQuery } from "../../foundations/media-query/reducedMotion/index.js";
+import { useMediaQuery } from "../useMediaQuery/index.js";
+const useReducedMotion = () => {
+  const reducedMotion = useMediaQuery(reducedMotionQuery);
+  return reducedMotion;
+};
+export {
+  useReducedMotion
+};

package/dist/hooks/useThirdPartyConsent/index.d.ts

@@ -0,0 +1,39 @@
+/**
+ * Custom event name for third-party consent changes.
+ * This provides a reliable cross-browser mechanism for detecting consent updates.
+ */
+export declare const CONSENT_CHANGE_EVENT = "brix-consent-change";
+export declare const consentStorageItemName = "adv_fcData";
+export declare const consentStorageFeature = "permissions";
+export declare const consentStorageKey = "LI-TPV";
+export type ConsentPermissionStorage = {
+    [key in typeof consentStorageKey]?: 'true' | 'false' | boolean;
+};
+export type ConsentStorage = {
+    [key in typeof consentStorageFeature]?: ConsentPermissionStorage;
+};
+export interface WindowWithScodeLoaded extends Window {
+    _dfq?: unknown[];
+}
+export declare const checkThirdPartyConsentStorage: () => boolean;
+/**
+ * Dispatches a custom event to notify listeners that consent has changed.
+ * This should be called whenever the consent storage is updated.
+ */
+export declare const notifyConsentChange: () => void;
+/**
+ * Requests focus for `targetId`, either right away or once `useConsentFocus` sees it mounted.
+ * Supersedes a request that is still pending.
+ */
+export declare const requestConsentFocus: (targetId: string) => void;
+/**
+ * Completes the focus handover started by a ConsentMessage once the consented content is
+ * mounted, so focus stays inside the surrounding context (for example a Tray). Without a
+ * pending request nothing happens, so an already consented page load never moves focus.
+ */
+export declare const useConsentFocus: (targetId: string, consent: boolean) => void;
+/**
+ * The useThirdPartyConsent hook is a custom React Hook designed to
+ * track and respond to changes in a user's third-party consent status,
+ */
+export declare const useThirdPartyConsent: () => boolean;

package/dist/hooks/useThirdPartyConsent/index.js

@@ -0,0 +1,92 @@
+import { useEffect, useState } from "react";
+const CONSENT_CHANGE_EVENT = "brix-consent-change";
+const consentStorageItemName = "adv_fcData";
+const consentStorageFeature = "permissions";
+const consentStorageKey = "LI-TPV";
+const checkThirdPartyConsentStorage = () => {
+  try {
+    const raw = sessionStorage.getItem(consentStorageItemName);
+    if (!raw) {
+      return false;
+    }
+    try {
+      const json = JSON.parse(raw);
+      if (!json[consentStorageFeature]) {
+        return false;
+      }
+      if (!json[consentStorageFeature][consentStorageKey]) {
+        return false;
+      }
+      if ("true" === json[consentStorageFeature][consentStorageKey]) {
+        return true;
+      }
+      return true === json[consentStorageFeature][consentStorageKey];
+    } catch (error) {
+      return false;
+    }
+  } catch (error) {
+    return false;
+  }
+};
+const notifyConsentChange = () => {
+  window.dispatchEvent(new CustomEvent(CONSENT_CHANGE_EVENT));
+};
+let requestedConsentFocusId = null;
+const focusRequestedConsentTarget = (targetId) => {
+  const target = document.getElementById(targetId);
+  if (!target) {
+    return;
+  }
+  requestedConsentFocusId = null;
+  target.focus();
+};
+const requestConsentFocus = (targetId) => {
+  requestedConsentFocusId = targetId;
+  focusRequestedConsentTarget(targetId);
+};
+const clearConsentFocusRequest = () => {
+  requestedConsentFocusId = null;
+};
+const useConsentFocus = (targetId, consent) => {
+  useEffect(() => {
+    if (!consent) {
+      return;
+    }
+    if (requestedConsentFocusId !== targetId) {
+      return;
+    }
+    focusRequestedConsentTarget(targetId);
+    return () => {
+      if (requestedConsentFocusId === targetId) {
+        clearConsentFocusRequest();
+      }
+    };
+  }, [consent, targetId]);
+};
+const useThirdPartyConsent = () => {
+  const [consent, setConsent] = useState(false);
+  useEffect(() => {
+    const handleStorageChange = () => {
+      setConsent(checkThirdPartyConsentStorage());
+    };
+    handleStorageChange();
+    window.addEventListener("storage", handleStorageChange);
+    window.addEventListener(CONSENT_CHANGE_EVENT, handleStorageChange);
+    return () => {
+      window.removeEventListener("storage", handleStorageChange);
+      window.removeEventListener(CONSENT_CHANGE_EVENT, handleStorageChange);
+    };
+  }, []);
+  return consent;
+};
+export {
+  CONSENT_CHANGE_EVENT,
+  checkThirdPartyConsentStorage,
+  consentStorageFeature,
+  consentStorageItemName,
+  consentStorageKey,
+  notifyConsentChange,
+  requestConsentFocus,
+  useConsentFocus,
+  useThirdPartyConsent
+};

package/dist/hooks/useViewport/index.d.ts

@@ -0,0 +1,7 @@
+import { ViewportName } from '../../foundations/types/Viewport';
+/**
+ * The useViewport hook is a custom React Hook that determines the current viewport size
+ * is matching one of our three size categories:
+ * sm, md or lg
+ */
+export declare const useViewport: () => ViewportName;

package/dist/hooks/useViewport/index.js

@@ -0,0 +1,7 @@
+import "react";
+import "../../index-CG4uiVbZ.js";
+import { u } from "../../index-DlENLqPq.js";
+import "../useMediaQuery/index.js";
+export {
+  u as useViewport
+};

package/dist/icons/index.d.ts

@@ -0,0 +1 @@
+export * from '@vfde-react/inline-icon-library';