@ndla/primitives 0.0.15 → 0.0.17

package/es/Button.js

@@ -11,6 +11,7 @@ import { ark } from "@ark-ui/react";
 import { css, cva } from "@ndla/styled-system/css";
 import { styled } from "@ndla/styled-system/jsx";
 import { jsx as _jsx } from "react/jsx-runtime";
+// TODO: Consider if any of the backgrounds should actually be transparent
 export const buttonBaseRecipe = cva({
   base: {
     display: "inline-flex",
@@ -67,7 +68,7 @@ export const buttonBaseRecipe = cva({
       },
       secondary: {
         color: "text.strong",
-        background: "transparent",
+        background: "surface.default",
         boxShadow: "inset 0 0 0 1px var(--shadow-color)",
         _hover: {
           background: "surface.actionSubtle.hover"

package/es/Figure.js

@@ -52,15 +52,13 @@ const figureRecipe = cva({
       left: {
         tablet: {
           float: "left",
-          clear: "left",
-          paddingInlineEnd: "medium"
+          clear: "left"
         }
       },
       right: {
         tablet: {
           float: "right",
-          clear: "right",
-          paddingInlineStart: "medium"
+          clear: "right"
         }
       }
     }
@@ -75,6 +73,25 @@ const figureRecipe = cva({
       left: "auto",
       marginBlock: "xsmall"
     }
+  }, {
+    float: "left",
+    size: ["medium", "small", "xsmall"],
+    css: {
+      paddingInlineEnd: "medium"
+    }
+  }, {
+    float: "right",
+    size: ["medium", "small", "xsmall"],
+    css: {
+      paddingInlineStart: "medium"
+    }
+  }, {
+    float: ["left", "right"],
+    size: ["full"],
+    css: {
+      paddingInlineStart: "0",
+      paddingInlineEnd: "0"
+    }
   }]
 });
 const StyledFigure = styled(ark.figure, {}, {

package/es/Image.js

@@ -0,0 +1,92 @@
+/**
+ * Copyright (c) 2024-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+import { forwardRef } from "react";
+import { styled } from "@ndla/styled-system/jsx";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export const makeSrcQueryString = (width, crop, focalPoint) => {
+  const widthParams = width && `width=${width}`;
+  const cropParams = crop && `cropStartX=${crop.startX}&cropEndX=${crop.endX}&cropStartY=${crop.startY}&cropEndY=${crop.endY}`;
+  const focalPointParams = focalPoint && `focalX=${focalPoint.x}&focalY=${focalPoint.y}`;
+  const params = [widthParams, cropParams, focalPointParams].filter(p => p).join("&");
+  return params;
+};
+export const getSrcSet = (src, crop, focalPoint) => {
+  const widths = [2720, 2080, 1760, 1440, 1120, 1000, 960, 800, 640, 480, 320, 240, 180];
+  return widths.map(width => `${src}?${makeSrcQueryString(width, crop, focalPoint)} ${width}w`).join(", ");
+};
+const FALLBACK_WIDTH = 1024;
+const FALLBACK_SIZES = "(min-width: 1024px) 1024px, 100vw";
+export const Picture = /*#__PURE__*/forwardRef((_ref, ref) => {
+  let {
+    children,
+    srcSet: srcSetProp,
+    crop,
+    focalPoint,
+    src,
+    contentType,
+    sizes = FALLBACK_SIZES,
+    ...props
+  } = _ref;
+  const srcSet = srcSetProp ?? getSrcSet(src, crop, focalPoint);
+  return /*#__PURE__*/_jsxs(styled.picture, {
+    ...props,
+    ref: ref,
+    children: [contentType !== "image/gif" && /*#__PURE__*/_jsx("source", {
+      type: contentType,
+      srcSet: srcSet,
+      sizes: sizes
+    }), children]
+  });
+});
+export const Img = /*#__PURE__*/forwardRef((_ref2, ref) => {
+  let {
+    fallbackWidth = FALLBACK_WIDTH,
+    crop,
+    focalPoint,
+    contentType,
+    src,
+    alt,
+    ...props
+  } = _ref2;
+  const queryString = makeSrcQueryString(fallbackWidth, crop, focalPoint);
+  return /*#__PURE__*/_jsx(styled.img, {
+    alt: alt,
+    src: contentType === "image/gif" ? src : `${src}?${queryString}`,
+    ...props,
+    ref: ref
+  });
+});
+export const Image = /*#__PURE__*/forwardRef((_ref3, ref) => {
+  let {
+    children,
+    srcSet: srcSetProp,
+    crop,
+    focalPoint,
+    src,
+    contentType,
+    fallbackWidth = FALLBACK_WIDTH,
+    sizes = FALLBACK_SIZES,
+    alt,
+    ...props
+  } = _ref3;
+  const srcSet = srcSetProp ?? getSrcSet(src, crop, focalPoint);
+  const queryString = makeSrcQueryString(fallbackWidth, crop, focalPoint);
+  return /*#__PURE__*/_jsxs("picture", {
+    children: [contentType !== "image/gif" && /*#__PURE__*/_jsx("source", {
+      type: contentType,
+      srcSet: srcSet,
+      sizes: sizes
+    }), /*#__PURE__*/_jsx(styled.img, {
+      alt: alt,
+      src: contentType === "image/gif" ? src : `${src}?${queryString}`,
+      ...props,
+      ref: ref
+    })]
+  });
+});

package/es/Input.js

@@ -141,7 +141,7 @@ export const TextArea = /*#__PURE__*/forwardRef((_ref3, ref) => {
   const resize = useCallback(() => {
     if (!localRef.current) return;
     localRef.current.style.height = "0";
-    localRef.current.style.height = "".concat(localRef.current.scrollHeight + 3, "px");
+    localRef.current.style.height = `${localRef.current.scrollHeight + 3}px`;
   }, []);
   useEffect(() => {
     window.addEventListener("input", resize);

package/es/createStyleContext.js

@@ -46,7 +46,7 @@ export const createStyleContext = recipe => {
         children: /*#__PURE__*/_jsx(StyledComponent, {
           ...otherProps,
           ref: ref,
-          css: css.raw(slotStyles === null || slotStyles === void 0 ? void 0 : slotStyles[slot], cssProp)
+          css: css.raw(slotStyles?.[slot], cssProp)
         })
       });
     });
@@ -65,7 +65,7 @@ export const createStyleContext = recipe => {
       return /*#__PURE__*/_jsx(StyledComponent, {
         ...props,
         ref: ref,
-        css: css.raw(slotStyles === null || slotStyles === void 0 ? void 0 : slotStyles[slot], cssProp)
+        css: css.raw(slotStyles?.[slot], cssProp)
       });
     });
   };

package/es/index.js

@@ -10,7 +10,7 @@ export { AccordionRoot, AccordionItemContent, AccordionItemIndicator, AccordionI
 export { OrderedList, UnOrderedList, DefinitionList } from "./ArticleLists";
 export { Badge } from "./Badge";
 export { BlockQuote } from "./BlockQuote";
-export { Button, IconButton } from "./Button";
+export { Button, IconButton, buttonBaseRecipe, buttonRecipe, iconButtonRecipe } from "./Button";
 export { CheckboxRoot, CheckboxIndicator, CheckboxLabel, CheckboxControl, CheckboxGroup, CheckboxHiddenInput } from "./Checkbox";
 export { ComboboxRoot, ComboboxClearTrigger, ComboboxContent, ComboboxControl, ComboboxInput, ComboboxItemGroupLabel, ComboboxItemGroup, ComboboxItemIndicator, ComboboxItem, ComboboxItemText, ComboboxLabel, ComboboxPositioner, ComboboxTrigger } from "./Combobox";
 export { DialogRoot, DialogBackdrop, DialogStandaloneContent, DialogPositioner, DialogContent, DialogDescription, DialogTitle, DialogTrigger, DialogCloseTrigger, DialogHeader, DialogBody } from "./Dialog";
@@ -20,6 +20,7 @@ export { FieldErrorMessage } from "./FieldErrorMessage";
 export { FieldHelper } from "./FieldHelper";
 export { Figure } from "./Figure";
 export { FramedContent } from "./FramedContent";
+export { Picture, Img, Image } from "./Image";
 export { Input, FieldInput, InputContainer, TextArea, FieldTextArea } from "./Input";
 export { Label, FieldLabel } from "./Label";
 export { MenuRoot, MenuContent, MenuItemGroupLabel, MenuItemGroup, MenuItem, MenuPositioner, MenuTriggerItem, MenuTrigger, MenuSeparator } from "./Menu";

package/lib/Button.d.ts

@@ -27,7 +27,7 @@ export declare const buttonBaseRecipe: import("@ndla/styled-system/types").Recip
         };
         secondary: {
             color: "text.strong";
-            background: "transparent";
+            background: "surface.default";
             boxShadow: "inset 0 0 0 1px var(--shadow-color)";
             _hover: {
                 background: "surface.actionSubtle.hover";

package/lib/Button.js

@@ -17,6 +17,7 @@ var _jsxRuntime = require("react/jsx-runtime");
  *
  */
 
+// TODO: Consider if any of the backgrounds should actually be transparent
 const buttonBaseRecipe = exports.buttonBaseRecipe = (0, _css.cva)({
   base: {
     display: "inline-flex",
@@ -73,7 +74,7 @@ const buttonBaseRecipe = exports.buttonBaseRecipe = (0, _css.cva)({
       },
       secondary: {
         color: "text.strong",
-        background: "transparent",
+        background: "surface.default",
         boxShadow: "inset 0 0 0 1px var(--shadow-color)",
         _hover: {
           background: "surface.actionSubtle.hover"

package/lib/Figure.d.ts

@@ -7,7 +7,7 @@
  */
 import { HTMLArkProps } from "@ark-ui/react";
 import { RecipeVariantProps } from "@ndla/styled-system/css";
-import { JsxStyleProps } from "@ndla/styled-system/types";
+import { JsxStyleProps, RecipeVariant } from "@ndla/styled-system/types";
 declare const figureRecipe: import("@ndla/styled-system/types").RecipeRuntimeFn<{
     size: {
         full: {
@@ -43,19 +43,19 @@ declare const figureRecipe: import("@ndla/styled-system/types").RecipeRuntimeFn<
             tablet: {
                 float: "left";
                 clear: "left";
-                paddingInlineEnd: "medium";
             };
         };
         right: {
             tablet: {
                 float: "right";
                 clear: "right";
-                paddingInlineStart: "medium";
             };
         };
     };
 }>;
 export type FigureVariantProps = RecipeVariantProps<typeof figureRecipe>;
+export type FigureSize = RecipeVariant<typeof figureRecipe>["size"];
+export type FigureFloat = RecipeVariant<typeof figureRecipe>["float"];
 export type FigureProps = HTMLArkProps<"figure"> & JsxStyleProps & FigureVariantProps;
 export declare const Figure: import("react").ForwardRefExoticComponent<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & import("@ark-ui/react").PolymorphicProps & {
     consumeCss?: boolean | undefined;

package/lib/Figure.js

@@ -58,15 +58,13 @@ const figureRecipe = (0, _css.cva)({
       left: {
         tablet: {
           float: "left",
-          clear: "left",
-          paddingInlineEnd: "medium"
+          clear: "left"
         }
       },
       right: {
         tablet: {
           float: "right",
-          clear: "right",
-          paddingInlineStart: "medium"
+          clear: "right"
         }
       }
     }
@@ -81,6 +79,25 @@ const figureRecipe = (0, _css.cva)({
       left: "auto",
       marginBlock: "xsmall"
     }
+  }, {
+    float: "left",
+    size: ["medium", "small", "xsmall"],
+    css: {
+      paddingInlineEnd: "medium"
+    }
+  }, {
+    float: "right",
+    size: ["medium", "small", "xsmall"],
+    css: {
+      paddingInlineStart: "medium"
+    }
+  }, {
+    float: ["left", "right"],
+    size: ["full"],
+    css: {
+      paddingInlineStart: "0",
+      paddingInlineEnd: "0"
+    }
   }]
 });
 const StyledFigure = (0, _jsx2.styled)(_react2.ark.figure, {}, {

package/lib/Image.d.ts

@@ -0,0 +1,49 @@
+/**
+ * Copyright (c) 2024-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+import { ComponentPropsWithRef } from "react";
+import { JsxStyleProps } from "@ndla/styled-system/types";
+export interface ImageCrop {
+    startX: number;
+    startY: number;
+    endX: number;
+    endY: number;
+}
+export interface ImageFocalPoint {
+    x: number;
+    y: number;
+}
+export declare const makeSrcQueryString: (width: number | undefined, crop?: ImageCrop, focalPoint?: ImageFocalPoint) => string;
+export declare const getSrcSet: (src: string, crop: ImageCrop | undefined, focalPoint: ImageFocalPoint | undefined) => string;
+export interface PictureProps extends JsxStyleProps, ComponentPropsWithRef<"picture"> {
+    src: string;
+    sizes?: string;
+    contentType?: string;
+    srcSet?: string;
+    crop?: ImageCrop;
+    focalPoint?: ImageFocalPoint;
+}
+export declare const Picture: import("react").ForwardRefExoticComponent<Omit<PictureProps, "ref"> & import("react").RefAttributes<HTMLPictureElement>>;
+export interface ImgProps extends JsxStyleProps, ComponentPropsWithRef<"img"> {
+    alt: string;
+    src: string;
+    fallbackWidth?: number;
+    contentType?: string;
+    crop?: ImageCrop;
+    focalPoint?: ImageFocalPoint;
+}
+export declare const Img: import("react").ForwardRefExoticComponent<Omit<ImgProps, "ref"> & import("react").RefAttributes<HTMLImageElement>>;
+export interface ImageProps extends JsxStyleProps, ComponentPropsWithRef<"img"> {
+    alt: string;
+    src: string;
+    sizes?: string;
+    fallbackWidth?: number;
+    contentType?: string;
+    crop?: ImageCrop;
+    focalPoint?: ImageFocalPoint;
+}
+export declare const Image: import("react").ForwardRefExoticComponent<Omit<ImageProps, "ref"> & import("react").RefAttributes<HTMLImageElement>>;

package/lib/Image.js

@@ -0,0 +1,100 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.makeSrcQueryString = exports.getSrcSet = exports.Picture = exports.Img = exports.Image = void 0;
+var _react = require("react");
+var _jsx2 = require("@ndla/styled-system/jsx");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * Copyright (c) 2024-present, NDLA.
+ *
+ * This source code is licensed under the GPLv3 license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ */
+
+const makeSrcQueryString = (width, crop, focalPoint) => {
+  const widthParams = width && `width=${width}`;
+  const cropParams = crop && `cropStartX=${crop.startX}&cropEndX=${crop.endX}&cropStartY=${crop.startY}&cropEndY=${crop.endY}`;
+  const focalPointParams = focalPoint && `focalX=${focalPoint.x}&focalY=${focalPoint.y}`;
+  const params = [widthParams, cropParams, focalPointParams].filter(p => p).join("&");
+  return params;
+};
+exports.makeSrcQueryString = makeSrcQueryString;
+const getSrcSet = (src, crop, focalPoint) => {
+  const widths = [2720, 2080, 1760, 1440, 1120, 1000, 960, 800, 640, 480, 320, 240, 180];
+  return widths.map(width => `${src}?${makeSrcQueryString(width, crop, focalPoint)} ${width}w`).join(", ");
+};
+exports.getSrcSet = getSrcSet;
+const FALLBACK_WIDTH = 1024;
+const FALLBACK_SIZES = "(min-width: 1024px) 1024px, 100vw";
+const Picture = exports.Picture = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
+  let {
+    children,
+    srcSet: srcSetProp,
+    crop,
+    focalPoint,
+    src,
+    contentType,
+    sizes = FALLBACK_SIZES,
+    ...props
+  } = _ref;
+  const srcSet = srcSetProp ?? getSrcSet(src, crop, focalPoint);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_jsx2.styled.picture, {
+    ...props,
+    ref: ref,
+    children: [contentType !== "image/gif" && /*#__PURE__*/(0, _jsxRuntime.jsx)("source", {
+      type: contentType,
+      srcSet: srcSet,
+      sizes: sizes
+    }), children]
+  });
+});
+const Img = exports.Img = /*#__PURE__*/(0, _react.forwardRef)((_ref2, ref) => {
+  let {
+    fallbackWidth = FALLBACK_WIDTH,
+    crop,
+    focalPoint,
+    contentType,
+    src,
+    alt,
+    ...props
+  } = _ref2;
+  const queryString = makeSrcQueryString(fallbackWidth, crop, focalPoint);
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsx2.styled.img, {
+    alt: alt,
+    src: contentType === "image/gif" ? src : `${src}?${queryString}`,
+    ...props,
+    ref: ref
+  });
+});
+const Image = exports.Image = /*#__PURE__*/(0, _react.forwardRef)((_ref3, ref) => {
+  let {
+    children,
+    srcSet: srcSetProp,
+    crop,
+    focalPoint,
+    src,
+    contentType,
+    fallbackWidth = FALLBACK_WIDTH,
+    sizes = FALLBACK_SIZES,
+    alt,
+    ...props
+  } = _ref3;
+  const srcSet = srcSetProp ?? getSrcSet(src, crop, focalPoint);
+  const queryString = makeSrcQueryString(fallbackWidth, crop, focalPoint);
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("picture", {
+    children: [contentType !== "image/gif" && /*#__PURE__*/(0, _jsxRuntime.jsx)("source", {
+      type: contentType,
+      srcSet: srcSet,
+      sizes: sizes
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_jsx2.styled.img, {
+      alt: alt,
+      src: contentType === "image/gif" ? src : `${src}?${queryString}`,
+      ...props,
+      ref: ref
+    })]
+  });
+});

package/lib/Input.js

@@ -147,7 +147,7 @@ const TextArea = exports.TextArea = /*#__PURE__*/(0, _react.forwardRef)((_ref3,
   const resize = (0, _react.useCallback)(() => {
     if (!localRef.current) return;
     localRef.current.style.height = "0";
-    localRef.current.style.height = "".concat(localRef.current.scrollHeight + 3, "px");
+    localRef.current.style.height = `${localRef.current.scrollHeight + 3}px`;
   }, []);
   (0, _react.useEffect)(() => {
     window.addEventListener("input", resize);

package/lib/createStyleContext.js

@@ -52,7 +52,7 @@ const createStyleContext = recipe => {
         children: /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComponent, {
           ...otherProps,
           ref: ref,
-          css: _css.css.raw(slotStyles === null || slotStyles === void 0 ? void 0 : slotStyles[slot], cssProp)
+          css: _css.css.raw(slotStyles?.[slot], cssProp)
         })
       });
     });
@@ -71,7 +71,7 @@ const createStyleContext = recipe => {
       return /*#__PURE__*/(0, _jsxRuntime.jsx)(StyledComponent, {
         ...props,
         ref: ref,
-        css: _css.css.raw(slotStyles === null || slotStyles === void 0 ? void 0 : slotStyles[slot], cssProp)
+        css: _css.css.raw(slotStyles?.[slot], cssProp)
       });
     });
   };

package/lib/index.d.ts

@@ -14,7 +14,7 @@ export { Badge } from "./Badge";
 export type { BlockQuoteVariantProps, BlockQuoteProps } from "./BlockQuote";
 export { BlockQuote } from "./BlockQuote";
 export type { ButtonProps, ButtonVariantProps, IconButtonProps, IconButtonVariantProps } from "./Button";
-export { Button, IconButton } from "./Button";
+export { Button, IconButton, buttonBaseRecipe, buttonRecipe, iconButtonRecipe } from "./Button";
 export type { CheckboxVariantProps, CheckboxRootProps } from "./Checkbox";
 export { CheckboxRoot, CheckboxIndicator, CheckboxLabel, CheckboxControl, CheckboxGroup, CheckboxHiddenInput, } from "./Checkbox";
 export type { ComboboxVariantProps, ComboboxRootProps } from "./Combobox";
@@ -26,9 +26,12 @@ export { ExpandableBox, ExpandableBoxSummary } from "./ExpandableBox";
 export { FieldRoot } from "./Field";
 export { FieldErrorMessage } from "./FieldErrorMessage";
 export { FieldHelper } from "./FieldHelper";
+export type { FigureSize, FigureVariantProps, FigureProps, FigureFloat } from "./Figure";
 export { Figure } from "./Figure";
 export type { FramedContentVariantProps, FramedContentProps } from "./FramedContent";
 export { FramedContent } from "./FramedContent";
+export type { ImageCrop, ImageFocalPoint, PictureProps, ImgProps, ImageProps } from "./Image";
+export { Picture, Img, Image } from "./Image";
 export { Input, FieldInput, InputContainer, TextArea, FieldTextArea } from "./Input";
 export type { LabelProps } from "./Label";
 export { Label, FieldLabel } from "./Label";

package/lib/index.js

@@ -309,6 +309,18 @@ Object.defineProperty(exports, "IconButton", {
     return _Button.IconButton;
   }
 });
+Object.defineProperty(exports, "Image", {
+  enumerable: true,
+  get: function () {
+    return _Image.Image;
+  }
+});
+Object.defineProperty(exports, "Img", {
+  enumerable: true,
+  get: function () {
+    return _Image.Img;
+  }
+});
 Object.defineProperty(exports, "Input", {
   enumerable: true,
   get: function () {
@@ -441,6 +453,12 @@ Object.defineProperty(exports, "PaginationRoot", {
     return _Pagination.PaginationRoot;
   }
 });
+Object.defineProperty(exports, "Picture", {
+  enumerable: true,
+  get: function () {
+    return _Image.Picture;
+  }
+});
 Object.defineProperty(exports, "PopoverAnchor", {
   enumerable: true,
   get: function () {
@@ -915,6 +933,24 @@ Object.defineProperty(exports, "UnOrderedList", {
     return _ArticleLists.UnOrderedList;
   }
 });
+Object.defineProperty(exports, "buttonBaseRecipe", {
+  enumerable: true,
+  get: function () {
+    return _Button.buttonBaseRecipe;
+  }
+});
+Object.defineProperty(exports, "buttonRecipe", {
+  enumerable: true,
+  get: function () {
+    return _Button.buttonRecipe;
+  }
+});
+Object.defineProperty(exports, "iconButtonRecipe", {
+  enumerable: true,
+  get: function () {
+    return _Button.iconButtonRecipe;
+  }
+});
 var _Accordion = require("./Accordion");
 var _ArticleLists = require("./ArticleLists");
 var _Badge = require("./Badge");
@@ -929,6 +965,7 @@ var _FieldErrorMessage = require("./FieldErrorMessage");
 var _FieldHelper = require("./FieldHelper");
 var _Figure = require("./Figure");
 var _FramedContent = require("./FramedContent");
+var _Image = require("./Image");
 var _Input = require("./Input");
 var _Label = require("./Label");
 var _Menu = require("./Menu");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ndla/primitives",
-  "version": "0.0.15",
+  "version": "0.0.17",
   "description": "Primitive components for NDLA.",
   "license": "GPL-3.0",
   "main": "lib/index.js",
@@ -29,12 +29,12 @@
   ],
   "dependencies": {
     "@ark-ui/react": "^3.5.0",
-    "@ndla/styled-system": "^0.0.6",
+    "@ndla/styled-system": "^0.0.8",
     "@ndla/util": "^4.1.0"
   },
   "devDependencies": {
-    "@ndla/preset-panda": "^0.0.8",
-    "@pandacss/dev": "^0.41.0"
+    "@ndla/preset-panda": "^0.0.10",
+    "@pandacss/dev": "^0.42.0"
   },
   "peerDependencies": {
     "react": ">= 18",
@@ -43,5 +43,5 @@
   "publishConfig": {
     "access": "public"
   },
-  "gitHead": "4ac0e49e0801e6ec6dae57ea37b5af9ab9b882e7"
+  "gitHead": "93dde6fe4aaca52642f8fa0a27f4acad359207cb"
 }