fontdue-js 2.22.4 → 3.0.0-alpha2

package/dist/components/TypeTester/TypeTesterFitter.js

@@ -1,22 +1,14 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _useTypeTesterStyler = _interopRequireDefault(require("./useTypeTesterStyler"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import React from 'react';
+import useTypeTesterStyler from './useTypeTesterStyler.js';
 const TypeTesterFitter = _ref => {
   let {
     children,
     ...props
   } = _ref;
-  const style = (0, _useTypeTesterStyler.default)(props);
-  return /*#__PURE__*/_react.default.createElement("div", _extends({
+  const style = useTypeTesterStyler(props);
+  return /*#__PURE__*/React.createElement("div", _extends({
     className: "type-tester__text__container"
   }, style), children);
 };
-var _default = TypeTesterFitter;
-exports.default = _default;
+export default TypeTesterFitter;

package/dist/components/TypeTester/TypeTesterFloatingToolbar.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { TypeTesterFloatingToolbar_testers$key } from '__generated__/TypeTesterFloatingToolbar_testers.graphql';
+import { TypeTesterFloatingToolbar_testers$key } from '__generated__/TypeTesterFloatingToolbar_testers.graphql.js';
 interface TypeTesterFloatingToolbar_props {
     testers: TypeTesterFloatingToolbar_testers$key;
     features?: ReadonlyArray<string> | null;

package/dist/components/TypeTester/TypeTesterFloatingToolbar.js

@@ -1,20 +1,11 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = TypeTesterFloatingToolbar;
-var _TypeTesterFloatingToolbar_testers2 = _interopRequireDefault(require("../../__generated__/TypeTesterFloatingToolbar_testers.graphql"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactRelay = require("react-relay");
-var _TypeTesterContext = require("./TypeTesterContext");
-var _TypeTesterFeatures = _interopRequireDefault(require("./TypeTesterFeatures"));
-var _TypeTesterToolbar = _interopRequireDefault(require("./TypeTesterToolbar"));
-var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function TypeTesterFloatingToolbar(_ref) {
+import _TypeTesterFloatingToolbar_testers from "../../__generated__/TypeTesterFloatingToolbar_testers.graphql.js";
+import React, { useContext, useEffect, useState } from 'react';
+import { graphql, useFragment } from 'react-relay';
+import { TypeTesterContext } from './TypeTesterContext.js';
+import TypeTesterFeatures from './TypeTesterFeatures.js';
+import TypeTesterToolbar from './TypeTesterToolbar.js';
+import ConfigContext from '../ConfigContext.js';
+export default function TypeTesterFloatingToolbar(_ref) {
   var _testersData$find;
   let {
     testers: testersKey,
@@ -22,24 +13,24 @@ function TypeTesterFloatingToolbar(_ref) {
     axes,
     onToolbarOpenClose
   } = _ref;
-  const testersData = (0, _reactRelay.useFragment)((_TypeTesterFloatingToolbar_testers2.default.hash && _TypeTesterFloatingToolbar_testers2.default.hash !== "5f037fca9e02cba8c202f17e08ff8db6" && console.error("The definition of 'TypeTesterFloatingToolbar_testers' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTesterFloatingToolbar_testers2.default), testersKey);
+  const testersData = useFragment((_TypeTesterFloatingToolbar_testers.hash && _TypeTesterFloatingToolbar_testers.hash !== "5f037fca9e02cba8c202f17e08ff8db6" && console.error("The definition of 'TypeTesterFloatingToolbar_testers' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTesterFloatingToolbar_testers), testersKey);
   const {
     testers
-  } = (0, _react.useContext)(_TypeTesterContext.TypeTesterContext);
+  } = useContext(TypeTesterContext);
   const id = Object.keys(testers).find(id => testers[id].focused);
-  const [open, setOpen] = (0, _react.useState)(false);
+  const [open, setOpen] = useState(false);
 
   // when focus is lost, we lose the latest id, but we don't want to immediately
   // un-render the toolbar for that id because there's a transition to hide the
   // toolbar. so this keeps the tools rendered with the last non-null id
-  const [activeId, setActiveId] = (0, _react.useState)(id);
-  (0, _react.useEffect)(() => {
+  const [activeId, setActiveId] = useState(id);
+  useEffect(() => {
     if (id) {
       setActiveId(id);
       setOpen(true); // always open if we get a new id
     }
   }, [id]);
-  (0, _react.useEffect)(() => {
+  useEffect(() => {
     let observer = new IntersectionObserver(entries => {
       const entry = entries[0];
       if (!entry.isIntersecting) {
@@ -55,25 +46,25 @@ function TypeTesterFloatingToolbar(_ref) {
       observer.disconnect();
     };
   }, [activeId]);
-  (0, _react.useEffect)(() => {
+  useEffect(() => {
     onToolbarOpenClose === null || onToolbarOpenClose === void 0 ? void 0 : onToolbarOpenClose(open);
   }, [onToolbarOpenClose, open]);
   const {
     typeTester: config
-  } = (0, _react.useContext)(_ConfigContext.default);
+  } = useContext(ConfigContext);
   const fontStyle = (_testersData$find = testersData.find(tester => tester.id === activeId)) === null || _testersData$find === void 0 ? void 0 : _testersData$find.fontStyle;
   const axesPosition = config.variableAxesPosition === 'auto' ? ((axes === null || axes === void 0 ? void 0 : axes.length) ?? 0) > 1 ? 'features-panel' : 'inline' : config.variableAxesPosition;
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     className: "type-tester__floating-toolbar",
     onMouseDown: e => e.preventDefault(),
     "data-open": activeId && open
-  }, activeId && fontStyle && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_TypeTesterToolbar.default, {
+  }, activeId && fontStyle && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TypeTesterToolbar, {
     id: activeId,
     features: features,
     axes: axes,
     axesPosition: axesPosition,
     fontStyle: fontStyle
-  }), features && /*#__PURE__*/_react.default.createElement(_TypeTesterFeatures.default, {
+  }), features && /*#__PURE__*/React.createElement(TypeTesterFeatures, {
     id: activeId,
     features: features,
     axes: axes,

package/dist/components/TypeTester/TypeTesterInput.js

@@ -1,13 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.TypeTesterInput = void 0;
-var _react = _interopRequireWildcard(require("react"));
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-const TypeTesterInput = _ref => {
+import React, { useCallback, useEffect, useState } from 'react';
+export const TypeTesterInput = _ref => {
   let {
     value,
     onChange,
@@ -15,12 +7,12 @@ const TypeTesterInput = _ref => {
     max,
     setFocused
   } = _ref;
-  const [localValue, setLocalValue] = (0, _react.useState)(value);
-  const [isError, setIsError] = (0, _react.useState)(false);
-  (0, _react.useEffect)(() => {
+  const [localValue, setLocalValue] = useState(value);
+  const [isError, setIsError] = useState(false);
+  useEffect(() => {
     setLocalValue(Math.round(value));
   }, [value]);
-  const propagateValue = (0, _react.useCallback)(() => {
+  const propagateValue = useCallback(() => {
     if (localValue && localValue >= min && localValue <= max) {
       setIsError(false);
       onChange(localValue);
@@ -28,7 +20,7 @@ const TypeTesterInput = _ref => {
       setIsError(true);
     }
   }, [localValue, onChange, setIsError]);
-  const handleChange = (0, _react.useCallback)(e => {
+  const handleChange = useCallback(e => {
     if (e.target.value === '') {
       return setLocalValue(null);
     }
@@ -37,7 +29,7 @@ const TypeTesterInput = _ref => {
       setLocalValue(parsed);
     }
   }, []);
-  const handleKeyDown = (0, _react.useCallback)(e => {
+  const handleKeyDown = useCallback(e => {
     if (e.key === 'Enter') propagateValue();
     if (localValue) {
       const distance = e.shiftKey ? 10 : 1;
@@ -51,11 +43,11 @@ const TypeTesterInput = _ref => {
       }
     }
   }, [propagateValue, localValue]);
-  return /*#__PURE__*/_react.default.createElement("label", {
+  return /*#__PURE__*/React.createElement("label", {
     className: "type-tester__toolbar__label",
     "data-label": "size-input",
     "data-is-error": isError
-  }, /*#__PURE__*/_react.default.createElement("input", {
+  }, /*#__PURE__*/React.createElement("input", {
     className: "type-tester__toolbar__input",
     type: "text",
     style: {
@@ -66,8 +58,6 @@ const TypeTesterInput = _ref => {
     onKeyDown: handleKeyDown,
     onFocus: () => setFocused(true),
     onBlur: () => setFocused(false)
-  }), /*#__PURE__*/_react.default.createElement("span", null, "px"));
+  }), /*#__PURE__*/React.createElement("span", null, "px"));
 };
-exports.TypeTesterInput = TypeTesterInput;
-var _default = TypeTesterInput;
-exports.default = _default;
+export default TypeTesterInput;

package/dist/components/TypeTester/TypeTesterSlider.js

@@ -1,14 +1,6 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _reactRanger = require("../../react-ranger");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import React, { useCallback } from 'react';
+import { useRanger } from '../../react-ranger.js';
 const logInterpolator = {
   getPercentageForValue: (val, min, max) => {
     const minSign = Math.sign(min);
@@ -44,11 +36,11 @@ const TypeTesterSlider = _ref => {
     onChange,
     interpolator
   } = _ref;
-  const handleChange = (0, _react.useCallback)(values => onChange(values[0]), [onChange]);
+  const handleChange = useCallback(values => onChange(values[0]), [onChange]);
   const {
     getTrackProps,
     handles
-  } = (0, _reactRanger.useRanger)({
+  } = useRanger({
     min,
     max,
     stepSize,
@@ -57,7 +49,7 @@ const TypeTesterSlider = _ref => {
     onDrag: handleChange,
     interpolator: interpolator === 'log10' ? logInterpolator : undefined
   });
-  return /*#__PURE__*/_react.default.createElement("div", getTrackProps({
+  return /*#__PURE__*/React.createElement("div", getTrackProps({
     className: 'type-tester__slider__track'
   }), handles.map((_ref2, index) => {
     let {
@@ -69,10 +61,9 @@ const TypeTesterSlider = _ref => {
     } = getHandleProps({
       className: 'type-tester__slider__handle'
     });
-    return /*#__PURE__*/_react.default.createElement("button", _extends({
+    return /*#__PURE__*/React.createElement("button", _extends({
       key: key ?? index
     }, handleProps));
   }));
 };
-var _default = TypeTesterSlider;
-exports.default = _default;
+export default TypeTesterSlider;

package/dist/components/TypeTester/TypeTesterStandalone.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { Alignment, Direction, FeaturesProp } from './types';
-import { SerializablePreloadedQuery } from '../../relay/loadSerializableQuery';
-import { TypeTesterStandaloneQuery } from '__generated__/TypeTesterStandaloneQuery.graphql';
+import { Alignment, Direction, FeaturesProp } from './types.js';
+import { LoadSerializableQueryOptions, SerializablePreloadedQuery } from '../../relay/loadSerializableQuery.js';
+import { TypeTesterStandaloneQuery } from '../../__generated__/TypeTesterStandaloneQuery.graphql.js';
 interface TypeTesterStandaloneComponent_props {
     lineHeight?: number | null;
     letterSpacing?: number | null;
@@ -24,12 +24,26 @@ interface TypeTesterStandaloneComponent_props {
     onFocus?: () => void;
     onBlur?: () => void;
 }
-export interface TypeTesterStandalone_props extends TypeTesterStandaloneComponent_props {
+export type TypeTesterPreloadedQuery = SerializablePreloadedQuery<TypeTesterStandaloneQuery>;
+export interface LoadTypeTesterQueryVariables {
     familyName: string;
     styleName: string;
+    selectable?: boolean;
 }
+export declare function loadTypeTesterQuery(variables: LoadTypeTesterQueryVariables, options?: LoadSerializableQueryOptions): Promise<TypeTesterPreloadedQuery>;
 export declare function TypeTesterStandalonePreloadedQueryRenderer({ preloadedQuery, ...rest }: TypeTesterStandaloneComponent_props & {
-    preloadedQuery: SerializablePreloadedQuery<TypeTesterStandaloneQuery>;
+    preloadedQuery: TypeTesterPreloadedQuery;
 }): React.JSX.Element;
-export default function TypeTesterStandalone({ familyName, styleName, ...rest }: TypeTesterStandalone_props): React.JSX.Element;
+export type TypeTesterStandalone_props = TypeTesterStandaloneComponent_props & ({
+    preloadedQuery: TypeTesterPreloadedQuery;
+    familyName?: never;
+    styleName?: never;
+    selectable?: never;
+} | {
+    preloadedQuery?: never;
+    familyName: string;
+    styleName: string;
+    selectable?: boolean;
+});
+export default function TypeTesterStandalone(props: TypeTesterStandalone_props): React.JSX.Element;
 export {};

package/dist/components/TypeTester/TypeTesterStandalone.js

@@ -1,26 +1,20 @@
-"use strict";
 'use client';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TypeTesterStandalonePreloadedQueryRenderer = TypeTesterStandalonePreloadedQueryRenderer;
-exports.default = TypeTesterStandalone;
-var _TypeTesterStandaloneQuery2 = _interopRequireDefault(require("../../__generated__/TypeTesterStandaloneQuery.graphql"));
-var _TypeTesterStandaloneChangedStylesQuery2 = _interopRequireDefault(require("../../__generated__/TypeTesterStandaloneChangedStylesQuery.graphql"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactRelay = require("react-relay");
-var _index = _interopRequireDefault(require("./index"));
-var _TypeTesterContext = _interopRequireDefault(require("./TypeTesterContext"));
-var _types = require("./types");
-var _useSerializablePreloadedQuery = _interopRequireDefault(require("../../relay/useSerializablePreloadedQuery"));
-var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
-var _useLicenseAndOrderVariables = require("../../hooks/useLicenseAndOrderVariables");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-const changedStylesQuery = (_TypeTesterStandaloneChangedStylesQuery2.default.hash && _TypeTesterStandaloneChangedStylesQuery2.default.hash !== "98374227c6b2c3eceab5b48138e1a662" && console.error("The definition of 'TypeTesterStandaloneChangedStylesQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTesterStandaloneChangedStylesQuery2.default);
+import _TypeTesterStandaloneQuery from "../../__generated__/TypeTesterStandaloneQuery.graphql.js";
+import _TypeTesterStandaloneChangedStylesQuery from "../../__generated__/TypeTesterStandaloneChangedStylesQuery.graphql.js";
+import React, { useCallback, useContext, useState } from 'react';
+import { fetchQuery, graphql, useLazyLoadQuery, usePreloadedQuery, useRelayEnvironment } from 'react-relay';
+import TypeTester from './index.js';
+import TypeTesterContextComponent from './TypeTesterContext.js';
+import { normalizeFeaturesProp } from './types.js';
+import loadSerializableQuery from '../../relay/loadSerializableQuery.js';
+import useSerializablePreloadedQuery from '../../relay/useSerializablePreloadedQuery.js';
+import TypeTesterStandaloneQueryNode from '../../__generated__/TypeTesterStandaloneQuery.graphql.js';
+import ConfigContext from '../ConfigContext.js';
+import { EnsureFontdueContext } from '../FontdueContextProvider/index.js';
+import { useLicenseAndOrderVariables } from '../../hooks/useLicenseAndOrderVariables.js';
+const changedStylesQuery = (_TypeTesterStandaloneChangedStylesQuery.hash && _TypeTesterStandaloneChangedStylesQuery.hash !== "98374227c6b2c3eceab5b48138e1a662" && console.error("The definition of 'TypeTesterStandaloneChangedStylesQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTesterStandaloneChangedStylesQuery);
 function TypeTesterStandaloneComponent(_ref) {
   var _data$viewer, _data$viewer2, _data$viewer2$fontSty, _data$viewer2$fontSty2, _data$viewer2$fontSty3, _data$viewer3, _data$viewer3$fontSty, _data$viewer3$fontSty2;
   let {
@@ -42,18 +36,18 @@ function TypeTesterStandaloneComponent(_ref) {
   } = _ref;
   const {
     typeTester: config
-  } = (0, _react.useContext)(_ConfigContext.default);
+  } = useContext(ConfigContext);
   let defaultAlignment = config.initialAlignment;
   if (direction === 'rtl') defaultAlignment = 'right';
-  const environment = (0, _reactRelay.useRelayEnvironment)();
-  const [changedStyle, setChangedStyle] = (0, _react.useState)('');
-  const [changedStylesFetchKey, setChangedStylesFetchKey] = (0, _react.useState)(0);
+  const environment = useRelayEnvironment();
+  const [changedStyle, setChangedStyle] = useState('');
+  const [changedStylesFetchKey, setChangedStylesFetchKey] = useState(0);
   const {
     licenseOptionsSpecs,
     orderVariableSelections
-  } = (0, _useLicenseAndOrderVariables.useLicenseAndOrderVariables)();
-  const handleStyleSelect = (0, _react.useCallback)(fontStyleId => {
-    (0, _reactRelay.fetchQuery)(environment, changedStylesQuery, {
+  } = useLicenseAndOrderVariables();
+  const handleStyleSelect = useCallback(fontStyleId => {
+    fetchQuery(environment, changedStylesQuery, {
       id: fontStyleId,
       licenseOptions: licenseOptionsSpecs,
       orderVariables: orderVariableSelections
@@ -64,7 +58,7 @@ function TypeTesterStandaloneComponent(_ref) {
       }
     });
   }, [environment, changedStyle, licenseOptionsSpecs, orderVariableSelections]);
-  const changedStylesData = (0, _reactRelay.useLazyLoadQuery)(changedStylesQuery, {
+  const changedStylesData = useLazyLoadQuery(changedStylesQuery, {
     id: changedStyle,
     licenseOptions: licenseOptionsSpecs,
     orderVariables: orderVariableSelections
@@ -72,7 +66,7 @@ function TypeTesterStandaloneComponent(_ref) {
     fetchKey: changedStylesFetchKey,
     fetchPolicy: 'store-only'
   });
-  return /*#__PURE__*/_react.default.createElement(_TypeTesterContext.default, {
+  return /*#__PURE__*/React.createElement(TypeTesterContextComponent, {
     testers: {
       standalone: {
         content: content ?? 'The quick brown fox...',
@@ -93,51 +87,67 @@ function TypeTesterStandaloneComponent(_ref) {
         direction: direction ?? 'ltr'
       }
     }
-  }, /*#__PURE__*/_react.default.createElement(_index.default, {
+  }, /*#__PURE__*/React.createElement(TypeTester, {
     id: "standalone",
     viewer: data.viewer,
     fontStyle: changedStyle ? changedStylesData.node : (_data$viewer = data.viewer) === null || _data$viewer === void 0 ? void 0 : _data$viewer.fontStyle,
     onStyleSelect: handleStyleSelect,
     axes: axes,
-    features: (0, _types.normalizeFeaturesProp)(features),
+    features: normalizeFeaturesProp(features),
     productId: ((_data$viewer2 = data.viewer) === null || _data$viewer2 === void 0 ? void 0 : (_data$viewer2$fontSty = _data$viewer2.fontStyle) === null || _data$viewer2$fontSty === void 0 ? void 0 : (_data$viewer2$fontSty2 = _data$viewer2$fontSty.family) === null || _data$viewer2$fontSty2 === void 0 ? void 0 : (_data$viewer2$fontSty3 = _data$viewer2$fontSty2.parent) === null || _data$viewer2$fontSty3 === void 0 ? void 0 : _data$viewer2$fontSty3.id) ?? ((_data$viewer3 = data.viewer) === null || _data$viewer3 === void 0 ? void 0 : (_data$viewer3$fontSty = _data$viewer3.fontStyle) === null || _data$viewer3$fontSty === void 0 ? void 0 : (_data$viewer3$fontSty2 = _data$viewer3$fontSty.family) === null || _data$viewer3$fontSty2 === void 0 ? void 0 : _data$viewer3$fontSty2.id),
     groupEdit: false,
     onFocus: onFocus,
     onBlur: onBlur
   }));
 }
-const query = (_TypeTesterStandaloneQuery2.default.hash && _TypeTesterStandaloneQuery2.default.hash !== "57916b8e26a166271a80c5df1b3f68ec" && console.error("The definition of 'TypeTesterStandaloneQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTesterStandaloneQuery2.default);
-function TypeTesterStandalonePreloadedQueryRenderer(_ref3) {
+const query = (_TypeTesterStandaloneQuery.hash && _TypeTesterStandaloneQuery.hash !== "57916b8e26a166271a80c5df1b3f68ec" && console.error("The definition of 'TypeTesterStandaloneQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTesterStandaloneQuery);
+export async function loadTypeTesterQuery(variables, options) {
+  return loadSerializableQuery(TypeTesterStandaloneQueryNode, {
+    familyName: variables.familyName,
+    styleName: variables.styleName,
+    selectable: variables.selectable ?? true
+  }, options);
+}
+export function TypeTesterStandalonePreloadedQueryRenderer(_ref3) {
   let {
     preloadedQuery,
     ...rest
   } = _ref3;
-  const queryRef = (0, _useSerializablePreloadedQuery.default)(preloadedQuery);
-  const data = (0, _reactRelay.usePreloadedQuery)(query, queryRef);
-  return /*#__PURE__*/_react.default.createElement(TypeTesterStandaloneComponent, _extends({
+  const queryRef = useSerializablePreloadedQuery(preloadedQuery, 'store-or-network', query);
+  const data = usePreloadedQuery(query, queryRef);
+  return /*#__PURE__*/React.createElement(TypeTesterStandaloneComponent, _extends({
     data: data
   }, rest));
 }
-function TypeTesterStandalone(_ref4) {
+function TypeTesterStandaloneLazyQueryRenderer(_ref4) {
   var _data$viewer4;
   let {
     familyName,
     styleName,
+    selectable,
     ...rest
   } = _ref4;
   const {
     typeTester: config
-  } = (0, _react.useContext)(_ConfigContext.default);
-  const data = (0, _reactRelay.useLazyLoadQuery)(query, {
+  } = useContext(ConfigContext);
+  const data = useLazyLoadQuery(query, {
     familyName,
     styleName,
-    selectable: config.selectable
+    selectable: selectable ?? config.selectable
   });
   const fontStyle = (_data$viewer4 = data.viewer) === null || _data$viewer4 === void 0 ? void 0 : _data$viewer4.fontStyle;
   if (!fontStyle) {
     console.log(`[TypeTester]: No FontStyle found for {familyName: "${familyName}", styleName: "${styleName}"}`);
   }
-  return /*#__PURE__*/_react.default.createElement(TypeTesterStandaloneComponent, _extends({
+  return /*#__PURE__*/React.createElement(TypeTesterStandaloneComponent, _extends({
     data: data
   }, rest));
+}
+// Unified TypeTester entry point. Accepts either a preloaded query (server-side
+// preload path, used by Astro/Vike/etc.) or `{familyName, styleName}` (lazy
+// path, used inside an existing `<FontdueProvider>` tree like Next layouts).
+// `EnsureFontdueContext` only self-wraps with `FontdueContextProvider` when
+// no parent Fontdue context is present.
+export default function TypeTesterStandalone(props) {
+  return /*#__PURE__*/React.createElement(EnsureFontdueContext, null, 'preloadedQuery' in props && props.preloadedQuery ? /*#__PURE__*/React.createElement(TypeTesterStandalonePreloadedQueryRenderer, props) : /*#__PURE__*/React.createElement(TypeTesterStandaloneLazyQueryRenderer, props));
 }

package/dist/components/TypeTester/TypeTesterStandalone.preload.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
-import { LoadSerializableQueryOptions, SerializablePreloadedQuery } from '../../relay/loadSerializableQuery';
-import { TypeTesterStandaloneQuery } from '../../__generated__/TypeTesterStandaloneQuery.graphql';
-import { TypeTesterStandalonePreloadedQueryRenderer } from './TypeTesterStandalone';
+import { LoadSerializableQueryOptions, SerializablePreloadedQuery } from '../../relay/loadSerializableQuery.js';
+import { TypeTesterStandaloneQuery } from '../../__generated__/TypeTesterStandaloneQuery.graphql.js';
+import { TypeTesterStandalonePreloadedQueryRenderer } from './TypeTesterStandalone.js';
 export type TypeTesterPreloadedQuery = SerializablePreloadedQuery<TypeTesterStandaloneQuery>;
 export interface LoadTypeTesterQueryVariables {
     familyName: string;

package/dist/components/TypeTester/TypeTesterStandalone.preload.js

@@ -1,8 +1,8 @@
 import React from 'react';
-import loadSerializableQuery from '../../relay/loadSerializableQuery';
-import TypeTesterStandaloneQueryNode from '../../__generated__/TypeTesterStandaloneQuery.graphql';
-import FontdueProvider from '../FontdueProvider';
-import { TypeTesterStandalonePreloadedQueryRenderer } from './TypeTesterStandalone';
+import loadSerializableQuery from '../../relay/loadSerializableQuery.js';
+import TypeTesterStandaloneQueryNode from '../../__generated__/TypeTesterStandaloneQuery.graphql.js';
+import FontdueContextProvider from '../FontdueContextProvider/index.js';
+import { TypeTesterStandalonePreloadedQueryRenderer } from './TypeTesterStandalone.js';
 export async function loadTypeTesterQuery(variables, options) {
   return loadSerializableQuery(TypeTesterStandaloneQueryNode, {
     familyName: variables.familyName,
@@ -10,10 +10,11 @@ export async function loadTypeTesterQuery(variables, options) {
     selectable: variables.selectable ?? true
   }, options);
 }
-// Self-wraps with FontdueProvider so consumers don't need to. The provider
-// state is a module-level singleton under the hood, so multiple
-// TypeTesterPreloaded (or other *Preloaded) components on a page all share
-// one Relay env + Redux store + auxiliary UI.
+// Self-wraps with FontdueContextProvider so consumers don't need to wire up
+// Relay env / Redux store / contexts at the call site. Aux UI (theme,
+// test-mode banner, consent, tracking) is NOT rendered here — that belongs
+// to a single layout-level `<FontdueProvider>` per page. State is shared
+// across multiple preloaded components on a page via module-level singletons.
 export function TypeTesterPreloaded(props) {
-  return /*#__PURE__*/React.createElement(FontdueProvider, null, /*#__PURE__*/React.createElement(TypeTesterStandalonePreloadedQueryRenderer, props));
+  return /*#__PURE__*/React.createElement(FontdueContextProvider, null, /*#__PURE__*/React.createElement(TypeTesterStandalonePreloadedQueryRenderer, props));
 }

package/dist/components/TypeTester/TypeTesterStandalone.server.d.ts

@@ -1,3 +1,5 @@
 import React from 'react';
-import { TypeTesterStandalone_props } from './TypeTesterStandalone';
-export default function TypeTesterStandalone({ familyName, styleName, ...rest }: TypeTesterStandalone_props): Promise<React.JSX.Element>;
+import type { TypeTesterStandalone_props } from './TypeTesterStandalone.js';
+export default function TypeTesterStandalone(props: Extract<TypeTesterStandalone_props, {
+    familyName: string;
+}>): Promise<React.JSX.Element>;

package/dist/components/TypeTester/TypeTesterStandalone.server.js

@@ -1,27 +1,27 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = TypeTesterStandalone;
-var _react = _interopRequireDefault(require("react"));
-var _loadSerializableQuery = _interopRequireDefault(require("../../relay/loadSerializableQuery"));
-var _TypeTesterStandalone = require("./TypeTesterStandalone");
-var _TypeTesterStandaloneQuery = _interopRequireDefault(require("../../__generated__/TypeTesterStandaloneQuery.graphql"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-async function TypeTesterStandalone(_ref) {
-  let {
+import React from 'react';
+import loadSerializableQuery from '../../relay/loadSerializableQuery.js';
+import { TypeTesterStandalonePreloadedQueryRenderer } from './TypeTesterStandalone.js';
+import TypeTesterStandaloneQueryNode from '../../__generated__/TypeTesterStandaloneQuery.graphql.js';
+
+// Next RSC variant: awaits the query on the server and hands the response to
+// the client `TypeTesterStandalonePreloadedQueryRenderer`. Lets pages just
+// write `<TypeTester familyName="..." styleName="..." />` in an RSC without
+// manually invoking `loadTypeTesterQuery` + threading `preloadedQuery`
+// through props.
+export default async function TypeTesterStandalone(props) {
+  const {
     familyName,
     styleName,
+    selectable,
     ...rest
-  } = _ref;
-  const preloadedQuery = await (0, _loadSerializableQuery.default)(_TypeTesterStandaloneQuery.default, {
+  } = props;
+  const preloadedQuery = await loadSerializableQuery(TypeTesterStandaloneQueryNode, {
     familyName,
     styleName,
-    selectable: true
+    selectable: selectable ?? true
   });
-  return /*#__PURE__*/_react.default.createElement(_TypeTesterStandalone.TypeTesterStandalonePreloadedQueryRenderer, _extends({
+  return /*#__PURE__*/React.createElement(TypeTesterStandalonePreloadedQueryRenderer, _extends({
     preloadedQuery: preloadedQuery
   }, rest));
 }

package/dist/components/TypeTester/TypeTesterStandaloneElement.js

@@ -1,14 +1,7 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.TypeTesterStandaloneElement = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _TypeTesterStandalone = _interopRequireDefault(require("./TypeTesterStandalone"));
-var _utils = require("../../utils");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+import React from 'react';
+import TypeTesterStandalone from './TypeTesterStandalone.js';
+import { notEmpty } from '../../utils.js';
 const isAlignment = str => {
   return str === 'left' || str === 'center' || str === 'right';
 };
@@ -31,9 +24,9 @@ function parseVariableSettings(input) {
     } else {
       console.warn(`fontdue-type-tester failed to parse variable-settings value: "${settingString}", ignoring`);
     }
-  }).filter(_utils.notEmpty);
+  }).filter(notEmpty);
 }
-const TypeTesterStandaloneElement = _ref => {
+export const TypeTesterStandaloneElement = _ref => {
   let {
     lineHeight,
     letterSpacing,
@@ -47,7 +40,7 @@ const TypeTesterStandaloneElement = _ref => {
     autofit,
     ...rest
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_TypeTesterStandalone.default, _extends({
+  return /*#__PURE__*/React.createElement(TypeTesterStandalone, _extends({
     autofit: parseBool(autofit),
     lineHeight: lineHeight ? parseFloat(lineHeight) : undefined,
     letterSpacing: letterSpacing ? parseFloat(letterSpacing) : undefined,
@@ -63,6 +56,4 @@ const TypeTesterStandaloneElement = _ref => {
     variableSettings: parseVariableSettings(variableSettings)
   }, rest));
 };
-exports.TypeTesterStandaloneElement = TypeTesterStandaloneElement;
-var _default = TypeTesterStandaloneElement;
-exports.default = _default;
+export default TypeTesterStandaloneElement;

package/dist/components/TypeTester/TypeTesterState.d.ts

@@ -1,5 +1,5 @@
-import { Content, Size, LineHeight, Alignment, Direction } from './types';
-import { VariableSettings } from '../../utils';
+import { Content, Size, LineHeight, Alignment, Direction } from './types.js';
+import { VariableSettings } from '../../utils.js';
 interface TypeTesterStateProps {
     id: string;
 }