fontdue-js 0.1.1 → 1.0.0

package/dist/components/Checkbox/index.js

@@ -20,17 +20,16 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 const Checkbox = props => {
-  var _config$form$checkbox, _config$form;
-
-  const config = (0, _react.useContext)(_ConfigContext.default);
-  const checkboxStyle = (_config$form$checkbox = (_config$form = config.form) === null || _config$form === void 0 ? void 0 : _config$form.checkboxStyle) !== null && _config$form$checkbox !== void 0 ? _config$form$checkbox : 'check';
+  const {
+    form: config
+  } = (0, _react.useContext)(_ConfigContext.default);
   return /*#__PURE__*/_react.default.createElement("div", {
     className: "checkbox"
   }, /*#__PURE__*/_react.default.createElement("input", _extends({
     type: "checkbox"
   }, props)), /*#__PURE__*/_react.default.createElement("div", {
     className: "checkbox__icon"
-  }, checkboxStyle === 'check' ? /*#__PURE__*/_react.default.createElement(_Icons.Check, null) : /*#__PURE__*/_react.default.createElement(_Icons.X, null)));
+  }, config.checkboxStyle === 'check' ? /*#__PURE__*/_react.default.createElement(_Icons.Check, null) : /*#__PURE__*/_react.default.createElement(_Icons.X, null)));
 };
 
 var _default = Checkbox;

package/dist/components/ConfigContext.d.ts

@@ -9,5 +9,82 @@ export interface Config {
     storeModal?: StoreModalConfig;
     typeTester?: TypeTesterConfig;
 }
-declare const _default: React.Context<Config>;
+export declare const makeConfig: (config?: Config | undefined) => {
+    typeTester: {
+        min: number;
+        max: number;
+        autofitOnChange: boolean;
+        truncate: boolean;
+        priceText: boolean;
+        selectButtonStyle: "inline" | "outlined";
+        selectButtonLabel: string;
+        selectButton: boolean;
+        shy: false | "focus" | "hover";
+        toolsPosition: "inline" | "floating";
+        selectable: boolean;
+        priceBar: boolean;
+        textInput: boolean;
+        initialMode: "group" | "local";
+        groupEdit: boolean;
+        bulletStyle: "square" | "round";
+        openTypeFeatures: {
+            columns: {
+                features: (string | {
+                    code: string;
+                    name: string;
+                })[];
+                range?: number | undefined;
+            }[] | undefined;
+            selectionStyle: "checkbox" | "bullet";
+        };
+        alignmentButtons: boolean;
+        initialAlignment: import("./TypeTester/types").Alignment;
+    };
+    form: {
+        checkboxStyle: "cross" | "check";
+    };
+    storeModal: {
+        indexLayout: "styled-aa" | "styled-font-names";
+        productLicensesPosition: "bottom" | "top";
+    };
+};
+declare const _default: React.Context<{
+    typeTester: {
+        min: number;
+        max: number;
+        autofitOnChange: boolean;
+        truncate: boolean;
+        priceText: boolean;
+        selectButtonStyle: "inline" | "outlined";
+        selectButtonLabel: string;
+        selectButton: boolean;
+        shy: false | "focus" | "hover";
+        toolsPosition: "inline" | "floating";
+        selectable: boolean;
+        priceBar: boolean;
+        textInput: boolean;
+        initialMode: "group" | "local";
+        groupEdit: boolean;
+        bulletStyle: "square" | "round";
+        openTypeFeatures: {
+            columns: {
+                features: (string | {
+                    code: string;
+                    name: string;
+                })[];
+                range?: number | undefined;
+            }[] | undefined;
+            selectionStyle: "checkbox" | "bullet";
+        };
+        alignmentButtons: boolean;
+        initialAlignment: import("./TypeTester/types").Alignment;
+    };
+    form: {
+        checkboxStyle: "cross" | "check";
+    };
+    storeModal: {
+        indexLayout: "styled-aa" | "styled-font-names";
+        productLicensesPosition: "bottom" | "top";
+    };
+}>;
 export default _default;

package/dist/components/ConfigContext.js

@@ -3,12 +3,62 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = void 0;
+exports.makeConfig = exports.default = void 0;
 
 var _react = _interopRequireDefault(require("react"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-var _default = /*#__PURE__*/_react.default.createContext({});
+const makeTypeTesterConfig = config => {
+  var _config$shy, _config$toolsPosition, _config$min, _config$max, _config$autofitOnChan, _config$truncate, _config$priceText, _config$selectButtonS, _config$selectButtonL, _ref, _config$selectButton, _config$selectable, _config$priceBar, _config$textInput, _config$initialMode, _config$groupEdit, _config$bulletStyle, _config$openTypeFeatu, _config$openTypeFeatu2, _config$openTypeFeatu3, _config$alignmentButt, _config$initialAlignm;
+
+  let shy = (_config$shy = config === null || config === void 0 ? void 0 : config.shy) !== null && _config$shy !== void 0 ? _config$shy : false;
+  if (shy === true) shy = 'hover';
+  let toolsPosition = (_config$toolsPosition = config === null || config === void 0 ? void 0 : config.toolsPosition) !== null && _config$toolsPosition !== void 0 ? _config$toolsPosition : 'inline';
+  if (shy !== 'focus') toolsPosition = 'inline';
+  return {
+    min: (_config$min = config === null || config === void 0 ? void 0 : config.min) !== null && _config$min !== void 0 ? _config$min : 10,
+    max: (_config$max = config === null || config === void 0 ? void 0 : config.max) !== null && _config$max !== void 0 ? _config$max : 200,
+    autofitOnChange: (_config$autofitOnChan = config === null || config === void 0 ? void 0 : config.autofitOnChange) !== null && _config$autofitOnChan !== void 0 ? _config$autofitOnChan : false,
+    truncate: (_config$truncate = config === null || config === void 0 ? void 0 : config.truncate) !== null && _config$truncate !== void 0 ? _config$truncate : false,
+    priceText: (_config$priceText = config === null || config === void 0 ? void 0 : config.priceText) !== null && _config$priceText !== void 0 ? _config$priceText : false,
+    selectButtonStyle: (_config$selectButtonS = config === null || config === void 0 ? void 0 : config.selectButtonStyle) !== null && _config$selectButtonS !== void 0 ? _config$selectButtonS : 'inline',
+    selectButtonLabel: (_config$selectButtonL = config === null || config === void 0 ? void 0 : config.selectButtonLabel) !== null && _config$selectButtonL !== void 0 ? _config$selectButtonL : 'Select',
+    selectButton: (_ref = (_config$selectButton = config === null || config === void 0 ? void 0 : config.selectButton) !== null && _config$selectButton !== void 0 ? _config$selectButton : config === null || config === void 0 ? void 0 : config.buyButton) !== null && _ref !== void 0 ? _ref : true,
+    shy,
+    toolsPosition,
+    selectable: (_config$selectable = config === null || config === void 0 ? void 0 : config.selectable) !== null && _config$selectable !== void 0 ? _config$selectable : false,
+    priceBar: (_config$priceBar = config === null || config === void 0 ? void 0 : config.priceBar) !== null && _config$priceBar !== void 0 ? _config$priceBar : false,
+    textInput: (_config$textInput = config === null || config === void 0 ? void 0 : config.textInput) !== null && _config$textInput !== void 0 ? _config$textInput : false,
+    initialMode: (_config$initialMode = config === null || config === void 0 ? void 0 : config.initialMode) !== null && _config$initialMode !== void 0 ? _config$initialMode : 'local',
+    groupEdit: (_config$groupEdit = config === null || config === void 0 ? void 0 : config.groupEdit) !== null && _config$groupEdit !== void 0 ? _config$groupEdit : false,
+    bulletStyle: (_config$bulletStyle = config === null || config === void 0 ? void 0 : config.bulletStyle) !== null && _config$bulletStyle !== void 0 ? _config$bulletStyle : 'square',
+    openTypeFeatures: {
+      columns: config === null || config === void 0 ? void 0 : (_config$openTypeFeatu = config.openTypeFeatures) === null || _config$openTypeFeatu === void 0 ? void 0 : _config$openTypeFeatu.columns,
+      selectionStyle: (_config$openTypeFeatu2 = config === null || config === void 0 ? void 0 : (_config$openTypeFeatu3 = config.openTypeFeatures) === null || _config$openTypeFeatu3 === void 0 ? void 0 : _config$openTypeFeatu3.selectionStyle) !== null && _config$openTypeFeatu2 !== void 0 ? _config$openTypeFeatu2 : 'bullet'
+    },
+    alignmentButtons: (_config$alignmentButt = config === null || config === void 0 ? void 0 : config.alignmentButtons) !== null && _config$alignmentButt !== void 0 ? _config$alignmentButt : false,
+    initialAlignment: (_config$initialAlignm = config === null || config === void 0 ? void 0 : config.initialAlignment) !== null && _config$initialAlignm !== void 0 ? _config$initialAlignm : 'left'
+  };
+};
+
+const makeConfig = config => {
+  var _config$form$checkbox, _config$form, _config$storeModal$in, _config$storeModal, _config$storeModal$pr, _config$storeModal2;
+
+  return {
+    typeTester: makeTypeTesterConfig(config === null || config === void 0 ? void 0 : config.typeTester),
+    form: {
+      checkboxStyle: (_config$form$checkbox = config === null || config === void 0 ? void 0 : (_config$form = config.form) === null || _config$form === void 0 ? void 0 : _config$form.checkboxStyle) !== null && _config$form$checkbox !== void 0 ? _config$form$checkbox : 'check'
+    },
+    storeModal: {
+      indexLayout: (_config$storeModal$in = config === null || config === void 0 ? void 0 : (_config$storeModal = config.storeModal) === null || _config$storeModal === void 0 ? void 0 : _config$storeModal.indexLayout) !== null && _config$storeModal$in !== void 0 ? _config$storeModal$in : 'styled-aa',
+      productLicensesPosition: (_config$storeModal$pr = config === null || config === void 0 ? void 0 : (_config$storeModal2 = config.storeModal) === null || _config$storeModal2 === void 0 ? void 0 : _config$storeModal2.productLicensesPosition) !== null && _config$storeModal$pr !== void 0 ? _config$storeModal$pr : 'bottom'
+    }
+  };
+};
+
+exports.makeConfig = makeConfig;
+
+var _default = /*#__PURE__*/_react.default.createContext(makeConfig());
 
 exports.default = _default;

package/dist/components/FontdueProvider/index.js

@@ -13,7 +13,7 @@ var _reactRedux = require("react-redux");
 
 var _Stylesheet = require("../Stylesheet");
 
-var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
+var _ConfigContext = _interopRequireWildcard(require("../ConfigContext"));
 
 var _ComponentsContext = _interopRequireDefault(require("../ComponentsContext"));
 
@@ -46,7 +46,7 @@ const FontdueProvider = _ref => {
   }, /*#__PURE__*/_react.default.createElement(_reactRedux.Provider, {
     store: _reducer.store
   }, /*#__PURE__*/_react.default.createElement(_Stylesheet.StylesheetContainer, null), /*#__PURE__*/_react.default.createElement(_ThemeConfig.default, null), /*#__PURE__*/_react.default.createElement(_ConfigContext.default.Provider, {
-    value: config !== null && config !== void 0 ? config : {}
+    value: (0, _ConfigContext.makeConfig)(config)
   }, /*#__PURE__*/_react.default.createElement(_ComponentsContext.default.Provider, {
     value: components !== null && components !== void 0 ? components : {}
   }, /*#__PURE__*/_react.default.createElement(_TestModeBanner.default, null), children))));

package/dist/components/SelectButton/index.js

@@ -30,8 +30,6 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
 const DefaultSelectButton = _ref => {
-  var _config$selectButtonL;
-
   let {
     productId,
     innerProps: {
@@ -61,7 +59,7 @@ const DefaultSelectButton = _ref => {
   return /*#__PURE__*/_react.default.createElement("button", _extends({}, rest, {
     onClick: handleClick,
     className: "select-button"
-  }), (_config$selectButtonL = config === null || config === void 0 ? void 0 : config.selectButtonLabel) !== null && _config$selectButtonL !== void 0 ? _config$selectButtonL : 'Select');
+  }), config.selectButtonLabel);
 };
 
 const SelectButton = _ref2 => {

package/dist/components/StoreModal/StoreModalIndex.js

@@ -36,12 +36,14 @@ const plural = (count, singularString, pluralString) => {
 };
 
 const StoreModalIndex = _ref => {
-  var _viewer$rootCollectio, _viewer$rootCollectio2, _config$storeModal;
+  var _viewer$rootCollectio, _viewer$rootCollectio2;
 
   let {
     prepared
   } = _ref;
-  const config = (0, _react.useContext)(_ConfigContext.default);
+  const {
+    storeModal: config
+  } = (0, _react.useContext)(_ConfigContext.default);
   const data = (0, _reactRelay.usePreloadedQuery)(_StoreModalIndexQuery !== void 0 ? _StoreModalIndexQuery : (_StoreModalIndexQuery = require("../../__generated__/StoreModalIndexQuery.graphql"), _StoreModalIndexQuery.hash && _StoreModalIndexQuery.hash !== "320b414c78b179d8791e18dd840c5af6" && console.error("The definition of 'StoreModalIndexQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _StoreModalIndexQuery), prepared.indexQuery);
   const dispatch = (0, _reactRedux.useDispatch)();
   const viewer = data.viewer;
@@ -57,7 +59,6 @@ const StoreModalIndex = _ref => {
     });
   };
 
-  const indexLayout = (config === null || config === void 0 ? void 0 : (_config$storeModal = config.storeModal) === null || _config$storeModal === void 0 ? void 0 : _config$storeModal.indexLayout) || 'styled-aa';
   return /*#__PURE__*/_react.default.createElement(_StoreModalPageContainer.default, null, {
     title: 'All collections',
     body: edges.map(edge => {
@@ -67,12 +68,12 @@ const StoreModalIndex = _ref => {
         key: edge.node.id,
         onClick: handleClickProduct.bind(null, edge.node.id)
       }, {
-        aa: indexLayout === 'styled-aa' && (edge.node.featureStyle ? /*#__PURE__*/_react.default.createElement(_react.Fragment, null, ((_edge$node$featureSty = edge.node.featureStyle.family) === null || _edge$node$featureSty === void 0 ? void 0 : _edge$node$featureSty.cssUrl) && /*#__PURE__*/_react.default.createElement(_Stylesheet.default, {
+        aa: config.indexLayout === 'styled-aa' && (edge.node.featureStyle ? /*#__PURE__*/_react.default.createElement(_react.Fragment, null, ((_edge$node$featureSty = edge.node.featureStyle.family) === null || _edge$node$featureSty === void 0 ? void 0 : _edge$node$featureSty.cssUrl) && /*#__PURE__*/_react.default.createElement(_Stylesheet.default, {
           href: edge.node.featureStyle.family.cssUrl
         }), /*#__PURE__*/_react.default.createElement(_FontStyle.default, {
           fontStyle: edge.node.featureStyle
         }, "Aa")) : null),
-        name: indexLayout === 'styled-font-names' ? edge.node.featureStyle && /*#__PURE__*/_react.default.createElement(_react.Fragment, null, ((_edge$node$featureSty2 = edge.node.featureStyle.family) === null || _edge$node$featureSty2 === void 0 ? void 0 : _edge$node$featureSty2.cssUrl) && /*#__PURE__*/_react.default.createElement(_Stylesheet.default, {
+        name: config.indexLayout === 'styled-font-names' ? edge.node.featureStyle && /*#__PURE__*/_react.default.createElement(_react.Fragment, null, ((_edge$node$featureSty2 = edge.node.featureStyle.family) === null || _edge$node$featureSty2 === void 0 ? void 0 : _edge$node$featureSty2.cssUrl) && /*#__PURE__*/_react.default.createElement(_Stylesheet.default, {
           href: edge.node.featureStyle.family.cssUrl
         }), /*#__PURE__*/_react.default.createElement(_FontStyle.default, {
           fontStyle: edge.node.featureStyle

package/dist/components/StoreModalProductLicenseSelection/LicenseElement.js

@@ -20,8 +20,6 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 const LicenseElement = _ref => {
-  var _config$form$checkbox, _config$form;
-
   let {
     onClick,
     isSelected,
@@ -30,8 +28,9 @@ const LicenseElement = _ref => {
       variables
     }
   } = _ref;
-  const config = (0, _react.useContext)(_ConfigContext.default);
-  const checkboxStyle = (_config$form$checkbox = (_config$form = config.form) === null || _config$form === void 0 ? void 0 : _config$form.checkboxStyle) !== null && _config$form$checkbox !== void 0 ? _config$form$checkbox : 'check';
+  const {
+    form: config
+  } = (0, _react.useContext)(_ConfigContext.default);
   return /*#__PURE__*/_react.default.createElement(_Button.default, {
     onClick: onClick,
     className: "store-modal__license-selection__license-button",
@@ -40,7 +39,7 @@ const LicenseElement = _ref => {
     className: "store-modal__license-selection__license-button-label"
   }, /*#__PURE__*/_react.default.createElement("span", {
     className: "store-modal__license-selection__icon-pair"
-  }, isSelected ? checkboxStyle === 'check' ? /*#__PURE__*/_react.default.createElement(_Icons.CheckboxChecked, null) : /*#__PURE__*/_react.default.createElement(_Icons.CheckboxCrossed, null) : /*#__PURE__*/_react.default.createElement(_Icons.Checkbox, null), name)), /*#__PURE__*/_react.default.createElement("div", {
+  }, isSelected ? config.checkboxStyle === 'check' ? /*#__PURE__*/_react.default.createElement(_Icons.CheckboxChecked, null) : /*#__PURE__*/_react.default.createElement(_Icons.CheckboxCrossed, null) : /*#__PURE__*/_react.default.createElement(_Icons.Checkbox, null), name)), /*#__PURE__*/_react.default.createElement("div", {
     className: "store-modal__license-selection__variables"
   }, variables));
 };

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

@@ -1,7 +1,5 @@
 import React from 'react';
-import { TypeTesterConfig } from '.';
 interface TypeTesterEditAllProps {
-    config: TypeTesterConfig;
 }
 declare const TypeTesterEditAll: React.FunctionComponent<TypeTesterEditAllProps>;
 export default TypeTesterEditAll;

package/dist/components/TypeTester/TypeTesterEditAll.js

@@ -11,16 +11,18 @@ var _TypeTesterContext = require("./TypeTesterContext");
 
 var _TypeTesterBullet = _interopRequireDefault(require("./TypeTesterBullet"));
 
+var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-const TypeTesterEditAll = _ref => {
-  let {
-    config
-  } = _ref;
+const TypeTesterEditAll = () => {
+  const {
+    typeTester: config
+  } = (0, _react.useContext)(_ConfigContext.default);
   const {
     mode,
     dispatch

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

@@ -1,10 +1,8 @@
 import { TypeTesterFeatures_fontStyle } from '../../__generated__/TypeTesterFeatures_fontStyle.graphql';
-import { TypeTesterConfig } from '.';
 interface TypeTesterFeatures_props {
     id: string;
     fontStyle: TypeTesterFeatures_fontStyle;
     features: ReadonlyArray<string>;
-    config: TypeTesterConfig;
 }
 declare const _default: import("react-relay").Container<TypeTesterFeatures_props>;
 export default _default;

package/dist/components/TypeTester/TypeTesterFeatures.js

@@ -17,6 +17,8 @@ var _TypeTesterState = _interopRequireDefault(require("./TypeTesterState"));
 
 var _Checkbox = _interopRequireDefault(require("../Checkbox"));
 
+var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
+
 var _TypeTesterFeatures_stylisticSetName, _TypeTesterFeatures_fontStyle;
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -87,14 +89,16 @@ const getFeatureName = (feature, stylisticSetNames) => {
 _TypeTesterFeatures_stylisticSetName !== void 0 ? _TypeTesterFeatures_stylisticSetName : (_TypeTesterFeatures_stylisticSetName = require("../../__generated__/TypeTesterFeatures_stylisticSetName.graphql"), _TypeTesterFeatures_stylisticSetName.hash && _TypeTesterFeatures_stylisticSetName.hash !== "8420321d8ddf9b3846450d609586db21" && console.error("The definition of 'TypeTesterFeatures_stylisticSetName' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTesterFeatures_stylisticSetName);
 
 const TypeTesterFeatures = _ref2 => {
-  var _config$openTypeFeatu, _config$openTypeFeatu2, _config$openTypeFeatu3, _config$openTypeFeatu4, _config$openTypeFeatu5, _config$openTypeFeatu6;
+  var _config$openTypeFeatu, _config$openTypeFeatu2, _config$openTypeFeatu3, _config$openTypeFeatu4;
 
   let {
     id,
     fontStyle,
-    features: showFeatures,
-    config
+    features: showFeatures
   } = _ref2;
+  const {
+    typeTester: config
+  } = (0, _react.useContext)(_ConfigContext.default);
   const {
     features,
     toggleFeature,
@@ -102,7 +106,7 @@ const TypeTesterFeatures = _ref2 => {
   } = (0, _TypeTesterState.default)({
     id
   });
-  const selectionStyle = (_config$openTypeFeatu = (_config$openTypeFeatu2 = config.openTypeFeatures) === null || _config$openTypeFeatu2 === void 0 ? void 0 : _config$openTypeFeatu2.selectionStyle) !== null && _config$openTypeFeatu !== void 0 ? _config$openTypeFeatu : 'bullet';
+  const selectionStyle = config.openTypeFeatures.selectionStyle;
 
   const renderFeature = feature => {
     var _fontStyle$fontFeatur;
@@ -128,7 +132,7 @@ const TypeTesterFeatures = _ref2 => {
 
   let featuresColumns;
 
-  if ((_config$openTypeFeatu3 = config.openTypeFeatures) !== null && _config$openTypeFeatu3 !== void 0 && (_config$openTypeFeatu4 = _config$openTypeFeatu3.columns) !== null && _config$openTypeFeatu4 !== void 0 && _config$openTypeFeatu4.length) {
+  if ((_config$openTypeFeatu = config.openTypeFeatures) !== null && _config$openTypeFeatu !== void 0 && (_config$openTypeFeatu2 = _config$openTypeFeatu.columns) !== null && _config$openTypeFeatu2 !== void 0 && _config$openTypeFeatu2.length) {
     featuresColumns = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, config.openTypeFeatures.columns.map((columnConfig, i) => /*#__PURE__*/_react.default.createElement("div", {
       key: i,
       "data-range": columnConfig.range,
@@ -157,7 +161,8 @@ const TypeTesterFeatures = _ref2 => {
   }, /*#__PURE__*/_react.default.createElement("div", {
     ref: featuresContentRef,
     className: "type-tester__features",
-    "data-columns": (_config$openTypeFeatu5 = config.openTypeFeatures) !== null && _config$openTypeFeatu5 !== void 0 && (_config$openTypeFeatu6 = _config$openTypeFeatu5.columns) !== null && _config$openTypeFeatu6 !== void 0 && _config$openTypeFeatu6.length ? 'set' : 'auto'
+    "data-selection-style": selectionStyle,
+    "data-columns": (_config$openTypeFeatu3 = config.openTypeFeatures) !== null && _config$openTypeFeatu3 !== void 0 && (_config$openTypeFeatu4 = _config$openTypeFeatu3.columns) !== null && _config$openTypeFeatu4 !== void 0 && _config$openTypeFeatu4.length ? 'set' : 'auto'
   }, featuresColumns));
 };
 

package/dist/components/TypeTester/TypeTesterFloatingToolbar.js

@@ -26,7 +26,7 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 const TypeTesterFloatingToolbar = _ref => {
-  var _testersData$find, _config$typeTester, _config$typeTester2;
+  var _testersData$find;
 
   let {
     testers: testersData,
@@ -77,13 +77,11 @@ const TypeTesterFloatingToolbar = _ref => {
     "data-open": activeId && open
   }, activeId && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_TypeTesterToolbar.default, {
     id: activeId,
-    features: features,
-    config: (_config$typeTester = config.typeTester) !== null && _config$typeTester !== void 0 ? _config$typeTester : {}
+    features: features
   }), features && fontStyle && /*#__PURE__*/_react.default.createElement(_TypeTesterFeatures.default, {
     id: activeId,
     features: features,
-    fontStyle: fontStyle,
-    config: (_config$typeTester2 = config.typeTester) !== null && _config$typeTester2 !== void 0 ? _config$typeTester2 : {}
+    fontStyle: fontStyle
   })));
 };
 

package/dist/components/TypeTester/TypeTesterStandalone.js

@@ -37,14 +37,14 @@ const TypeTesterStandalone = _ref => {
   } = _ref;
   const environment = (0, _reactRelay.useRelayEnvironment)();
   return /*#__PURE__*/_react.default.createElement(_reactRelay.QueryRenderer, {
-    query: _TypeTesterStandalone_StyleQuery !== void 0 ? _TypeTesterStandalone_StyleQuery : (_TypeTesterStandalone_StyleQuery = require("../../__generated__/TypeTesterStandalone_StyleQuery.graphql"), _TypeTesterStandalone_StyleQuery.hash && _TypeTesterStandalone_StyleQuery.hash !== "aafc4541c04db8a72ac96c7d09e58490" && console.error("The definition of 'TypeTesterStandalone_StyleQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTesterStandalone_StyleQuery),
+    query: _TypeTesterStandalone_StyleQuery !== void 0 ? _TypeTesterStandalone_StyleQuery : (_TypeTesterStandalone_StyleQuery = require("../../__generated__/TypeTesterStandalone_StyleQuery.graphql"), _TypeTesterStandalone_StyleQuery.hash && _TypeTesterStandalone_StyleQuery.hash !== "6b7470fc7c096c1adc484c7b3d32b126" && console.error("The definition of 'TypeTesterStandalone_StyleQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTesterStandalone_StyleQuery),
     variables: {
       familyName,
       styleName
     },
     environment: environment,
     render: _ref2 => {
-      var _props$viewer$fontSty, _props$viewer, _props$viewer$fontSty2, _features$split;
+      var _props$viewer$fontSty, _props$viewer, _props$viewer$fontSty2, _features$split, _props$viewer$fontSty3, _props$viewer2, _props$viewer2$fontSt, _props$viewer2$fontSt2, _props$viewer2$fontSt3, _props$viewer3, _props$viewer3$fontSt, _props$viewer3$fontSt2;
 
       let {
         props
@@ -66,7 +66,7 @@ const TypeTesterStandalone = _ref => {
         fontStyleId: (_props$viewer$fontSty = (_props$viewer = props.viewer) === null || _props$viewer === void 0 ? void 0 : (_props$viewer$fontSty2 = _props$viewer.fontStyle) === null || _props$viewer$fontSty2 === void 0 ? void 0 : _props$viewer$fontSty2.id) !== null && _props$viewer$fontSty !== void 0 ? _props$viewer$fontSty : null,
         features: (_features$split = features === null || features === void 0 ? void 0 : features.split(',')) !== null && _features$split !== void 0 ? _features$split : [],
         direction: direction === 'rtl' ? 'rtl' : 'ltr',
-        productId: "TODO",
+        productId: (_props$viewer$fontSty3 = (_props$viewer2 = props.viewer) === null || _props$viewer2 === void 0 ? void 0 : (_props$viewer2$fontSt = _props$viewer2.fontStyle) === null || _props$viewer2$fontSt === void 0 ? void 0 : (_props$viewer2$fontSt2 = _props$viewer2$fontSt.family) === null || _props$viewer2$fontSt2 === void 0 ? void 0 : (_props$viewer2$fontSt3 = _props$viewer2$fontSt2.parent) === null || _props$viewer2$fontSt3 === void 0 ? void 0 : _props$viewer2$fontSt3.id) !== null && _props$viewer$fontSty3 !== void 0 ? _props$viewer$fontSty3 : (_props$viewer3 = props.viewer) === null || _props$viewer3 === void 0 ? void 0 : (_props$viewer3$fontSt = _props$viewer3.fontStyle) === null || _props$viewer3$fontSt === void 0 ? void 0 : (_props$viewer3$fontSt2 = _props$viewer3$fontSt.family) === null || _props$viewer3$fontSt2 === void 0 ? void 0 : _props$viewer3$fontSt2.id,
         config: {
           groupEdit: false,
           buyButton: false

package/dist/components/TypeTester/TypeTesterState.js

@@ -14,8 +14,6 @@ var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 const useTypeTesterState = _ref => {
-  var _config$typeTester$to, _config$typeTester;
-
   let {
     id
   } = _ref;
@@ -25,7 +23,7 @@ const useTypeTesterState = _ref => {
     globalFeaturesOpen,
     dispatch
   } = (0, _react.useContext)(_TypeTesterContext.TypeTesterContext);
-  const toolsPosition = (_config$typeTester$to = config === null || config === void 0 ? void 0 : (_config$typeTester = config.typeTester) === null || _config$typeTester === void 0 ? void 0 : _config$typeTester.toolsPosition) !== null && _config$typeTester$to !== void 0 ? _config$typeTester$to : 'inline';
+  const toolsPosition = config.typeTester.toolsPosition;
   const {
     content,
     contentEdited,

package/dist/components/TypeTester/TypeTesterStyleSelect.js

@@ -11,8 +11,6 @@ var _Select = _interopRequireDefault(require("../Select"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-const NBSP = '\xa0';
-
 const TypeTesterStyleSelect = _ref => {
   let {
     families,

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

@@ -1,9 +1,7 @@
 import React from 'react';
-import { TypeTesterConfig } from '.';
 interface TypeTesterToolbar_props {
     id: string;
     features: readonly string[] | null | undefined;
-    config: TypeTesterConfig;
 }
 declare const TypeTesterToolbar: React.FC<TypeTesterToolbar_props>;
 export default TypeTesterToolbar;

package/dist/components/TypeTester/TypeTesterToolbar.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 
 var _TypeTesterFeaturesButton = _interopRequireDefault(require("./TypeTesterFeaturesButton"));
 
@@ -19,18 +19,22 @@ var _TypeTesterState = _interopRequireDefault(require("./TypeTesterState"));
 
 var _TypeTesterAlignButtons = _interopRequireDefault(require("./TypeTesterAlignButtons"));
 
+var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-const TypeTesterToolbar = _ref => {
-  var _config$min, _config$max, _config$min2, _config$max2;
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
+const TypeTesterToolbar = _ref => {
   let {
     id,
-    features,
-    config
+    features
   } = _ref;
+  const {
+    typeTester: config
+  } = (0, _react.useContext)(_ConfigContext.default);
   const props = (0, _TypeTesterState.default)({
     id
   });
@@ -40,18 +44,16 @@ const TypeTesterToolbar = _ref => {
   }, /*#__PURE__*/_react.default.createElement("div", {
     className: "type-tester__slider"
   }, config.textInput && /*#__PURE__*/_react.default.createElement(_TypeTesterInput.default, {
-    min: (_config$min = config.min) !== null && _config$min !== void 0 ? _config$min : 10,
-    max: (_config$max = config.max) !== null && _config$max !== void 0 ? _config$max : 200,
+    min: config.min,
+    max: config.max,
     value: props.size,
     onChange: props.setSize
   }), /*#__PURE__*/_react.default.createElement(_TypeTesterSlider.default, {
-    min: (_config$min2 = config.min) !== null && _config$min2 !== void 0 ? _config$min2 : 10,
-    max: (_config$max2 = config.max) !== null && _config$max2 !== void 0 ? _config$max2 : 200,
+    min: config.min,
+    max: config.max,
     value: props.size,
     onChange: props.setSize
-  })), Boolean(features === null || features === void 0 ? void 0 : features.length) && /*#__PURE__*/_react.default.createElement(_TypeTesterFeaturesButton.default, props), config.alignmentButtons && /*#__PURE__*/_react.default.createElement(_TypeTesterAlignButtons.default, props), config.groupEdit && /*#__PURE__*/_react.default.createElement(_TypeTesterEditAll.default, _extends({}, props, {
-    config: config
-  })));
+  })), Boolean(features === null || features === void 0 ? void 0 : features.length) && /*#__PURE__*/_react.default.createElement(_TypeTesterFeaturesButton.default, props), config.alignmentButtons && /*#__PURE__*/_react.default.createElement(_TypeTesterAlignButtons.default, props), config.groupEdit && /*#__PURE__*/_react.default.createElement(_TypeTesterEditAll.default, props));
 };
 
 var _default = TypeTesterToolbar;

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

@@ -5,6 +5,7 @@ export interface TypeTesterConfig {
     max?: number;
     selectable?: boolean;
     priceBar?: boolean;
+    selectButton?: boolean;
     buyButton?: boolean;
     textInput?: boolean;
     initialMode?: 'group' | 'local';
@@ -32,7 +33,7 @@ export interface TypeTesterConfig {
 }
 export interface TypeTesterBaseProps {
     id: string;
-    productId: string;
+    productId?: string;
     direction: 'ltr' | 'rtl';
     onSelectFontStyleId: (value: string) => void;
     features?: readonly string[] | null;