@mobielnl/elements 0.12.9 → 0.12.10

package/dist/{index-BomnOT_0.js → index-Cfu89JTt.js}

@@ -1,5 +1,5 @@
 "use client";
-import { n as j, i as N, m as Z, r as ze, h as qe, a as Lt, w as Q, b as pe, c as Ce, d as Xe, e as oe, f as Pe, t as O, g as Nt, j as G, v as Gt, k as $, M as H, K as Ye, l as $t, o as Ht, p as ge, q as Wt, s as _t, u as jt, x as Je, y as Ut, z as zt, A as qt, B as ke, C as Fe, D as z, E as Oe, F as Xt, V as Yt, G as Jt, H as Zt, I as Qt, J as en, L as tn, N as Ze, O as nn, P as sn, Q as rn, R as an, S as on, T as Qe, U as et, W as tt, X as nt, Y as ln } from "./index-DbVXxL82.js";
+import { n as j, i as N, m as Z, r as ze, h as qe, a as Lt, w as Q, b as pe, c as Ce, d as Xe, e as oe, f as Pe, t as O, g as Nt, j as G, v as Gt, k as $, M as H, K as Ye, l as $t, o as Ht, p as ge, q as Wt, s as _t, u as jt, x as Je, y as Ut, z as zt, A as qt, B as ke, C as Fe, D as z, E as Oe, F as Xt, V as Yt, G as Jt, H as Zt, I as Qt, J as en, L as tn, N as Ze, O as nn, P as sn, Q as rn, R as an, S as on, T as Qe, U as et, W as tt, X as nt, Y as ln } from "./index-Cbak1rDD.js";
 import { Fragment as un } from "react";
 var Bt = typeof globalThis < "u" && globalThis.process ? globalThis.process : { env: { NODE_ENV: "production" } };
 // @__NO_SIDE_EFFECTS__

package/dist/index.d.ts

@@ -276,6 +276,11 @@ declare type DetailsModalClassNames = {
     costOverview?: CostOverviewClassNames;
 };
 
+export declare type DetailsModalState = {
+    proposition: ProductCardPropositionFragment;
+    tab: DetailsModalTab;
+};
+
 declare type DetailsModalTab = 'general' | 'conditions' | 'channels' | 'costs';
 
 /** Event fired when proposition details are viewed */
@@ -508,6 +513,43 @@ declare type GeneralClassNames = {
     base?: string;
 } & SectionClassNames;
 
+/**
+ * ClassNames for styling different parts of the `HandsetCreditSelector` component
+ */
+declare type HandsetCreditSelectorClassNames = {
+    /** Root container */
+    base?: string;
+    /** Row containing the one-time and monthly fee display */
+    priceRow?: string;
+    /** One-time fee label */
+    oneTimeLabel?: string;
+    /** One-time fee value */
+    oneTimeValue?: string;
+    /** Monthly fee label */
+    monthlyLabel?: string;
+    /** Monthly fee value */
+    monthlyValue?: string;
+    /** Row containing the slider and buttons */
+    sliderRow?: string;
+    /** Decrement button */
+    decrementButton?: string;
+    /** Increment button */
+    incrementButton?: string;
+    /** Slider component class styling slots - matches HeroUI Slider classNames */
+    slider?: {
+        /** Represents individual steps or intervals on the Slider */
+        step?: string;
+        /** The base bar of the Slider, along which the thumb moves */
+        track?: string;
+        /** A visual representation of the selected value */
+        filler?: string;
+        /** The interactive element that users drag along the track */
+        thumb?: string;
+    };
+    /** Credit check info text */
+    creditCheckText?: string;
+};
+
 /**
  * ClassNames for styling the `Label` component within `PropositionCard`
  */
@@ -1160,6 +1202,26 @@ declare type ProductCardPropositionFragment = {
 
 export declare type ProductCategory = 'sim-only-proposition' | 'fixed-proposition' | 'smartphone-proposition' | 'smartphone-proposition-extended';
 
+/** ClassNames for styling the `ProductHeader` component */
+declare type ProductHeaderClassNames = {
+    /** Wrapper container for the product header */
+    base?: string;
+    /** Product image (smartphone) – wrapper and img */
+    productImage?: {
+        wrapper?: string;
+        img?: string;
+    };
+    /** Provider image (fixed/sim-only) – wrapper and img */
+    providerImage?: {
+        wrapper?: string;
+        img?: string;
+    };
+    /** Stock status indicator – see ProductStockStatus */
+    productStockStatus?: NonNullable<MainImageClassNames['phoneImage']>['stockIndicator'];
+    /** Proposition header class styling slots */
+    propositionHeader?: PropositionHeaderClassNames;
+};
+
 export declare function ProductResults({ classNames, initialSelectedFilters, initialProfile, onProfileChange, onError, onAction, ...props }: ProductResultsProps): JSX.Element;
 
 /**
@@ -1538,6 +1600,35 @@ declare type PropositionOverviewClassNames = {
     creditInfo?: CreditInfoClassNames_2;
 };
 
+export declare function PropositionSelector({ propositionKey, classNames, initialProfile, onProfileChange, onError, ...props }: PropositionSelectorProps): JSX.Element;
+
+export declare type PropositionSelectorClassNames = {
+    base?: string;
+    /** HandsetCreditSelector component class styling slots */
+    handsetCreditSelector?: HandsetCreditSelectorClassNames;
+    /** ProductHeader class styling slots (base, productImage, providerImage, productStockStatus, propositionHeader) */
+    productHeader?: ProductHeaderClassNames;
+};
+
+export declare type PropositionSelectorProps = {
+    /** Initial proposition key
+     * @example
+     * '1412-10116|1413-10646|plv-398' */
+    propositionKey: string;
+    /** Class slots for styling */
+    classNames?: PropositionSelectorClassNames;
+    /** Initial user profile */
+    initialProfile?: Partial<Profile>;
+    /** Callback function to handle profile changes */
+    onProfileChange?: (profile: Partial<Profile>) => void;
+    /** Callback function to add search params for the click-out URL */
+    addClickoutSearchParams?: (searchParams: URLSearchParams) => URLSearchParams;
+    /** Callback function called when an error occurs */
+    onError?: (error: Error) => void;
+    /** Callback function to handle return click */
+    onReturnClick?: () => void;
+};
+
 export declare type ProviderOption = {
     slug: string;
     name: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mobielnl/elements",
-  "version": "0.12.9",
+  "version": "0.12.10",
   "description": "Mobiel.nl Elements - React component library for partner websites",
   "private": false,
   "type": "module",