fontdue-js 2.22.4 → 3.0.0-alpha2

package/dist/components/TypeTester/index.js

@@ -1,29 +1,20 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _TypeTester_viewer2 = _interopRequireDefault(require("../../__generated__/TypeTester_viewer.graphql"));
-var _TypeTester_fontStyle2 = _interopRequireDefault(require("../../__generated__/TypeTester_fontStyle.graphql"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactRelay = require("react-relay");
-var _reactRedux = require("react-redux");
-var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
-var _FontStyle = _interopRequireDefault(require("../FontStyle"));
-var _SKUPrice = _interopRequireDefault(require("../SKUPrice"));
-var _SelectButton = _interopRequireDefault(require("../SelectButton"));
-var _utils = require("../../utils");
-var _TypeTesterStyleSelectData = _interopRequireDefault(require("./TypeTesterStyleSelectData"));
-var _TypeTesterFeatures = _interopRequireDefault(require("./TypeTesterFeatures"));
-var _TypeTesterContent = _interopRequireDefault(require("./TypeTesterContent"));
-var _TypeTesterState = _interopRequireDefault(require("./TypeTesterState"));
-var _TypeTesterToolbar = _interopRequireDefault(require("./TypeTesterToolbar"));
-var _TypeTesterVariableAxes = _interopRequireDefault(require("./TypeTesterVariableAxes"));
-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); }
+import _TypeTester_viewer from "../../__generated__/TypeTester_viewer.graphql.js";
+import _TypeTester_fontStyle from "../../__generated__/TypeTester_fontStyle.graphql.js";
+import React, { Fragment, Suspense, useContext, useEffect, useRef, useState } from 'react';
+import { graphql, useFragment } from 'react-relay';
+import { useSelector } from 'react-redux';
+import ConfigContext from '../ConfigContext.js';
+import FontStyle from '../FontStyle/index.js';
+import SKUPrice from '../SKUPrice/index.js';
+import SelectButton from '../SelectButton/index.js';
+import { isSelected } from '../../utils.js';
+import TypeTesterStyleSelectData from './TypeTesterStyleSelectData.js';
+import TypeTesterFeatures from './TypeTesterFeatures.js';
+import TypeTesterContent from './TypeTesterContent.js';
+import useTypeTesterState from './TypeTesterState.js';
+import TypeTesterToolbar from './TypeTesterToolbar.js';
+import TypeTesterVariableAxes from './TypeTesterVariableAxes.js';
 const TypeTester = _ref => {
   let {
     id,
@@ -39,31 +30,31 @@ const TypeTester = _ref => {
     onStyleSelect,
     isLoading
   } = _ref;
-  const fontStyle = (0, _reactRelay.useFragment)((_TypeTester_fontStyle2.default.hash && _TypeTester_fontStyle2.default.hash !== "bf89a32c8a0661f2102bbcf8c6bd1aa7" && console.error("The definition of 'TypeTester_fontStyle' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTester_fontStyle2.default), fontStyleKey);
-  const viewer = (0, _reactRelay.useFragment)((_TypeTester_viewer2.default.hash && _TypeTester_viewer2.default.hash !== "26c2b3145462407675ab9b202b0d1b4c" && console.error("The definition of 'TypeTester_viewer' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTester_viewer2.default), viewerKey);
-  const contentRef = (0, _react.useRef)(null);
-  const ref = (0, _react.useRef)(null);
-  const [buyButtonIsHovered, setBuyButtonIsHovered] = (0, _react.useState)(false);
+  const fontStyle = useFragment((_TypeTester_fontStyle.hash && _TypeTester_fontStyle.hash !== "bf89a32c8a0661f2102bbcf8c6bd1aa7" && console.error("The definition of 'TypeTester_fontStyle' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTester_fontStyle), fontStyleKey);
+  const viewer = useFragment((_TypeTester_viewer.hash && _TypeTester_viewer.hash !== "26c2b3145462407675ab9b202b0d1b4c" && console.error("The definition of 'TypeTester_viewer' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTester_viewer), viewerKey);
+  const contentRef = useRef(null);
+  const ref = useRef(null);
+  const [buyButtonIsHovered, setBuyButtonIsHovered] = useState(false);
   let {
     typeTester: config
-  } = (0, _react.useContext)(_ConfigContext.default);
+  } = useContext(ConfigContext);
   const axesPosition = config.variableAxesPosition === 'auto' ? ((axes === null || axes === void 0 ? void 0 : axes.length) ?? 0) > 1 ? 'features-panel' : 'inline' : config.variableAxesPosition;
-  const props = (0, _TypeTesterState.default)({
+  const props = useTypeTesterState({
     id
   });
-  (0, _react.useEffect)(() => {
+  useEffect(() => {
     if (onFocus && props.focused) onFocus();
     if (onBlur && !props.focused) onBlur();
   }, [props.focused]);
-  const selected = (0, _reactRedux.useSelector)(fontStyle && fontStyle.sku ? (0, _utils.isSelected)(fontStyle.sku.id) : () => false);
-  const precartOpen = (0, _reactRedux.useSelector)(state => state.precartOpen);
+  const selected = useSelector(fontStyle && fontStyle.sku ? isSelected(fontStyle.sku.id) : () => false);
+  const precartOpen = useSelector(state => state.precartOpen);
   const sku = fontStyle === null || fontStyle === void 0 ? void 0 : fontStyle.sku;
   const onNeedsRefocus = () => {
     var _contentRef$current;
     (_contentRef$current = contentRef.current) === null || _contentRef$current === void 0 ? void 0 : _contentRef$current.focus();
   };
   if (!fontStyle) return null;
-  return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement("div", {
     className: "type-tester select-button-hover-parent",
     ref: ref,
     "data-type-tester-id": id,
@@ -78,13 +69,13 @@ const TypeTester = _ref => {
     "data-alignment": props.alignment,
     "data-loading": isLoading,
     "data-tags": tags === null || tags === void 0 ? void 0 : tags.join(' ')
-  }, axesPosition === 'above' ? /*#__PURE__*/_react.default.createElement(_TypeTesterVariableAxes.default, {
+  }, axesPosition === 'above' ? /*#__PURE__*/React.createElement(TypeTesterVariableAxes, {
     id: id,
     axes: axes,
     fontStyle: fontStyle
-  }) : null, /*#__PURE__*/_react.default.createElement("div", {
+  }) : null, /*#__PURE__*/React.createElement("div", {
     className: "type-tester__toolbar"
-  }, /*#__PURE__*/_react.default.createElement(_TypeTesterStyleSelectData.default, {
+  }, /*#__PURE__*/React.createElement(TypeTesterStyleSelectData, {
     fontStyle: fontStyle,
     variableSettings: props.variableSettings,
     viewer: viewer,
@@ -103,12 +94,12 @@ const TypeTester = _ref => {
     },
     config: config,
     includeVariableAxesOption: Boolean(axes === null || axes === void 0 ? void 0 : axes.length) && axesPosition === 'features-panel'
-  }), config.priceText && fontStyle.sku && /*#__PURE__*/_react.default.createElement("div", {
+  }), config.priceText && fontStyle.sku && /*#__PURE__*/React.createElement("div", {
     className: "type-tester__toolbar__price-text",
     onMouseDown: e => e.preventDefault()
-  }, /*#__PURE__*/_react.default.createElement(_SKUPrice.default, {
+  }, /*#__PURE__*/React.createElement(SKUPrice, {
     sku: fontStyle.sku
-  })), config.toolsPosition === 'inline' && /*#__PURE__*/_react.default.createElement(_TypeTesterToolbar.default, {
+  })), config.toolsPosition === 'inline' && /*#__PURE__*/React.createElement(TypeTesterToolbar, {
     id: id,
     features: features,
     axes: axes,
@@ -116,31 +107,31 @@ const TypeTester = _ref => {
     fontStyle: fontStyle,
     onNeedsRefocus: onNeedsRefocus,
     groupEdit: groupEdit
-  }), config.selectButton && sku && productId && /*#__PURE__*/_react.default.createElement("div", {
+  }), config.selectButton && sku && productId && /*#__PURE__*/React.createElement("div", {
     className: "type-tester__select-button-wrapper",
     onMouseDown: e => e.preventDefault()
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "type-tester__select-button"
-  }, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_SelectButton.default, {
+  }, /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(SelectButton, {
     productId: productId,
     sku: sku,
     onMouseEnter: () => setBuyButtonIsHovered(true),
     onMouseLeave: () => setBuyButtonIsHovered(false),
     className: "type-tester__select-button-element"
-  }), precartOpen && !selected && /*#__PURE__*/_react.default.createElement("div", {
+  }), precartOpen && !selected && /*#__PURE__*/React.createElement("div", {
     className: "type-tester__price"
-  }, /*#__PURE__*/_react.default.createElement(_react.Suspense, {
+  }, /*#__PURE__*/React.createElement(Suspense, {
     fallback: null
-  }, /*#__PURE__*/_react.default.createElement(_SKUPrice.default, {
+  }, /*#__PURE__*/React.createElement(SKUPrice, {
     sku: sku
-  }))))))), config.toolsPosition === 'inline' && (features || axes) && /*#__PURE__*/_react.default.createElement(_TypeTesterFeatures.default, {
+  }))))))), config.toolsPosition === 'inline' && (features || axes) && /*#__PURE__*/React.createElement(TypeTesterFeatures, {
     id: id,
     fontStyle: fontStyle,
     features: features ?? null,
     axes: axesPosition === 'features-panel' ? axes ?? null : null
-  }), /*#__PURE__*/_react.default.createElement("div", {
+  }), /*#__PURE__*/React.createElement("div", {
     className: "type-tester__text"
-  }, /*#__PURE__*/_react.default.createElement(_FontStyle.default, {
+  }, /*#__PURE__*/React.createElement(FontStyle, {
     fontStyle: fontStyle,
     className: "type-tester__text__font-style"
   }, _ref3 => {
@@ -149,7 +140,7 @@ const TypeTester = _ref => {
       style
     } = _ref3;
     if (loaded) {
-      return /*#__PURE__*/_react.default.createElement(_TypeTesterContent.default, _extends({}, props, {
+      return /*#__PURE__*/React.createElement(TypeTesterContent, _extends({}, props, {
         ref: contentRef,
         fontStyles: style,
         truncate: config.truncate,
@@ -160,7 +151,7 @@ const TypeTester = _ref => {
         columns: config.columns
       }));
     }
-    return /*#__PURE__*/_react.default.createElement("div", {
+    return /*#__PURE__*/React.createElement("div", {
       className: "type-tester__text__container",
       style: {
         fontSize: `${props.size}px`,
@@ -169,5 +160,4 @@ const TypeTester = _ref => {
     }, props.content.getCurrentContent().getPlainText());
   }))));
 };
-var _default = TypeTester;
-exports.default = _default;
+export default TypeTester;

package/dist/components/TypeTester/types.js

@@ -1,14 +1,6 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.normalizeFeaturesProp = void 0;
-// Public-API feature prop. Accepts an array of feature codes, or the literal
+import "../../global-shim.js"; // Public-API feature prop. Accepts an array of feature codes, or the literal
 // string '*' to expose every feature the font supports.
-
-const normalizeFeaturesProp = features => features === '*' ? ['*'] : features ?? null;
+export const normalizeFeaturesProp = features => features === '*' ? ['*'] : features ?? null;
 
 // controls whether the type tester editing should apply to all of the
-// testers within a group
-exports.normalizeFeaturesProp = normalizeFeaturesProp;
+// testers within a group

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

@@ -1,4 +1,4 @@
-import { useFeaturesData_fontStyle$key } from '__generated__/useFeaturesData_fontStyle.graphql';
+import { useFeaturesData_fontStyle$key } from '__generated__/useFeaturesData_fontStyle.graphql.js';
 interface useFeatures_props {
     fontStyle: useFeaturesData_fontStyle$key;
 }

package/dist/components/TypeTester/useFeaturesData.js

@@ -1,13 +1,6 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _useFeaturesData_fontStyle2 = _interopRequireDefault(require("../../__generated__/useFeaturesData_fontStyle.graphql"));
-var _reactRelay = require("react-relay");
-var _features = _interopRequireDefault(require("./features"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+import _useFeaturesData_fontStyle from "../../__generated__/useFeaturesData_fontStyle.graphql.js";
+import { graphql, useFragment } from 'react-relay';
+import featureNameData from './features.js';
 const getStylisticSetName = (feature, stylisticSetNames) => stylisticSetNames.find(_ref => {
   let {
     featureName
@@ -19,11 +12,11 @@ const useFeaturesData = _ref2 => {
   let {
     fontStyle
   } = _ref2;
-  const data = (0, _reactRelay.useFragment)((_useFeaturesData_fontStyle2.default.hash && _useFeaturesData_fontStyle2.default.hash !== "3c48a87b1b19f52e3dda10fc11f0030a" && console.error("The definition of 'useFeaturesData_fontStyle' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _useFeaturesData_fontStyle2.default), fontStyle);
+  const data = useFragment((_useFeaturesData_fontStyle.hash && _useFeaturesData_fontStyle.hash !== "3c48a87b1b19f52e3dda10fc11f0030a" && console.error("The definition of 'useFeaturesData_fontStyle' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _useFeaturesData_fontStyle), fontStyle);
   const featureNames = ((_data$fontFeatures = data.fontFeatures) === null || _data$fontFeatures === void 0 ? void 0 : _data$fontFeatures.supportedFeatures.reduce((acc, feature) => {
     let featureName = feature;
-    if (_features.default.hasOwnProperty(feature)) {
-      featureName = _features.default[feature];
+    if (featureNameData.hasOwnProperty(feature)) {
+      featureName = featureNameData[feature];
     }
     const stylisticSetName = getStylisticSetName(feature, data.fontFeatures.stylisticSetNames);
     if (stylisticSetName) {
@@ -37,5 +30,4 @@ const useFeaturesData = _ref2 => {
     featureNames
   };
 };
-var _default = useFeaturesData;
-exports.default = _default;
+export default useFeaturesData;

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

@@ -1,6 +1,6 @@
 import { EditorState } from 'draft-js';
-import { Alignment } from './types';
-import { VariableSettings } from '../../utils';
+import { Alignment } from './types.js';
+import { VariableSettings } from '../../utils.js';
 export type ColumnsConfig = false | {
     count: 'auto' | number;
     width: string;

package/dist/components/TypeTester/useTypeTesterStyler.js

@@ -1,12 +1,6 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = require("react");
-var _useAutofit = _interopRequireDefault(require("../../hooks/useAutofit"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+import "../../global-shim.js";
+import { useLayoutEffect } from 'react';
+import useAutofit from '../../hooks/useAutofit.js';
 const useTypeTesterStyler = _ref => {
   let {
     size,
@@ -34,7 +28,7 @@ const useTypeTesterStyler = _ref => {
   const {
     ref,
     fontSize: autofitSize
-  } = (0, _useAutofit.default)({
+  } = useAutofit({
     text,
     fontFamily: fontStyles.fontFamily,
     fontSize: size,
@@ -50,7 +44,7 @@ const useTypeTesterStyler = _ref => {
 
   // When autofit calculates a new size, push it into the shared state
   // before the browser paints to avoid a flash of wrapped text.
-  (0, _react.useLayoutEffect)(() => {
+  useLayoutEffect(() => {
     if (autofit && autofitSize !== size) {
       setSize(autofitSize, {
         auto: true
@@ -80,5 +74,4 @@ const useTypeTesterStyler = _ref => {
     style
   };
 };
-var _default = useTypeTesterStyler;
-exports.default = _default;
+export default useTypeTesterStyler;

package/dist/components/TypeTesters/TypeTestersElement.js

@@ -1,13 +1,6 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _index = _interopRequireDefault(require("./index"));
-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 TypeTesters from './index.js';
 const getDefaultMode = (stringValue, autofit) => {
   if (autofit) return 'local';
   if (stringValue === 'group') return 'group';
@@ -22,7 +15,7 @@ function TypeTestersElement(_ref) {
     features,
     ...rest
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_index.default, _extends({
+  return /*#__PURE__*/React.createElement(TypeTesters, _extends({
     tags: tags === null || tags === void 0 ? void 0 : tags.split(','),
     excludeTags: excludeTags === null || excludeTags === void 0 ? void 0 : excludeTags.split(','),
     autofit: autofit ? autofit === 'true' : undefined,
@@ -30,5 +23,4 @@ function TypeTestersElement(_ref) {
     features: features === null || features === void 0 ? void 0 : features.split(',')
   }, rest));
 }
-var _default = TypeTestersElement;
-exports.default = _default;
+export default TypeTestersElement;

package/dist/components/TypeTesters/index.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
-import { TypeTestersIDQuery } from '../../__generated__/TypeTestersIDQuery.graphql';
-import { TypeTestersSlugQuery } from '../../__generated__/TypeTestersSlugQuery.graphql';
-import { FeaturesProp } from '../TypeTester/types';
-import { SerializablePreloadedQuery } from '../../relay/loadSerializableQuery';
+import { TypeTestersIDQuery } from '../../__generated__/TypeTestersIDQuery.graphql.js';
+import { TypeTestersSlugQuery } from '../../__generated__/TypeTestersSlugQuery.graphql.js';
+import { FeaturesProp } from '../TypeTester/types.js';
+import { LoadSerializableQueryOptions, SerializablePreloadedQuery } from '../../relay/loadSerializableQuery.js';
 export interface TypeTesters_props {
     collectionId?: string;
     collectionSlug?: string;
@@ -21,4 +21,20 @@ export declare function TypeTestersPreloadedIDQueryRenderer({ preloadedQuery, ..
 export declare function TypeTestersPreloadedSlugQueryRenderer({ preloadedQuery, ...rest }: TypeTesters_props & {
     preloadedQuery: SerializablePreloadedQuery<TypeTestersSlugQuery>;
 }): React.JSX.Element;
-export default function TypeTesters({ collectionId, collectionSlug, ...rest }: TypeTesters_props): React.JSX.Element | null;
+export type TypeTestersPreloadedQuery = SerializablePreloadedQuery<TypeTestersIDQuery> | SerializablePreloadedQuery<TypeTestersSlugQuery>;
+export type LoadTypeTestersQueryVariables = ({
+    collectionId: string;
+    collectionSlug?: never;
+} | {
+    collectionId?: never;
+    collectionSlug: string;
+}) & {
+    tags?: string[] | null;
+    excludeTags?: string[] | null;
+    selectable?: boolean;
+};
+export declare function loadTypeTestersQuery(variables: LoadTypeTestersQueryVariables, options?: LoadSerializableQueryOptions): Promise<TypeTestersPreloadedQuery>;
+export type TypeTesters_unifiedProps = TypeTesters_props & {
+    preloadedQuery?: TypeTestersPreloadedQuery;
+};
+export default function TypeTesters({ collectionId, collectionSlug, preloadedQuery, ...rest }: TypeTesters_unifiedProps): React.JSX.Element | null;