fontdue-js 2.10.1 → 2.12.0

package/dist/components/Cart/CartItem/CartItemAdditionalLicenses.d.ts

@@ -0,0 +1,10 @@
+import { CartItemAdditionalLicenses_licenses$key } from '__generated__/CartItemAdditionalLicenses_licenses.graphql';
+import { CartItemAdditionalLicenses_orderItem$key } from '__generated__/CartItemAdditionalLicenses_orderItem.graphql';
+import React from 'react';
+interface AdditionalLicenses_props {
+    licenses: CartItemAdditionalLicenses_licenses$key | null;
+    orderItem: CartItemAdditionalLicenses_orderItem$key;
+    onAddLicense: (licenseId: string) => void;
+}
+export default function CartItemAdditionalLicenses({ licenses: licensesKey, orderItem: orderItemKey, onAddLicense, }: AdditionalLicenses_props): React.JSX.Element | null;
+export {};

package/dist/components/Cart/CartItem/CartItemAdditionalLicenses.js

@@ -0,0 +1,38 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = CartItemAdditionalLicenses;
+var _CartItemAdditionalLicenses_orderItem2 = _interopRequireDefault(require("../../../__generated__/CartItemAdditionalLicenses_orderItem.graphql"));
+var _CartItemAdditionalLicenses_licenses2 = _interopRequireDefault(require("../../../__generated__/CartItemAdditionalLicenses_licenses.graphql"));
+var _react = _interopRequireDefault(require("react"));
+var _reactRelay = require("react-relay");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function CartItemAdditionalLicenses(_ref) {
+  var _orderItem$licenseSel;
+  let {
+    licenses: licensesKey,
+    orderItem: orderItemKey,
+    onAddLicense
+  } = _ref;
+  const licenses = (0, _reactRelay.useFragment)((_CartItemAdditionalLicenses_licenses2.default.hash && _CartItemAdditionalLicenses_licenses2.default.hash !== "a00d0c8ac3643f7c12911fad6f62ec4e" && console.error("The definition of 'CartItemAdditionalLicenses_licenses' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _CartItemAdditionalLicenses_licenses2.default), licensesKey);
+  const orderItem = (0, _reactRelay.useFragment)((_CartItemAdditionalLicenses_orderItem2.default.hash && _CartItemAdditionalLicenses_orderItem2.default.hash !== "3358a415bba3d69844b42bab6f71b551" && console.error("The definition of 'CartItemAdditionalLicenses_orderItem' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _CartItemAdditionalLicenses_orderItem2.default), orderItemKey);
+  if (!licenses) return null;
+  const licenseIds = (_orderItem$licenseSel = orderItem.licenseSelections) === null || _orderItem$licenseSel === void 0 ? void 0 : _orderItem$licenseSel.map(_ref2 => {
+    let {
+      license
+    } = _ref2;
+    return license.id;
+  });
+  const additionalLicenses = licenses.filter(license => !(licenseIds !== null && licenseIds !== void 0 && licenseIds.some(id => id === license.id)));
+  if (additionalLicenses.length < 1) return null;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "cart-item__additional-licenses"
+  }, "+ Add:", ' ', additionalLicenses.map(license => /*#__PURE__*/_react.default.createElement("button", {
+    type: "button",
+    className: "cart-item__additional-licenses__item",
+    key: license.id,
+    onClick: () => onAddLicense(license.id)
+  }, license.name)));
+}

package/dist/components/Cart/CartItem/CartItemLicense.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+import { SelectionInput } from '../types';
+import { CartItemLicense_selection$key } from '__generated__/CartItemLicense_selection.graphql';
+interface CartItemLicense_props {
+    selections: CartItemLicense_selection$key;
+    onChange: (value: SelectionInput) => void;
+    onRemoveLicense: (licenseId: string) => void;
+    closeButtonMouseEnter: () => void;
+    closeButtonMouseLeave: () => void;
+}
+export default function CartItemLicense({ onChange, onRemoveLicense, closeButtonMouseEnter: parentCloseButtonMouseEnter, closeButtonMouseLeave: parentCloseButtonMouseLeave, selections: selectionsKey, }: CartItemLicense_props): React.JSX.Element | null;
+export {};

package/dist/components/Cart/CartItem/CartItemLicense.js

@@ -0,0 +1,75 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = CartItemLicense;
+var _CartItemLicense_selection2 = _interopRequireDefault(require("../../../__generated__/CartItemLicense_selection.graphql"));
+var _react = _interopRequireWildcard(require("react"));
+var _reactRelay = require("react-relay");
+var _Icons = require("../../Icons");
+var _CartItemVariable = _interopRequireDefault(require("./CartItemVariable"));
+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 CartItemLicense(_ref) {
+  var _selections$filter;
+  let {
+    onChange,
+    onRemoveLicense,
+    closeButtonMouseEnter: parentCloseButtonMouseEnter,
+    closeButtonMouseLeave: parentCloseButtonMouseLeave,
+    selections: selectionsKey
+  } = _ref;
+  const selections = (0, _reactRelay.useFragment)((_CartItemLicense_selection2.default.hash && _CartItemLicense_selection2.default.hash !== "8a249e2954a1c0d5279a28d666abe1c0" && console.error("The definition of 'CartItemLicense_selection' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _CartItemLicense_selection2.default), selectionsKey);
+  if (selections.length === 0) return null;
+  const license = selections[0].license;
+  if (!license) return null;
+  const [closeButtonIsHovered, setCloseButtonIsHovered] = (0, _react.useState)(false);
+  const closeButtonMouseEnter = () => {
+    parentCloseButtonMouseEnter();
+    setCloseButtonIsHovered(true);
+  };
+  const closeButtonMouseLeave = () => {
+    parentCloseButtonMouseLeave();
+    setCloseButtonIsHovered(false);
+  };
+  const handleClickRemove = () => {
+    closeButtonMouseLeave();
+    onRemoveLicense(license.id);
+  };
+  return /*#__PURE__*/_react.default.createElement("li", {
+    key: license.id,
+    className: "cart-item__license",
+    "data-close-button-hovered": closeButtonIsHovered
+  }, /*#__PURE__*/_react.default.createElement("button", {
+    type: "button",
+    className: "cart-item__license__delete-button",
+    "aria-label": "Remove license",
+    onClick: handleClickRemove,
+    onMouseEnter: closeButtonMouseEnter,
+    onMouseLeave: closeButtonMouseLeave
+  }, /*#__PURE__*/_react.default.createElement(_Icons.X, null)), /*#__PURE__*/_react.default.createElement("div", {
+    className: "cart-item__license-wrapper"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "cart-item__license-name"
+  }, license.name), (((_selections$filter = selections.filter(selection => selection.licenseVariable)) === null || _selections$filter === void 0 ? void 0 : _selections$filter.length) ?? 0) > 0 && /*#__PURE__*/_react.default.createElement("ul", {
+    className: "cart-item__license-variables"
+  }, selections.map(selection => {
+    var _license$licenseVaria;
+    return /*#__PURE__*/_react.default.createElement("li", {
+      className: "cart-item__license-variable",
+      key: selection.id
+    }, /*#__PURE__*/_react.default.createElement(_CartItemVariable.default, {
+      selection: selection,
+      onChange: onChange,
+      variable: (_license$licenseVaria = license.licenseVariables) === null || _license$licenseVaria === void 0 ? void 0 : _license$licenseVaria.find(_ref2 => {
+        var _selection$licenseVar;
+        let {
+          id
+        } = _ref2;
+        return id === ((_selection$licenseVar = selection.licenseVariable) === null || _selection$licenseVar === void 0 ? void 0 : _selection$licenseVar.id);
+      })
+    }));
+  }))));
+}

package/dist/components/Cart/CartItem/CartItemProduct.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import { CartItemProduct_product$key } from '__generated__/CartItemProduct_product.graphql';
+interface Props {
+    product: CartItemProduct_product$key | null;
+}
+export default function CartItemProduct({ product: productKey }: Props): React.JSX.Element;
+export {};

package/dist/components/Cart/CartItem/CartItemProduct.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = CartItemProduct;
+var _CartItemProduct_product2 = _interopRequireDefault(require("../../../__generated__/CartItemProduct_product.graphql"));
+var _react = _interopRequireDefault(require("react"));
+var _Stylesheet = _interopRequireDefault(require("../../Stylesheet"));
+var _CollectionAa = require("../../CollectionAa");
+var _FontStyle = _interopRequireDefault(require("../../FontStyle"));
+var _reactRelay = require("react-relay");
+var _utils = require("../../../utils");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function CartItemProduct(_ref) {
+  var _product$family, _product$featureStyle, _product$featureStyle2, _product$variableInst;
+  let {
+    product: productKey
+  } = _ref;
+  const product = (0, _reactRelay.useFragment)((_CartItemProduct_product2.default.hash && _CartItemProduct_product2.default.hash !== "93463fc6e5eab6e2f910904bf0c2393e" && console.error("The definition of 'CartItemProduct_product' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _CartItemProduct_product2.default), productKey);
+  let productCss;
+  if ((product === null || product === void 0 ? void 0 : product.__typename) === 'FontStyle') productCss = (_product$family = product.family) === null || _product$family === void 0 ? void 0 : _product$family.cssUrl;
+  if ((product === null || product === void 0 ? void 0 : product.__typename) === 'FontCollection') productCss = (_product$featureStyle = product.featureStyle) === null || _product$featureStyle === void 0 ? void 0 : (_product$featureStyle2 = _product$featureStyle.family) === null || _product$featureStyle2 === void 0 ? void 0 : _product$featureStyle2.cssUrl;
+  let productName = (product === null || product === void 0 ? void 0 : product.name) ?? '??';
+  if ((product === null || product === void 0 ? void 0 : product.__typename) === 'FontStyle' && product.family) productName = `${product.family.name} ${product.name}`;
+  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("div", {
+    className: "cart-item__aa"
+  }, product ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_Stylesheet.default, {
+    href: productCss
+  }), ['FontCollection', 'Bundle'].indexOf(product.__typename) >= 0 ? /*#__PURE__*/_react.default.createElement(_CollectionAa.CollectionAa, {
+    product: product
+  }) : /*#__PURE__*/_react.default.createElement(_FontStyle.default, {
+    fontStyle: product
+  }, /*#__PURE__*/_react.default.createElement("span", null, "A"), /*#__PURE__*/_react.default.createElement("span", null, "a"))) : '??'), /*#__PURE__*/_react.default.createElement("div", {
+    className: "cart-item__product"
+  }, /*#__PURE__*/_react.default.createElement("h3", {
+    className: "cart-item__name"
+  }, productName), product !== null && product !== void 0 && product.isVariableFont || product !== null && product !== void 0 && (_product$variableInst = product.variableInstances) !== null && _product$variableInst !== void 0 && _product$variableInst.length ? /*#__PURE__*/_react.default.createElement("div", {
+    className: "cart-item__label"
+  }, "Variable font") : (product === null || product === void 0 ? void 0 : product.__typename) === 'FontCollection' && /*#__PURE__*/_react.default.createElement("div", {
+    className: "cart-item__label"
+  }, "(", (0, _utils.pluralize)(product.totalStyles ?? 0, 'style'), ")")));
+}

package/dist/components/Cart/CartItem/CartItemVariable.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+import { CartItemVariable_selection$key } from '__generated__/CartItemVariable_selection.graphql';
+import { CartItemVariable_variable$key } from '__generated__/CartItemVariable_variable.graphql';
+import { SelectionInput } from '../types';
+interface Props {
+    selection: CartItemVariable_selection$key;
+    variable?: CartItemVariable_variable$key;
+    onChange: (value: SelectionInput) => void;
+}
+export default function CartItemVariable({ selection: selectionKey, variable: variableKey, onChange, }: Props): React.JSX.Element | null;
+export {};

package/dist/components/Cart/CartItem/CartItemVariable.js

@@ -0,0 +1,76 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = CartItemVariable;
+var _CartItemVariable_variable2 = _interopRequireDefault(require("../../../__generated__/CartItemVariable_variable.graphql"));
+var _CartItemVariable_selection2 = _interopRequireDefault(require("../../../__generated__/CartItemVariable_selection.graphql"));
+var _react = _interopRequireDefault(require("react"));
+var _VariableTableAmounts = _interopRequireDefault(require("../../VariableTableAmounts"));
+var _VariableTextInput = _interopRequireDefault(require("./VariableTextInput"));
+var _Icons = require("../../Icons");
+var _reactRelay = require("react-relay");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function CartItemVariable(_ref) {
+  var _variableOptions, _selection$licenseOpt2, _selection$licenseOpt3, _selection$licenseOpt4, _variableOptions2;
+  let {
+    // selection may contain *deleted* licenseVariable and/or licenseOptions
+    selection: selectionKey,
+    // variable is the "public"-facing list of variables/options which do NOT included deleted stuff
+    variable: variableKey,
+    onChange
+  } = _ref;
+  const selection = (0, _reactRelay.useFragment)((_CartItemVariable_selection2.default.hash && _CartItemVariable_selection2.default.hash !== "9a658e82957a12990886e5e14dae37bc" && console.error("The definition of 'CartItemVariable_selection' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _CartItemVariable_selection2.default), selectionKey);
+  const variable = (0, _reactRelay.useFragment)((_CartItemVariable_variable2.default.hash && _CartItemVariable_variable2.default.hash !== "4f53aadeee4ad6e8d84a087459ba2343" && console.error("The definition of 'CartItemVariable_variable' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _CartItemVariable_variable2.default), variableKey);
+  if (!selection.licenseVariable) return null;
+  let variableOptions = (variable === null || variable === void 0 ? void 0 : variable.licenseOptions) ?? [];
+  if (variableOptions && selection.licenseOption && !((_variableOptions = variableOptions) !== null && _variableOptions !== void 0 && _variableOptions.find(option => {
+    var _selection$licenseOpt;
+    return option.id === ((_selection$licenseOpt = selection.licenseOption) === null || _selection$licenseOpt === void 0 ? void 0 : _selection$licenseOpt.id);
+  }))) {
+    // show option even if it's soft-deleted (it's not found in the list of
+    //   variable.variableOptions, but it is available on the selection)
+    variableOptions = [selection.licenseOption, ...variableOptions];
+  }
+  const handleSelectChange = e => {
+    var _selection$licenseVar;
+    onChange({
+      id: selection.id,
+      licenseId: selection.license.id,
+      licenseVariableId: (_selection$licenseVar = selection.licenseVariable) === null || _selection$licenseVar === void 0 ? void 0 : _selection$licenseVar.id,
+      licenseOptionId: e.target.value
+    });
+  };
+  const handleTextChange = value => {
+    var _selection$licenseVar2;
+    onChange({
+      id: selection.id,
+      licenseId: selection.license.id,
+      licenseVariableId: (_selection$licenseVar2 = selection.licenseVariable) === null || _selection$licenseVar2 === void 0 ? void 0 : _selection$licenseVar2.id,
+      variableText: value
+    });
+  };
+  return /*#__PURE__*/_react.default.createElement("label", {
+    className: "cart-item__license-variable__option",
+    "data-variable-type": selection.licenseVariable.variableType
+  }, selection.licenseVariable.variableType === 'select' || selection.licenseVariable.variableType === 'table' ? /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, selection.licenseVariable.variableType === 'table' ? /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("div", {
+    className: "cart-item__license-variable__option-name"
+  }, (_selection$licenseOpt2 = selection.licenseOption) === null || _selection$licenseOpt2 === void 0 ? void 0 : _selection$licenseOpt2.name), /*#__PURE__*/_react.default.createElement(_VariableTableAmounts.default, {
+    variable: selection.licenseVariable,
+    option: selection.licenseOption
+  })) : (_selection$licenseOpt3 = selection.licenseOption) === null || _selection$licenseOpt3 === void 0 ? void 0 : _selection$licenseOpt3.amount, /*#__PURE__*/_react.default.createElement(_Icons.CarrotDown, null), /*#__PURE__*/_react.default.createElement("select", {
+    value: (_selection$licenseOpt4 = selection.licenseOption) === null || _selection$licenseOpt4 === void 0 ? void 0 : _selection$licenseOpt4.id,
+    onChange: handleSelectChange
+  }, (_variableOptions2 = variableOptions) === null || _variableOptions2 === void 0 ? void 0 : _variableOptions2.map((option, i) => {
+    var _selection$licenseVar3;
+    return /*#__PURE__*/_react.default.createElement("option", {
+      key: i,
+      value: option.id
+    }, ((_selection$licenseVar3 = selection.licenseVariable) === null || _selection$licenseVar3 === void 0 ? void 0 : _selection$licenseVar3.variableType) === 'table' ? option.name : option.amount);
+  }))) : /*#__PURE__*/_react.default.createElement(_VariableTextInput.default, {
+    defaultValue: selection.variableText,
+    placeholder: `${selection.licenseVariable.name} *`,
+    onChange: handleTextChange
+  }));
+}

package/dist/components/Cart/CartItem/VariableTextInput.d.ts

@@ -1,9 +1,7 @@
 import React from 'react';
 interface VariableTextInput_props {
     defaultValue: string | null;
-    onChange: (value: {
-        variableText: string | null | undefined;
-    }) => void;
+    onChange: (value: string) => void;
     placeholder: string;
 }
 export default function VariableTextInput({ defaultValue, onChange, placeholder, ...rest }: VariableTextInput_props): React.JSX.Element;

package/dist/components/Cart/CartItem/VariableTextInput.js

@@ -5,9 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = VariableTextInput;
 var _react = _interopRequireWildcard(require("react"));
-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; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : 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(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); }
 function VariableTextInput(_ref) {
   let {
     defaultValue,
@@ -23,9 +23,7 @@ function VariableTextInput(_ref) {
     setEditing(false);
     if (value) {
       if (defaultValue !== value) {
-        onChange({
-          variableText: value
-        });
+        onChange(value);
         setSubmitting(true);
       }
     } else {
@@ -33,6 +31,9 @@ function VariableTextInput(_ref) {
       setEditing(!defaultValue);
     }
   }
+  (0, _react.useEffect)(() => {
+    if (submitting && value === defaultValue) setSubmitting(false);
+  }, [submitting, setSubmitting, value, defaultValue]);
   function handleBlur() {
     submit();
   }

package/dist/components/Cart/CartItem/index.d.ts

@@ -4,6 +4,9 @@ import { CartItemChangeInput } from '../types';
 interface CartItem_props {
     node: CartItem_node$key;
     onChange: (value: CartItemChangeInput) => void;
+    errors?: {
+        [key: string]: string;
+    };
 }
-export default function CartItem({ node: nodeKey, onChange }: CartItem_props): React.JSX.Element | null;
+export default function CartItem({ node: nodeKey, onChange, errors }: CartItem_props): React.JSX.Element | null;
 export {};