@yahoo/uds-v5-wip 1.50.0 → 1.52.0

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.
Files changed (22) hide show
  1. package/dist/config/dist/createConfig.d.ts +11 -0
  2. package/dist/config/dist/createConfig.js +1 -1
  3. package/dist/config/dist/refs.js +5 -2
  4. package/dist/remotion/dist/components/image-slide.d.ts +1 -2
  5. package/dist/remotion/dist/components/image-slide.js +3 -3
  6. package/dist/remotion/dist/components/index.js +7 -7
  7. package/dist/remotion/dist/components/lower-third.d.ts +1 -2
  8. package/dist/remotion/dist/components/lower-third.js +5 -5
  9. package/dist/remotion/dist/components/quote-card.d.ts +1 -2
  10. package/dist/remotion/dist/components/quote-card.js +4 -4
  11. package/dist/remotion/dist/components/split-screen.d.ts +1 -2
  12. package/dist/remotion/dist/components/split-screen.js +7 -7
  13. package/dist/remotion/dist/components/stat-card.d.ts +1 -2
  14. package/dist/remotion/dist/components/stat-card.js +3 -3
  15. package/dist/remotion/dist/components/text-overlay.d.ts +1 -2
  16. package/dist/remotion/dist/components/text-overlay.js +2 -2
  17. package/dist/remotion/dist/components/title-card.d.ts +1 -2
  18. package/dist/remotion/dist/components/title-card.js +3 -3
  19. package/dist/remotion/dist/components/typing-text.d.ts +1 -2
  20. package/dist/remotion/dist/components/typing-text.js +3 -3
  21. package/dist/tsconfig.tsbuildinfo +1 -1
  22. package/package.json +3 -3
package/dist/config/dist/createConfig.d.ts CHANGED
@@ -181,6 +181,17 @@ type ExampleDef<TAxis extends string = string> = Record<string, ExampleEntryDef<
181
181
  interface BuildOptions {
182
182
  skipCssVariables?: boolean;
183
183
  preflight?: boolean;
184
+ /**
185
+ * Scope every emitted CSS selector under this class name. The emitter's
186
+ * `:root` block becomes `.<cssScope>`; mode/theme blocks (e.g. `.dark` or
187
+ * `[data-theme="slate"]`) keep their ancestor selector and append `.<cssScope>`
188
+ * so they still apply when the attribute is on `<html>`. Utility classes
189
+ * are nested under `.<cssScope>` so two UDS-powered packages on the same
190
+ * page do not collide.
191
+ *
192
+ * Wrap the embedded UI in `<div className="<cssScope>">` to activate.
193
+ */
194
+ cssScope?: string;
184
195
  }
185
196
  /** Internal data shape — accessible via resolveConfig() */
186
197
  interface UdsConfigData {
package/dist/config/dist/createConfig.js CHANGED
@@ -5,9 +5,9 @@ import { getConfigurablePropMapping } from "../../core/dist/configurable-prop-he
5
5
  import "../../core/dist/index.js";
6
6
  import { buildMotionReference, resolveComponentMotionAliases, validateComponentVariants } from "./component-resolution.js";
7
7
  import { setRegisteredStyleProps } from "./runtime-registry.js";
8
+ import { applyPresetToData, deepMerge, mergeAtomic } from "./preset-merge.js";
8
9
  import { resolveTokenType, sniffTokenTypeFromValue } from "./resolveTokenTypes.js";
9
10
  import { resolveStyleProp } from "./resolveStyleProp.js";
10
- import { applyPresetToData, deepMerge, mergeAtomic } from "./preset-merge.js";
11
11
  //#region ../config/dist/createConfig.js
12
12
  /** biome-ignore-all lint/suspicious/noExplicitAny: necessary for dynamic builder to work correctly */
13
13
  /**
package/dist/config/dist/refs.js CHANGED
@@ -58,8 +58,11 @@ function parseTokenRef(value) {
58
58
  function resolveTokenRef(value, configPrefix) {
59
59
  const ref = parseTokenRef(value);
60
60
  if (!ref) return value;
61
- const cssPrefix = kebabCase(ref.namespace);
62
- const cssName = safeTokenName(ref.name);
61
+ return refToVar(ref.namespace, ref.name, configPrefix);
62
+ }
63
+ function refToVar(namespace, name, configPrefix) {
64
+ const cssPrefix = kebabCase(namespace);
65
+ const cssName = safeTokenName(name);
63
66
  return `var(${configPrefix ? `--${configPrefix}-${cssPrefix}-${cssName}` : `--${cssPrefix}-${cssName}`})`;
64
67
  }
65
68
  //#endregion
package/dist/remotion/dist/components/image-slide.d.ts CHANGED
@@ -2,7 +2,6 @@ import * as _$react from "react";
2
2
  import * as _$_uds_types0 from "@uds/types";
3
3
 
4
4
  //#region ../remotion/dist/components/image-slide.d.ts
5
- //#region src/components/image-slide.d.ts
6
5
  /**
7
6
  * @description Full-screen image slide with optional caption overlay
8
7
  */
@@ -15,6 +14,6 @@ declare const ImageSlide: _$react.FC<_$_uds_types0.CreateComponentProps<string,
15
14
  root: "div";
16
15
  image: "img";
17
16
  caption: "div";
18
- }>>; //#endregion
17
+ }>>;
19
18
  //#endregion
20
19
  export { ImageSlide };
package/dist/remotion/dist/components/image-slide.js CHANGED
@@ -5,15 +5,15 @@ import { jsx, jsxs } from "react/jsx-runtime";
5
5
  /**
6
6
  * @description Full-screen image slide with optional caption overlay
7
7
  */
8
- const ImageSlide = createComponent(({ props, src, alt, caption, children }) => /* @__PURE__ */ jsxs("div", {
8
+ const ImageSlide = createComponent(({ props, src, alt, caption, children }) => jsxs("div", {
9
9
  ...props.root,
10
10
  children: [
11
- /* @__PURE__ */ jsx("img", {
11
+ jsx("img", {
12
12
  ...props.image,
13
13
  src,
14
14
  alt: alt ?? ""
15
15
  }),
16
- caption && /* @__PURE__ */ jsx("div", {
16
+ caption && jsx("div", {
17
17
  ...props.caption,
18
18
  children: caption
19
19
  }),
package/dist/remotion/dist/components/index.js CHANGED
@@ -1,16 +1,16 @@
1
1
  import "./image-slide.js";
2
- import "./lower-third.js";
3
- import "./quote-card.js";
4
- import "./split-screen.js";
5
- import "./stat-card.js";
6
- import "./text-overlay.js";
7
- import "./title-card.js";
8
- import "./typing-text.js";
9
2
  import "./image-slide.config.js";
3
+ import "./lower-third.js";
10
4
  import "./lower-third.config.js";
5
+ import "./quote-card.js";
11
6
  import "./quote-card.config.js";
7
+ import "./split-screen.js";
12
8
  import "./split-screen.config.js";
9
+ import "./stat-card.js";
13
10
  import "./stat-card.config.js";
11
+ import "./text-overlay.js";
14
12
  import "./text-overlay.config.js";
13
+ import "./title-card.js";
15
14
  import "./title-card.config.js";
15
+ import "./typing-text.js";
16
16
  import "./typing-text.config.js";
package/dist/remotion/dist/components/lower-third.d.ts CHANGED
@@ -2,7 +2,6 @@ import * as _$react from "react";
2
2
  import * as _$_uds_types0 from "@uds/types";
3
3
 
4
4
  //#region ../remotion/dist/components/lower-third.d.ts
5
- //#region src/components/lower-third.d.ts
6
5
  /**
7
6
  * @description Lower-third overlay with title and optional subtitle
8
7
  */
@@ -16,6 +15,6 @@ declare const LowerThird: _$react.FC<_$_uds_types0.CreateComponentProps<string,
16
15
  content: "div";
17
16
  title: "div";
18
17
  subtitle: "div";
19
- }>>; //#endregion
18
+ }>>;
20
19
  //#endregion
21
20
  export { LowerThird };
package/dist/remotion/dist/components/lower-third.js CHANGED
@@ -5,16 +5,16 @@ import { jsx, jsxs } from "react/jsx-runtime";
5
5
  /**
6
6
  * @description Lower-third overlay with title and optional subtitle
7
7
  */
8
- const LowerThird = createComponent(({ props, title, subtitle, children }) => /* @__PURE__ */ jsxs("div", {
8
+ const LowerThird = createComponent(({ props, title, subtitle, children }) => jsxs("div", {
9
9
  ...props.root,
10
10
  children: [
11
- /* @__PURE__ */ jsx("div", { ...props.bar }),
12
- /* @__PURE__ */ jsxs("div", {
11
+ jsx("div", { ...props.bar }),
12
+ jsxs("div", {
13
13
  ...props.content,
14
- children: [/* @__PURE__ */ jsx("div", {
14
+ children: [jsx("div", {
15
15
  ...props.title,
16
16
  children: title
17
- }), subtitle && /* @__PURE__ */ jsx("div", {
17
+ }), subtitle && jsx("div", {
18
18
  ...props.subtitle,
19
19
  children: subtitle
20
20
  })]
package/dist/remotion/dist/components/quote-card.d.ts CHANGED
@@ -2,7 +2,6 @@ import * as _$react from "react";
2
2
  import * as _$_uds_types0 from "@uds/types";
3
3
 
4
4
  //#region ../remotion/dist/components/quote-card.d.ts
5
- //#region src/components/quote-card.d.ts
6
5
  /**
7
6
  * @description Full-screen quote display with optional attribution
8
7
  */
@@ -16,6 +15,6 @@ declare const QuoteCard: _$react.FC<_$_uds_types0.CreateComponentProps<string, {
16
15
  quote: "div";
17
16
  divider: "div";
18
17
  attribution: "div";
19
- }>>; //#endregion
18
+ }>>;
20
19
  //#endregion
21
20
  export { QuoteCard };
package/dist/remotion/dist/components/quote-card.js CHANGED
@@ -5,18 +5,18 @@ import { Fragment, jsx, jsxs } from "react/jsx-runtime";
5
5
  /**
6
6
  * @description Full-screen quote display with optional attribution
7
7
  */
8
- const QuoteCard = createComponent(({ props, quote, attribution, children }) => /* @__PURE__ */ jsxs("div", {
8
+ const QuoteCard = createComponent(({ props, quote, attribution, children }) => jsxs("div", {
9
9
  ...props.root,
10
10
  children: [
11
- /* @__PURE__ */ jsx("div", {
11
+ jsx("div", {
12
12
  ...props.mark,
13
13
  children: "“"
14
14
  }),
15
- /* @__PURE__ */ jsx("div", {
15
+ jsx("div", {
16
16
  ...props.quote,
17
17
  children: quote
18
18
  }),
19
- attribution && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", { ...props.divider }), /* @__PURE__ */ jsx("div", {
19
+ attribution && jsxs(Fragment, { children: [jsx("div", { ...props.divider }), jsx("div", {
20
20
  ...props.attribution,
21
21
  children: attribution
22
22
  })] }),
package/dist/remotion/dist/components/split-screen.d.ts CHANGED
@@ -2,7 +2,6 @@ import * as _$react from "react";
2
2
  import * as _$_uds_types0 from "@uds/types";
3
3
 
4
4
  //#region ../remotion/dist/components/split-screen.d.ts
5
- //#region src/components/split-screen.d.ts
6
5
  /**
7
6
  * @description Side-by-side split screen layout for comparing content
8
7
  */
@@ -20,6 +19,6 @@ declare const SplitScreen: _$react.FC<_$_uds_types0.CreateComponentProps<string,
20
19
  leftBody: "div";
21
20
  rightTitle: "div";
22
21
  rightBody: "div";
23
- }>>; //#endregion
22
+ }>>;
24
23
  //#endregion
25
24
  export { SplitScreen };
package/dist/remotion/dist/components/split-screen.js CHANGED
@@ -5,25 +5,25 @@ import { jsx, jsxs } from "react/jsx-runtime";
5
5
  /**
6
6
  * @description Side-by-side split screen layout for comparing content
7
7
  */
8
- const SplitScreen = createComponent(({ props, leftTitle, leftBody, rightTitle, rightBody, children }) => /* @__PURE__ */ jsxs("div", {
8
+ const SplitScreen = createComponent(({ props, leftTitle, leftBody, rightTitle, rightBody, children }) => jsxs("div", {
9
9
  ...props.root,
10
10
  children: [
11
- /* @__PURE__ */ jsxs("div", {
11
+ jsxs("div", {
12
12
  ...props.left,
13
- children: [leftTitle && /* @__PURE__ */ jsx("div", {
13
+ children: [leftTitle && jsx("div", {
14
14
  ...props.leftTitle,
15
15
  children: leftTitle
16
- }), leftBody && /* @__PURE__ */ jsx("div", {
16
+ }), leftBody && jsx("div", {
17
17
  ...props.leftBody,
18
18
  children: leftBody
19
19
  })]
20
20
  }),
21
- /* @__PURE__ */ jsxs("div", {
21
+ jsxs("div", {
22
22
  ...props.right,
23
- children: [rightTitle && /* @__PURE__ */ jsx("div", {
23
+ children: [rightTitle && jsx("div", {
24
24
  ...props.rightTitle,
25
25
  children: rightTitle
26
- }), rightBody && /* @__PURE__ */ jsx("div", {
26
+ }), rightBody && jsx("div", {
27
27
  ...props.rightBody,
28
28
  children: rightBody
29
29
  })]
package/dist/remotion/dist/components/stat-card.d.ts CHANGED
@@ -2,7 +2,6 @@ import * as _$react from "react";
2
2
  import * as _$_uds_types0 from "@uds/types";
3
3
 
4
4
  //#region ../remotion/dist/components/stat-card.d.ts
5
- //#region src/components/stat-card.d.ts
6
5
  /**
7
6
  * @description Full-screen statistic display with large value and label
8
7
  */
@@ -14,6 +13,6 @@ declare const StatCard: _$react.FC<_$_uds_types0.CreateComponentProps<string, {
14
13
  root: "div";
15
14
  value: "div";
16
15
  label: "div";
17
- }>>; //#endregion
16
+ }>>;
18
17
  //#endregion
19
18
  export { StatCard };
package/dist/remotion/dist/components/stat-card.js CHANGED
@@ -5,14 +5,14 @@ import { jsx, jsxs } from "react/jsx-runtime";
5
5
  /**
6
6
  * @description Full-screen statistic display with large value and label
7
7
  */
8
- const StatCard = createComponent(({ props, value, label, children }) => /* @__PURE__ */ jsxs("div", {
8
+ const StatCard = createComponent(({ props, value, label, children }) => jsxs("div", {
9
9
  ...props.root,
10
10
  children: [
11
- /* @__PURE__ */ jsx("div", {
11
+ jsx("div", {
12
12
  ...props.value,
13
13
  children: value
14
14
  }),
15
- label && /* @__PURE__ */ jsx("div", {
15
+ label && jsx("div", {
16
16
  ...props.label,
17
17
  children: label
18
18
  }),
package/dist/remotion/dist/components/text-overlay.d.ts CHANGED
@@ -2,7 +2,6 @@ import * as _$react from "react";
2
2
  import * as _$_uds_types0 from "@uds/types";
3
3
 
4
4
  //#region ../remotion/dist/components/text-overlay.d.ts
5
- //#region src/components/text-overlay.d.ts
6
5
  /**
7
6
  * @description Full-screen text overlay for displaying text over video or images
8
7
  */
@@ -12,6 +11,6 @@ declare const TextOverlay: _$react.FC<_$_uds_types0.CreateComponentProps<string,
12
11
  }, {
13
12
  root: "div";
14
13
  text: "div";
15
- }>>; //#endregion
14
+ }>>;
16
15
  //#endregion
17
16
  export { TextOverlay };
package/dist/remotion/dist/components/text-overlay.js CHANGED
@@ -5,9 +5,9 @@ import { jsx, jsxs } from "react/jsx-runtime";
5
5
  /**
6
6
  * @description Full-screen text overlay for displaying text over video or images
7
7
  */
8
- const TextOverlay = createComponent(({ props, text, children }) => /* @__PURE__ */ jsxs("div", {
8
+ const TextOverlay = createComponent(({ props, text, children }) => jsxs("div", {
9
9
  ...props.root,
10
- children: [/* @__PURE__ */ jsx("div", {
10
+ children: [jsx("div", {
11
11
  ...props.text,
12
12
  children: text
13
13
  }), children]
package/dist/remotion/dist/components/title-card.d.ts CHANGED
@@ -2,7 +2,6 @@ import * as _$react from "react";
2
2
  import * as _$_uds_types0 from "@uds/types";
3
3
 
4
4
  //#region ../remotion/dist/components/title-card.d.ts
5
- //#region src/components/title-card.d.ts
6
5
  /**
7
6
  * @description Full-screen title card with optional subtitle for video scenes
8
7
  */
@@ -14,6 +13,6 @@ declare const TitleCard: _$react.FC<_$_uds_types0.CreateComponentProps<string, {
14
13
  root: "div";
15
14
  title: "div";
16
15
  subtitle: "div";
17
- }>>; //#endregion
16
+ }>>;
18
17
  //#endregion
19
18
  export { TitleCard };
package/dist/remotion/dist/components/title-card.js CHANGED
@@ -5,14 +5,14 @@ import { jsx, jsxs } from "react/jsx-runtime";
5
5
  /**
6
6
  * @description Full-screen title card with optional subtitle for video scenes
7
7
  */
8
- const TitleCard = createComponent(({ props, title, subtitle, children }) => /* @__PURE__ */ jsxs("div", {
8
+ const TitleCard = createComponent(({ props, title, subtitle, children }) => jsxs("div", {
9
9
  ...props.root,
10
10
  children: [
11
- /* @__PURE__ */ jsx("div", {
11
+ jsx("div", {
12
12
  ...props.title,
13
13
  children: title
14
14
  }),
15
- subtitle && /* @__PURE__ */ jsx("div", {
15
+ subtitle && jsx("div", {
16
16
  ...props.subtitle,
17
17
  children: subtitle
18
18
  }),
package/dist/remotion/dist/components/typing-text.d.ts CHANGED
@@ -2,7 +2,6 @@ import * as _$react from "react";
2
2
  import * as _$_uds_types0 from "@uds/types";
3
3
 
4
4
  //#region ../remotion/dist/components/typing-text.d.ts
5
- //#region src/components/typing-text.d.ts
6
5
  /**
7
6
  * @description Typing text animation that reveals characters frame by frame
8
7
  */
@@ -16,6 +15,6 @@ declare const TypingText: _$react.FC<_$_uds_types0.CreateComponentProps<string,
16
15
  root: "div";
17
16
  text: "div";
18
17
  cursor: "div";
19
- }>>; //#endregion
18
+ }>>;
20
19
  //#endregion
21
20
  export { TypingText };
package/dist/remotion/dist/components/typing-text.js CHANGED
@@ -11,11 +11,11 @@ const TypingText = createComponent(({ props, text, speed = 1, delay = 0, frame,
11
11
  const charsToShow = isAnimating ? Math.min(Math.floor(effectiveFrame * speed), text.length) : text.length;
12
12
  const visibleText = text.slice(0, charsToShow);
13
13
  const showCursor = isAnimating && charsToShow < text.length;
14
- return /* @__PURE__ */ jsxs("div", {
14
+ return jsxs("div", {
15
15
  ...props.root,
16
- children: [/* @__PURE__ */ jsxs("div", {
16
+ children: [jsxs("div", {
17
17
  ...props.text,
18
- children: [visibleText, showCursor && /* @__PURE__ */ jsx("span", { ...props.cursor })]
18
+ children: [visibleText, showCursor && jsx("span", { ...props.cursor })]
19
19
  }), children]
20
20
  });
21
21
  });