@contentful/experiences-design 0.11.0 → 0.12.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,141 @@
1
+ ## 0.12.1 (2026-10-09)
2
+
3
+ This was a version bump only for design to align it with other projects, there were no code changes.
4
+
5
+ ## 0.12.0 (2026-10-08)
6
+
7
+ ### 🚀 Features
8
+
9
+ - ⚠️ remove sdk viewport surface [SPA-5275] ([#220](https://github.com/contentful/experiences/pull/220))
10
+
11
+ ### ⚠️ Breaking Changes
12
+
13
+ - remove sdk viewport surface [SPA-5275] ([#220](https://github.com/contentful/experiences/pull/220))
14
+ The SDK no longer exposes viewport definitions, viewport-aware design-value resolution, or active-viewport hooks. Use CSS media queries or application-owned matchMedia integration for responsive behavior. Delivered design property values are now flat and require no migration."
15
+ M AGENTS.md
16
+ M ARCHITECTURE.md
17
+ M CONTRIBUTING.md
18
+ M README.md
19
+ M catalog-info.yaml
20
+ M examples/angular/README.md
21
+ M examples/angular/src/app/components/heading.component.ts
22
+ D examples/angular/src/app/lib/detect-viewport.ts
23
+ M examples/angular/src/app/lib/experience-config.ts
24
+ M examples/angular/src/app/lib/experience-route-data.ts
25
+ M examples/angular/src/app/pages/experience-page.component.ts
26
+ M examples/angular/src/server.ts
27
+ M examples/nextjs/README.md
28
+ M examples/nextjs/app/[slug]/page.tsx
29
+ M examples/nextjs/components/Heading.tsx
30
+ M examples/nextjs/components/LivePreviewExperience.tsx
31
+ M examples/nextjs/components/Section.tsx
32
+ D examples/nextjs/lib/detect-viewport.ts
33
+ M examples/nextjs/lib/experience-config.tsx
34
+ M examples/scripts/bootstrap-example.ts
35
+ M examples/scripts/fixture/experience.ts
36
+ M examples/scripts/fixture/types.ts
37
+ M examples/sveltekit/README.md
38
+ M examples/sveltekit/src/lib/components/Heading.svelte
39
+ D examples/sveltekit/src/lib/detect-viewport.ts
40
+ M examples/sveltekit/src/lib/experience-config.ts
41
+ M examples/sveltekit/src/routes/[slug]/+page.server.ts
42
+ M examples/sveltekit/src/routes/[slug]/+page.svelte
43
+ M examples/sveltekit/vite.config.ts
44
+ M package-lock.json
45
+ M packages/adapter-angular/README.md
46
+ M packages/adapter-angular/src/client-experience-renderer.component.ts
47
+ M packages/adapter-angular/src/context.ts
48
+ M packages/adapter-angular/src/debug-experience.test.ts
49
+ M packages/adapter-angular/src/debug-panel-coverage.ssr.test.ts
50
+ M packages/adapter-angular/src/debug-panel-coverage.test.ts
51
+ M packages/adapter-angular/src/dom-parity.test.ts
52
+ M packages/adapter-angular/src/experience-defaults.ts
53
+ M packages/adapter-angular/src/experience-scope.ts
54
+ M packages/adapter-angular/src/index.ts
55
+ D packages/adapter-angular/src/inject-active-viewport.ts
56
+ M packages/adapter-angular/src/inject-design-values.ts
57
+ M packages/adapter-angular/src/inject-experience-plan.ts
58
+ M packages/adapter-angular/src/live-preview-experience.ssr.test.ts
59
+ M packages/adapter-angular/src/live-preview-experience.test.ts
60
+ M packages/adapter-angular/src/node-render-engine.test.ts
61
+ M packages/adapter-angular/src/node-render-engine.ts
62
+ M packages/adapter-angular/src/node-scopes.ts
63
+ M packages/adapter-angular/src/nodes-renderer.ssr.test.ts
64
+ M packages/adapter-angular/src/server-experience-renderer.component.ts
65
+ M packages/adapter-angular/src/server-renderer.test.ts
66
+ M packages/adapter-angular/src/test-fixtures/render-harness.ts
67
+ M packages/adapter-angular/src/types.ts
68
+ M packages/adapter-react/README.md
69
+ M packages/adapter-react/src/client-renderer.tsx
70
+ M packages/adapter-react/src/context.tsx
71
+ M packages/adapter-react/src/debug-experience.test.tsx
72
+ M packages/adapter-react/src/debug-experience.tsx
73
+ M packages/adapter-react/src/debug-panel-coverage.test.tsx
74
+ M packages/adapter-react/src/index.ts
75
+ M packages/adapter-react/src/nodes-renderer.ssr.test.tsx
76
+ M packages/adapter-react/src/nodes-renderer.test.tsx
77
+ M packages/adapter-react/src/nodes-renderer.tsx
78
+ M packages/adapter-react/src/server-renderer.test.tsx
79
+ M packages/adapter-react/src/server-renderer.tsx
80
+ M packages/adapter-react/src/types.ts
81
+ D packages/adapter-react/src/use-active-viewport.ts
82
+ M packages/adapter-react/src/use-design-values.tsx
83
+ M packages/adapter-react/src/use-experience-plan.test.tsx
84
+ M packages/adapter-react/src/use-experience-plan.ts
85
+ M packages/adapter-react/src/use-live-preview-experience.test.tsx
86
+ M packages/adapter-react/src/use-live-preview.test.tsx
87
+ M packages/adapter-svelte/README.md
88
+ M packages/adapter-svelte/src/ClientExperienceRenderer.svelte
89
+ M packages/adapter-svelte/src/DebugExperience.svelte
90
+ M packages/adapter-svelte/src/DebugExperience.test.ts
91
+ M packages/adapter-svelte/src/NodeRenderer.svelte
92
+ M packages/adapter-svelte/src/NodeRenderer.test.ts
93
+ M packages/adapter-svelte/src/NodesRenderer.svelte
94
+ M packages/adapter-svelte/src/ServerExperienceRenderer.svelte
95
+ M packages/adapter-svelte/src/component-props.ts
96
+ M packages/adapter-svelte/src/context.ts
97
+ M packages/adapter-svelte/src/debug-panel-coverage.ssr.test.ts
98
+ M packages/adapter-svelte/src/debug-panel-coverage.test.ts
99
+ M packages/adapter-svelte/src/get-design-values.ts
100
+ M packages/adapter-svelte/src/index.ts
101
+ M packages/adapter-svelte/src/nodes-renderer.ssr.test.ts
102
+ M packages/adapter-svelte/src/server-renderer.test.ts
103
+ M packages/adapter-svelte/src/types.ts
104
+ D packages/adapter-svelte/src/use-active-viewport.svelte.ts
105
+ M packages/adapter-svelte/src/use-experience-plan.test.ts
106
+ M packages/adapter-svelte/src/use-live-preview-experience.test.ts
107
+ M packages/adapter-svelte/src/use-live-preview.test.ts
108
+ M packages/client/src/contentful-experiences.test.ts
109
+ M packages/client/src/contentful-experiences.ts
110
+ M packages/client/src/fetch-experience.test.ts
111
+ M packages/client/src/fetch-experience.ts
112
+ M packages/core/README.md
113
+ A packages/core/src/design-properties.test.ts
114
+ A packages/core/src/design-properties.ts
115
+ M packages/core/src/index.ts
116
+ M packages/core/src/resolve-experience.test.ts
117
+ M packages/core/src/resolve-experience.ts
118
+ M packages/core/src/types.ts
119
+ D packages/core/src/viewport.test.ts
120
+ D packages/core/src/viewport.ts
121
+ M packages/design/README.md
122
+ M packages/design/package.json
123
+ M packages/design/src/index.ts
124
+ D packages/design/src/media-query-matchers.ts
125
+ D packages/design/src/select-resolved-design.ts
126
+ D packages/design/src/viewport.test.ts
127
+ D packages/design/src/viewport.ts
128
+ M packages/live-preview/README.md
129
+ M packages/live-preview/src/experience-payload.ts
130
+ M packages/live-preview/src/fetch-preview-session.test.ts
131
+ M packages/live-preview/src/fetch-preview-session.ts
132
+ M packages/live-preview/src/live-preview-client.test.ts
133
+ M packages/node/README.md
134
+ M packages/node/src/contentful-experiences.test.ts
135
+ M packages/node/src/contentful-experiences.ts
136
+ M packages/web/README.md
137
+ M packages/web/src/contentful-experiences.test.ts
138
+
1
139
  ## 0.11.0 (2026-10-06)
2
140
 
3
141
  ### 🧱 Updated Dependencies
package/README.md CHANGED
@@ -2,36 +2,37 @@
2
2
 
3
3
  > ⚠️ **Internal package.** You don't install this directly — the framework adapter (e.g. [`@contentful/experiences-react`](../adapter-react/)) re-exports the utilities you need.
4
4
 
5
- Pure, framework-agnostic viewport math for resolving Contentful's `DesignPropValue` envelopes against an active viewport.
5
+ Framework-agnostic helpers for turning resolved design-property records into
6
+ CSS-shaped values.
6
7
 
7
8
  ## What lives here
8
9
 
9
- - **`toCssMediaQuery(viewport)`** — convert Contentful's media-query DSL (`<992px`, `>1200px`, `*`) to a CSS media query string. The wildcard and any unrecognized format return `undefined`.
10
- - **`getViewportIndex(viewports, id?)`** — resolve a viewport id to its index in the cascade list.
11
- - **`getValueForViewport(prop, viewports, activeIdx)`** — unwrap a `DesignPropValue`. `ManualDesignValue` → its scalar; `ValuesByViewport` → cascade-lookup at the active viewport, then unwrap; `DesignToken` → pass the envelope through (you resolve it via `resolveToken` in v1).
12
- - **`resolveDesignProperties(designProps, viewports, activeIdx)`** — apply `getValueForViewport` to every key of a node's design-property bag.
13
- - **`applyTokenResolver(props, resolveToken?)`** — run a resolved design record through the Config's `resolveToken`. Scalars pass through; `DesignToken` envelopes are resolved, and any that resolve to `undefined` are dropped and reported in `unresolved`. With no resolver the record is returned unchanged — and if it still contains tokens, a one-time console warning fires (they'd otherwise reach components as raw envelope objects).
14
10
  - **`toCssKey(key)`** — normalize a design-record key to a candidate CSS property name: strip an optional `cf` prefix and camelCase kebab/snake (`cf-font-size` → `fontSize`).
15
11
  - **`isCssProperty(key)` / `CSS_PROPERTIES`** — membership test and the underlying `Set` of CSS property names the adapters' `toCss` will emit.
16
12
 
17
13
  ## `toCss` and the CSS-property whitelist
18
14
 
19
- `toCss` is a companion to the design-hook escape hatch, not part of the recommended styling path. Components should style from their auto-filled design props, where they read the keys they declared and there is nothing to filter — see [Styling components](../../README.md#styling-components). `toCss` earns its place when you're holding a whole resolved record from `useDesignValues()` / `getDesignValues()` / `injectDesignValues()` and need the CSS-shaped subset of it.
15
+ `toCss` is a companion to the design-hook escape hatch, not part of the
16
+ recommended styling path. Components should style from their auto-filled
17
+ design props, where they read the keys they declared and there is nothing to
18
+ filter — see [Styling components](../../README.md#styling-components).
20
19
 
21
- The adapters' `toCss` helper keeps only keys whose normalized form is in `CSS_PROPERTIES` and **drops everything else** — that's how semantic design values (`variant`, `as`, `ratio`, …) stay out of a style object. The trade-off is that a genuine CSS property missing from the set is dropped silently.
20
+ The adapters' `toCss` helper keeps only keys whose normalized form is in
21
+ `CSS_PROPERTIES` and **drops everything else** — that's how semantic design
22
+ values (`variant`, `as`, `ratio`, …) stay out of a style object. The trade-off
23
+ is that a genuine CSS property missing from the set is dropped silently.
22
24
 
23
25
  If you hit that:
24
26
 
25
27
  - **Read the value directly.** The full resolved record is available from `useDesignValues()` / `getDesignValues()`; `toCss` is only a convenience over it, so a key it drops is still readable by name.
26
28
  - **Extend the set.** `CSS_PROPERTIES` is exported and mutable (`CSS_PROPERTIES.add('containerType')`) — a key added there flows through `toCss` on the next render.
27
29
 
28
- The list is intentionally curated rather than exhaustive (a full CSS-property warning would misfire on the semantic keys `toCss` is meant to drop). Open a PR to add commonly-needed properties.
30
+ The list is intentionally curated rather than exhaustive (a full CSS-property
31
+ warning would misfire on the semantic keys `toCss` is meant to drop). Open a
32
+ PR to add commonly-needed properties.
29
33
 
30
- ## Cascade behavior
31
-
32
- Viewport order in the payload encodes cascade direction (desktop-first descending, mobile-first ascending). `getValueForViewport` walks backwards from the active viewport toward `viewports[0]`, returning the first defined value — emulating CSS cascade behavior at runtime.
33
-
34
- See [`../../AGENTS.md`](../../AGENTS.md) for the design rationale and multi-framework story.
34
+ See [`../../AGENTS.md`](../../AGENTS.md) for the design rationale and
35
+ multi-framework story.
35
36
 
36
37
  ## License
37
38
 
package/dist/index.d.ts CHANGED
@@ -1,5 +1 @@
1
- export { toCssMediaQuery } from './viewport.js';
2
1
  export { CSS_PROPERTIES, isCssProperty, toCssKey } from './css-properties.js';
3
- export { selectResolvedDesign } from './select-resolved-design.js';
4
- export { MediaQueryMatcher, createMediaQueryMatchers } from './media-query-matchers.js';
5
- export { applyTokenResolver, getValueForViewport, getViewportIndex, resolveDesignProperties } from '@contentful/experiences-sdk-core';
package/dist/index.js CHANGED
@@ -1,23 +1,7 @@
1
- import {
2
- applyTokenResolver,
3
- getValueForViewport,
4
- getViewportIndex,
5
- resolveDesignProperties,
6
- toCssMediaQuery
7
- } from "./viewport";
8
1
  import { CSS_PROPERTIES, isCssProperty, toCssKey } from "./css-properties";
9
- import { selectResolvedDesign } from "./select-resolved-design";
10
- import { createMediaQueryMatchers } from "./media-query-matchers";
11
2
  export {
12
3
  CSS_PROPERTIES,
13
- applyTokenResolver,
14
- createMediaQueryMatchers,
15
- getValueForViewport,
16
- getViewportIndex,
17
4
  isCssProperty,
18
- resolveDesignProperties,
19
- selectResolvedDesign,
20
- toCssKey,
21
- toCssMediaQuery
5
+ toCssKey
22
6
  };
23
7
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n applyTokenResolver,\n getValueForViewport,\n getViewportIndex,\n resolveDesignProperties,\n toCssMediaQuery,\n} from './viewport';\nexport { CSS_PROPERTIES, isCssProperty, toCssKey } from './css-properties';\nexport { selectResolvedDesign } from './select-resolved-design';\nexport { createMediaQueryMatchers } from './media-query-matchers';\nexport type { MediaQueryMatcher } from './media-query-matchers';\n"],"mappings":"AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AACP,SAAS,gBAAgB,eAAe,gBAAgB;AACxD,SAAS,4BAA4B;AACrC,SAAS,gCAAgC;","names":[]}
1
+ {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export { CSS_PROPERTIES, isCssProperty, toCssKey } from './css-properties';\n"],"mappings":"AAAA,SAAS,gBAAgB,eAAe,gBAAgB;","names":[]}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@contentful/experiences-design",
3
- "version": "0.11.0",
4
- "description": "Viewport math and design-property resolution utilities for Contentful Experiences",
3
+ "version": "0.12.1",
4
+ "description": "CSS property utilities for Contentful Experiences",
5
5
  "license": "MIT",
6
6
  "type": "module",
7
7
  "main": "./dist/index.js",
@@ -28,8 +28,5 @@
28
28
  "type": "git",
29
29
  "url": "https://github.com/contentful/experiences.git",
30
30
  "directory": "packages/design"
31
- },
32
- "dependencies": {
33
- "@contentful/experiences-sdk-core": "0.11.0"
34
31
  }
35
32
  }
@@ -1,26 +0,0 @@
1
- import { ViewportDef } from '@contentful/experiences-sdk-core';
2
-
3
- /**
4
- * @deprecated Viewports are being removed from the Experiences APIs. No
5
- * customer action is needed: this type is only used by the deprecated
6
- * active-viewport hooks. Will not be removed before 2026-10-06.
7
- */
8
- interface MediaQueryMatcher {
9
- index: number;
10
- signal: MediaQueryList;
11
- }
12
- /**
13
- * Builds one `MediaQueryList` per viewport that has a real media query, plus a
14
- * parallel array of their current match states.
15
- *
16
- * Outside the browser the matcher list comes back empty and only the wildcard
17
- * viewport is marked as matching, so callers stay SSR-safe without their own
18
- * `typeof window` guard.
19
- *
20
- * @deprecated Viewports are being removed from the Experiences APIs. No
21
- * customer action is needed: this helper is only used by the deprecated
22
- * active-viewport hooks. Will not be removed before 2026-10-06.
23
- */
24
- declare function createMediaQueryMatchers(viewports: ViewportDef[]): [MediaQueryMatcher[], boolean[]];
25
-
26
- export { type MediaQueryMatcher, createMediaQueryMatchers };
@@ -1,23 +0,0 @@
1
- import { toCssMediaQuery } from "./viewport";
2
- function createMediaQueryMatchers(viewports) {
3
- const mediaQueryMatches = new Array(viewports.length).fill(false);
4
- mediaQueryMatches[0] = true;
5
- const mediaQueryMatchers = [];
6
- if (typeof window === "undefined") {
7
- return [mediaQueryMatchers, mediaQueryMatches];
8
- }
9
- for (let index = 0; index < viewports.length; index++) {
10
- const viewport = viewports[index];
11
- if (!viewport) continue;
12
- const cssQuery = toCssMediaQuery(viewport);
13
- if (!cssQuery) continue;
14
- const matcher = window.matchMedia(cssQuery);
15
- mediaQueryMatches[index] = matcher.matches;
16
- mediaQueryMatchers.push({ index, signal: matcher });
17
- }
18
- return [mediaQueryMatchers, mediaQueryMatches];
19
- }
20
- export {
21
- createMediaQueryMatchers
22
- };
23
- //# sourceMappingURL=media-query-matchers.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/media-query-matchers.ts"],"sourcesContent":["/*\n * `window.matchMedia` plumbing for viewport tracking, shared by every adapter.\n *\n * Each adapter owns its own reactivity primitive (React `useState`, Svelte\n * `$state`, Angular signals) but the matcher construction and the SSR guard are\n * identical, so they live here.\n *\n * \"Active viewport\" = the last-matching media query in the ordered viewports\n * list. With desktop-first ordering (`*`, `<992px`, `<576px`), the narrowest\n * matching query wins. With mobile-first ordering, the widest wins. Either\n * way: the last `findLastIndex` of `mediaQueryMatches[i] === true`.\n */\n\nimport type { ViewportDef } from '@contentful/experiences-sdk-core';\n\nimport { toCssMediaQuery } from './viewport';\n\n/**\n * @deprecated Viewports are being removed from the Experiences APIs. No\n * customer action is needed: this type is only used by the deprecated\n * active-viewport hooks. Will not be removed before 2026-10-06.\n */\nexport interface MediaQueryMatcher {\n index: number;\n signal: MediaQueryList;\n}\n\n/**\n * Builds one `MediaQueryList` per viewport that has a real media query, plus a\n * parallel array of their current match states.\n *\n * Outside the browser the matcher list comes back empty and only the wildcard\n * viewport is marked as matching, so callers stay SSR-safe without their own\n * `typeof window` guard.\n *\n * @deprecated Viewports are being removed from the Experiences APIs. No\n * customer action is needed: this helper is only used by the deprecated\n * active-viewport hooks. Will not be removed before 2026-10-06.\n */\nexport function createMediaQueryMatchers(\n viewports: ViewportDef[]\n): [MediaQueryMatcher[], boolean[]] {\n const mediaQueryMatches: boolean[] = new Array(viewports.length).fill(false);\n // The first viewport is the wildcard \"*\" and always matches.\n mediaQueryMatches[0] = true;\n\n const mediaQueryMatchers: MediaQueryMatcher[] = [];\n if (typeof window === 'undefined') {\n return [mediaQueryMatchers, mediaQueryMatches];\n }\n for (let index = 0; index < viewports.length; index++) {\n const viewport = viewports[index];\n if (!viewport) continue;\n const cssQuery = toCssMediaQuery(viewport);\n if (!cssQuery) continue;\n const matcher = window.matchMedia(cssQuery);\n mediaQueryMatches[index] = matcher.matches;\n mediaQueryMatchers.push({ index, signal: matcher });\n }\n return [mediaQueryMatchers, mediaQueryMatches];\n}\n"],"mappings":"AAeA,SAAS,uBAAuB;AAwBzB,SAAS,yBACd,WACkC;AAClC,QAAM,oBAA+B,IAAI,MAAM,UAAU,MAAM,EAAE,KAAK,KAAK;AAE3E,oBAAkB,CAAC,IAAI;AAEvB,QAAM,qBAA0C,CAAC;AACjD,MAAI,OAAO,WAAW,aAAa;AACjC,WAAO,CAAC,oBAAoB,iBAAiB;AAAA,EAC/C;AACA,WAAS,QAAQ,GAAG,QAAQ,UAAU,QAAQ,SAAS;AACrD,UAAM,WAAW,UAAU,KAAK;AAChC,QAAI,CAAC,SAAU;AACf,UAAM,WAAW,gBAAgB,QAAQ;AACzC,QAAI,CAAC,SAAU;AACf,UAAM,UAAU,OAAO,WAAW,QAAQ;AAC1C,sBAAkB,KAAK,IAAI,QAAQ;AACnC,uBAAmB,KAAK,EAAE,OAAO,QAAQ,QAAQ,CAAC;AAAA,EACpD;AACA,SAAO,CAAC,oBAAoB,iBAAiB;AAC/C;","names":[]}
@@ -1,20 +0,0 @@
1
- import { DesignPropValue, ViewportDef, ResolveToken } from '@contentful/experiences-sdk-core';
2
-
3
- /**
4
- * Use the server-resolved `props.design` when the active viewport matches the
5
- * fallback; otherwise recompute the cascade from raw `props.designRaw`.
6
- *
7
- * @deprecated Viewports are being removed from the Experiences APIs. No
8
- * customer action is needed: with a single viewport, the active and fallback
9
- * indices always match, so this always returns `props.design`. Will not be
10
- * removed before 2026-10-06.
11
- */
12
- declare function selectResolvedDesign(props: {
13
- design: Record<string, unknown>;
14
- designRaw: Record<string, DesignPropValue>;
15
- }, viewports: ViewportDef[], activeViewportIndex: number, fallbackViewportIndex: number, resolveToken: ResolveToken | undefined): {
16
- props: Record<string, unknown>;
17
- unresolved: string[];
18
- };
19
-
20
- export { selectResolvedDesign };
@@ -1,12 +0,0 @@
1
- import { applyTokenResolver, resolveDesignProperties } from "@contentful/experiences-sdk-core";
2
- function selectResolvedDesign(props, viewports, activeViewportIndex, fallbackViewportIndex, resolveToken) {
3
- if (activeViewportIndex === fallbackViewportIndex) {
4
- return { props: props.design, unresolved: [] };
5
- }
6
- const resolvedDesign = resolveDesignProperties(props.designRaw, viewports, activeViewportIndex);
7
- return applyTokenResolver(resolvedDesign, resolveToken);
8
- }
9
- export {
10
- selectResolvedDesign
11
- };
12
- //# sourceMappingURL=select-resolved-design.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/select-resolved-design.ts"],"sourcesContent":["/*\n * Picks the design record a renderer should use for the active viewport.\n *\n * Shared by every framework adapter: the choice between \"trust the server's\n * pre-resolved values\" and \"recompute the cascade client-side\" is a property of\n * the IR, not of any one framework.\n */\n\nimport type { DesignPropValue, ResolveToken, ViewportDef } from '@contentful/experiences-sdk-core';\nimport { applyTokenResolver, resolveDesignProperties } from '@contentful/experiences-sdk-core';\n\n/**\n * Use the server-resolved `props.design` when the active viewport matches the\n * fallback; otherwise recompute the cascade from raw `props.designRaw`.\n *\n * @deprecated Viewports are being removed from the Experiences APIs. No\n * customer action is needed: with a single viewport, the active and fallback\n * indices always match, so this always returns `props.design`. Will not be\n * removed before 2026-10-06.\n */\nexport function selectResolvedDesign(\n props: { design: Record<string, unknown>; designRaw: Record<string, DesignPropValue> },\n viewports: ViewportDef[],\n activeViewportIndex: number,\n fallbackViewportIndex: number,\n resolveToken: ResolveToken | undefined\n): { props: Record<string, unknown>; unresolved: string[] } {\n if (activeViewportIndex === fallbackViewportIndex) {\n return { props: props.design, unresolved: [] };\n }\n const resolvedDesign = resolveDesignProperties(props.designRaw, viewports, activeViewportIndex);\n return applyTokenResolver(resolvedDesign, resolveToken);\n}\n"],"mappings":"AASA,SAAS,oBAAoB,+BAA+B;AAWrD,SAAS,qBACd,OACA,WACA,qBACA,uBACA,cAC0D;AAC1D,MAAI,wBAAwB,uBAAuB;AACjD,WAAO,EAAE,OAAO,MAAM,QAAQ,YAAY,CAAC,EAAE;AAAA,EAC/C;AACA,QAAM,iBAAiB,wBAAwB,MAAM,WAAW,WAAW,mBAAmB;AAC9F,SAAO,mBAAmB,gBAAgB,YAAY;AACxD;","names":[]}
@@ -1,15 +0,0 @@
1
- import { ViewportDef } from '@contentful/experiences-sdk-core';
2
- export { applyTokenResolver, getValueForViewport, getViewportIndex, resolveDesignProperties } from '@contentful/experiences-sdk-core';
3
-
4
- /**
5
- * Convert a Contentful viewport `query` string into a CSS media query.
6
- * Returns `undefined` for the wildcard "*" (always matches; no media query needed)
7
- * or for any unrecognized format.
8
- *
9
- * @deprecated Viewports are being removed from the Experiences APIs. No
10
- * customer action is needed: this helper is only used by the deprecated
11
- * active-viewport hooks. Will not be removed before 2026-10-06.
12
- */
13
- declare function toCssMediaQuery(viewport: ViewportDef): string | undefined;
14
-
15
- export { toCssMediaQuery };
package/dist/viewport.js DELETED
@@ -1,30 +0,0 @@
1
- import {
2
- applyTokenResolver,
3
- getValueForViewport,
4
- getViewportIndex,
5
- resolveDesignProperties
6
- } from "@contentful/experiences-sdk-core";
7
- const MEDIA_QUERY_REGEXP = /^(<|>)(\d+)(px|cm|mm|in|pt|pc)$/;
8
- function toCssMediaQuery(viewport) {
9
- const { query } = viewport;
10
- if (query === "*") return void 0;
11
- const match = query.match(MEDIA_QUERY_REGEXP);
12
- if (!match) return void 0;
13
- const [, operator, value, unit] = match;
14
- if (!operator || !value || !unit) return void 0;
15
- if (operator === "<") {
16
- return `(max-width: ${Number(value) - 1}${unit})`;
17
- }
18
- if (operator === ">") {
19
- return `(min-width: ${Number(value) + 1}${unit})`;
20
- }
21
- return void 0;
22
- }
23
- export {
24
- applyTokenResolver,
25
- getValueForViewport,
26
- getViewportIndex,
27
- resolveDesignProperties,
28
- toCssMediaQuery
29
- };
30
- //# sourceMappingURL=viewport.js.map
@@ -1 +0,0 @@
1
- {"version":3,"sources":["../src/viewport.ts"],"sourcesContent":["/*\n * Viewport → CSS media-query translation. The cascade + token-resolution\n * helpers now live in core (so the resolve pipeline can pre-resolve design\n * server-side) and are re-exported here to keep this package's API unchanged.\n */\n\nimport type { ViewportDef } from '@contentful/experiences-sdk-core';\n\nexport {\n applyTokenResolver,\n getValueForViewport,\n getViewportIndex,\n resolveDesignProperties,\n} from '@contentful/experiences-sdk-core';\n\nconst MEDIA_QUERY_REGEXP = /^(<|>)(\\d+)(px|cm|mm|in|pt|pc)$/;\n\n/**\n * Convert a Contentful viewport `query` string into a CSS media query.\n * Returns `undefined` for the wildcard \"*\" (always matches; no media query needed)\n * or for any unrecognized format.\n *\n * @deprecated Viewports are being removed from the Experiences APIs. No\n * customer action is needed: this helper is only used by the deprecated\n * active-viewport hooks. Will not be removed before 2026-10-06.\n */\nexport function toCssMediaQuery(viewport: ViewportDef): string | undefined {\n const { query } = viewport;\n if (query === '*') return undefined;\n const match = query.match(MEDIA_QUERY_REGEXP);\n if (!match) return undefined;\n const [, operator, value, unit] = match;\n if (!operator || !value || !unit) return undefined;\n if (operator === '<') {\n return `(max-width: ${Number(value) - 1}${unit})`;\n }\n if (operator === '>') {\n return `(min-width: ${Number(value) + 1}${unit})`;\n }\n return undefined;\n}\n"],"mappings":"AAQA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,MAAM,qBAAqB;AAWpB,SAAS,gBAAgB,UAA2C;AACzE,QAAM,EAAE,MAAM,IAAI;AAClB,MAAI,UAAU,IAAK,QAAO;AAC1B,QAAM,QAAQ,MAAM,MAAM,kBAAkB;AAC5C,MAAI,CAAC,MAAO,QAAO;AACnB,QAAM,CAAC,EAAE,UAAU,OAAO,IAAI,IAAI;AAClC,MAAI,CAAC,YAAY,CAAC,SAAS,CAAC,KAAM,QAAO;AACzC,MAAI,aAAa,KAAK;AACpB,WAAO,eAAe,OAAO,KAAK,IAAI,CAAC,GAAG,IAAI;AAAA,EAChD;AACA,MAAI,aAAa,KAAK;AACpB,WAAO,eAAe,OAAO,KAAK,IAAI,CAAC,GAAG,IAAI;AAAA,EAChD;AACA,SAAO;AACT;","names":[]}