@procore/core-react 12.14.0 → 12.16.0

package/dist/Typography/Typography.styles.d.ts

@@ -1,7 +1,8 @@
 import type { FlattenSimpleInterpolation } from 'styled-components';
 import type { Intent, TypographyProps, Weight } from './Typography.types';
-export interface StyledTypographyProps extends Omit<TypographyProps, 'color'> {
+export interface StyledTypographyProps extends Omit<TypographyProps, 'color' | 'breakWord'> {
     $color?: TypographyProps['color'];
+    $breakWord?: boolean;
 }
 export declare const typographyWeights: {
     [key in Weight]: number;

package/dist/Typography/Typography.styles.js

@@ -35,7 +35,7 @@ export var semiboldRules = function semiboldRules() {
 };
 export var StyledTypography = /*#__PURE__*/styled.span.withConfig({
   displayName: "StyledTypography",
-  componentId: "core-12_14_0__sc-1c4583t-0"
+  componentId: "core-12_16_0__sc-1c4583t-0"
 })(["", " color:", ";font-style:", ";font-weight:", ";", " ", " em,i{font-style:italic;}"], function (_ref) {
   var _ref$intent = _ref.intent,
     intent = _ref$intent === void 0 ? 'body' : _ref$intent;
@@ -52,7 +52,7 @@ export var StyledTypography = /*#__PURE__*/styled.span.withConfig({
   var weight = _ref4.weight;
   return weight && typographyWeights[weight];
 }, semiboldRules, function (_ref5) {
-  var breakWord = _ref5.breakWord;
-  return breakWord && "\n  word-wrap: break-word;\n  word-break: break-word;\n";
+  var $breakWord = _ref5.$breakWord;
+  return $breakWord && "\n  word-wrap: break-word;\n  word-break: break-word;\n";
 });
 //# sourceMappingURL=Typography.styles.js.map

package/dist/Typography/Typography.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Typography.styles.js","names":["styled","css","colors","typographyWeights","regular","semibold","bold","typographyLineHeight","small","body","h1","h2","h3","label","typographyIntents","getTypographyIntent","intent","semiboldRules","StyledTypography","span","withConfig","displayName","componentId","_ref","_ref$intent","_ref2","_ref2$$color","$color","_ref3","_ref3$italic","italic","_ref4","weight","_ref5","breakWord"],"sources":["../../src/Typography/Typography.styles.ts"],"sourcesContent":["import type { FlattenSimpleInterpolation } from 'styled-components'\nimport styled, { css } from 'styled-components'\nimport { colors } from '../_styles/colors'\nimport type { Intent, TypographyProps, Weight } from './Typography.types'\n\nexport interface StyledTypographyProps extends Omit<TypographyProps, 'color'> {\n  $color?: TypographyProps['color']\n}\n\nexport const typographyWeights: {\n  [key in Weight]: number\n} = {\n  regular: 400,\n  semibold: 600,\n  bold: 700,\n}\n\nexport const typographyLineHeight: Record<Intent, number> = {\n  small: 16,\n  body: 20,\n  h1: 32,\n  h2: 28,\n  h3: 24,\n  label: 20,\n}\n\nconst body = css`\n  font-family: inherit;\n  font-size: 14px;\n  font-weight: ${typographyWeights.regular};\n  letter-spacing: 0.15px;\n  line-height: ${typographyLineHeight.body}px;\n`\n\nconst h1 = css`\n  font-family: inherit;\n  font-size: 24px;\n  font-weight: ${typographyWeights.bold};\n  letter-spacing: 0.15px;\n  line-height: ${typographyLineHeight.h1}px;\n`\n\nconst h2 = css`\n  font-family: inherit;\n  font-size: 20px;\n  font-weight: ${typographyWeights.semibold};\n  letter-spacing: 0.15px;\n  line-height: ${typographyLineHeight.h2}px;\n`\n\nconst h3 = css`\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: ${typographyWeights.semibold};\n  letter-spacing: 0.15px;\n  line-height: ${typographyLineHeight.h3}px;\n`\n\nconst small = css`\n  font-family: inherit;\n  font-size: 12px;\n  font-weight: ${typographyWeights.regular};\n  letter-spacing: 0.25px;\n  line-height: ${typographyLineHeight.small}px;\n`\n\nconst label = css`\n  font-family: inherit;\n  font-size: 14px;\n  font-weight: ${typographyWeights.semibold};\n  letter-spacing: 0.15px;\n  line-height: ${typographyLineHeight.label}px;\n`\n\nconst typographyIntents: {\n  [key in Intent]: FlattenSimpleInterpolation\n} = {\n  body,\n  h1,\n  h2,\n  h3,\n  small,\n  label,\n}\n\nexport function getTypographyIntent(intent: Intent) {\n  return typographyIntents[intent]\n}\n\nexport const semiboldRules = () => {\n  return css`\n    & > strong,\n    > b {\n      font-weight: 600;\n    }\n  `\n}\n\nexport const StyledTypography = styled.span<StyledTypographyProps>`\n  ${({ intent = 'body' }) => typographyIntents[intent]}\n  color: ${({ $color = 'gray15' }) => colors[$color]};\n  font-style: ${({ italic = false }) => (italic ? 'italic' : 'inherit')};\n  font-weight: ${({ weight }) => weight && typographyWeights[weight]};\n  ${semiboldRules}\n  ${({ breakWord }) =>\n    breakWord &&\n    `\n  word-wrap: break-word;\n  word-break: break-word;\n`}\n  em,\n  i {\n    font-style: italic;\n  }\n`\n"],"mappings":"AACA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,MAAM,QAAQ,mBAAmB;AAO1C,OAAO,IAAMC,iBAEZ,GAAG;EACFC,OAAO,EAAE,GAAG;EACZC,QAAQ,EAAE,GAAG;EACbC,IAAI,EAAE;AACR,CAAC;AAED,OAAO,IAAMC,oBAA4C,GAAG;EAC1DC,KAAK,EAAE,EAAE;EACTC,IAAI,EAAE,EAAE;EACRC,EAAE,EAAE,EAAE;EACNC,EAAE,EAAE,EAAE;EACNC,EAAE,EAAE,EAAE;EACNC,KAAK,EAAE;AACT,CAAC;AAED,IAAMJ,IAAI,gBAAGR,GAAG,oGAGCE,iBAAiB,CAACC,OAAO,EAEzBG,oBAAoB,CAACE,IAAI,CACzC;AAED,IAAMC,EAAE,gBAAGT,GAAG,oGAGGE,iBAAiB,CAACG,IAAI,EAEtBC,oBAAoB,CAACG,EAAE,CACvC;AAED,IAAMC,EAAE,gBAAGV,GAAG,oGAGGE,iBAAiB,CAACE,QAAQ,EAE1BE,oBAAoB,CAACI,EAAE,CACvC;AAED,IAAMC,EAAE,gBAAGX,GAAG,oGAGGE,iBAAiB,CAACE,QAAQ,EAE1BE,oBAAoB,CAACK,EAAE,CACvC;AAED,IAAMJ,KAAK,gBAAGP,GAAG,oGAGAE,iBAAiB,CAACC,OAAO,EAEzBG,oBAAoB,CAACC,KAAK,CAC1C;AAED,IAAMK,KAAK,gBAAGZ,GAAG,oGAGAE,iBAAiB,CAACE,QAAQ,EAE1BE,oBAAoB,CAACM,KAAK,CAC1C;AAED,IAAMC,iBAEL,GAAG;EACFL,IAAI,EAAJA,IAAI;EACJC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFJ,KAAK,EAALA,KAAK;EACLK,KAAK,EAALA;AACF,CAAC;AAED,OAAO,SAASE,mBAAmBA,CAACC,MAAc,EAAE;EAClD,OAAOF,iBAAiB,CAACE,MAAM,CAAC;AAClC;AAEA,OAAO,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,CAAA,EAAS;EACjC,OAAOhB,GAAG;AAMZ,CAAC;AAED,OAAO,IAAMiB,gBAAgB,gBAAGlB,MAAM,CAACmB,IAAI,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,4FACvC,UAAAC,IAAA;EAAA,IAAAC,WAAA,GAAAD,IAAA,CAAGP,MAAM;IAANA,MAAM,GAAAQ,WAAA,cAAG,MAAM,GAAAA,WAAA;EAAA,OAAOV,iBAAiB,CAACE,MAAM,CAAC;AAAA,GAC3C,UAAAS,KAAA;EAAA,IAAAC,YAAA,GAAAD,KAAA,CAAGE,MAAM;IAANA,MAAM,GAAAD,YAAA,cAAG,QAAQ,GAAAA,YAAA;EAAA,OAAOxB,MAAM,CAACyB,MAAM,CAAC;AAAA,GACpC,UAAAC,KAAA;EAAA,IAAAC,YAAA,GAAAD,KAAA,CAAGE,MAAM;IAANA,MAAM,GAAAD,YAAA,cAAG,KAAK,GAAAA,YAAA;EAAA,OAAQC,MAAM,GAAG,QAAQ,GAAG,SAAS;AAAA,CAAC,EACtD,UAAAC,KAAA;EAAA,IAAGC,MAAM,GAAAD,KAAA,CAANC,MAAM;EAAA,OAAOA,MAAM,IAAI7B,iBAAiB,CAAC6B,MAAM,CAAC;AAAA,GAChEf,aAAa,EACb,UAAAgB,KAAA;EAAA,IAAGC,SAAS,GAAAD,KAAA,CAATC,SAAS;EAAA,OACZA,SAAS,6DAIZ;AAAA,EAKA"}
+{"version":3,"file":"Typography.styles.js","names":["styled","css","colors","typographyWeights","regular","semibold","bold","typographyLineHeight","small","body","h1","h2","h3","label","typographyIntents","getTypographyIntent","intent","semiboldRules","StyledTypography","span","withConfig","displayName","componentId","_ref","_ref$intent","_ref2","_ref2$$color","$color","_ref3","_ref3$italic","italic","_ref4","weight","_ref5","$breakWord"],"sources":["../../src/Typography/Typography.styles.ts"],"sourcesContent":["import type { FlattenSimpleInterpolation } from 'styled-components'\nimport styled, { css } from 'styled-components'\nimport { colors } from '../_styles/colors'\nimport type { Intent, TypographyProps, Weight } from './Typography.types'\n\nexport interface StyledTypographyProps\n  extends Omit<TypographyProps, 'color' | 'breakWord'> {\n  $color?: TypographyProps['color']\n  $breakWord?: boolean\n}\n\nexport const typographyWeights: {\n  [key in Weight]: number\n} = {\n  regular: 400,\n  semibold: 600,\n  bold: 700,\n}\n\nexport const typographyLineHeight: Record<Intent, number> = {\n  small: 16,\n  body: 20,\n  h1: 32,\n  h2: 28,\n  h3: 24,\n  label: 20,\n}\n\nconst body = css`\n  font-family: inherit;\n  font-size: 14px;\n  font-weight: ${typographyWeights.regular};\n  letter-spacing: 0.15px;\n  line-height: ${typographyLineHeight.body}px;\n`\n\nconst h1 = css`\n  font-family: inherit;\n  font-size: 24px;\n  font-weight: ${typographyWeights.bold};\n  letter-spacing: 0.15px;\n  line-height: ${typographyLineHeight.h1}px;\n`\n\nconst h2 = css`\n  font-family: inherit;\n  font-size: 20px;\n  font-weight: ${typographyWeights.semibold};\n  letter-spacing: 0.15px;\n  line-height: ${typographyLineHeight.h2}px;\n`\n\nconst h3 = css`\n  font-family: inherit;\n  font-size: 16px;\n  font-weight: ${typographyWeights.semibold};\n  letter-spacing: 0.15px;\n  line-height: ${typographyLineHeight.h3}px;\n`\n\nconst small = css`\n  font-family: inherit;\n  font-size: 12px;\n  font-weight: ${typographyWeights.regular};\n  letter-spacing: 0.25px;\n  line-height: ${typographyLineHeight.small}px;\n`\n\nconst label = css`\n  font-family: inherit;\n  font-size: 14px;\n  font-weight: ${typographyWeights.semibold};\n  letter-spacing: 0.15px;\n  line-height: ${typographyLineHeight.label}px;\n`\n\nconst typographyIntents: {\n  [key in Intent]: FlattenSimpleInterpolation\n} = {\n  body,\n  h1,\n  h2,\n  h3,\n  small,\n  label,\n}\n\nexport function getTypographyIntent(intent: Intent) {\n  return typographyIntents[intent]\n}\n\nexport const semiboldRules = () => {\n  return css`\n    & > strong,\n    > b {\n      font-weight: 600;\n    }\n  `\n}\n\nexport const StyledTypography = styled.span<StyledTypographyProps>`\n  ${({ intent = 'body' }) => typographyIntents[intent]}\n  color: ${({ $color = 'gray15' }) => colors[$color]};\n  font-style: ${({ italic = false }) => (italic ? 'italic' : 'inherit')};\n  font-weight: ${({ weight }) => weight && typographyWeights[weight]};\n  ${semiboldRules}\n  ${({ $breakWord }) =>\n    $breakWord &&\n    `\n  word-wrap: break-word;\n  word-break: break-word;\n`}\n  em,\n  i {\n    font-style: italic;\n  }\n`\n"],"mappings":"AACA,OAAOA,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAC/C,SAASC,MAAM,QAAQ,mBAAmB;AAS1C,OAAO,IAAMC,iBAEZ,GAAG;EACFC,OAAO,EAAE,GAAG;EACZC,QAAQ,EAAE,GAAG;EACbC,IAAI,EAAE;AACR,CAAC;AAED,OAAO,IAAMC,oBAA4C,GAAG;EAC1DC,KAAK,EAAE,EAAE;EACTC,IAAI,EAAE,EAAE;EACRC,EAAE,EAAE,EAAE;EACNC,EAAE,EAAE,EAAE;EACNC,EAAE,EAAE,EAAE;EACNC,KAAK,EAAE;AACT,CAAC;AAED,IAAMJ,IAAI,gBAAGR,GAAG,oGAGCE,iBAAiB,CAACC,OAAO,EAEzBG,oBAAoB,CAACE,IAAI,CACzC;AAED,IAAMC,EAAE,gBAAGT,GAAG,oGAGGE,iBAAiB,CAACG,IAAI,EAEtBC,oBAAoB,CAACG,EAAE,CACvC;AAED,IAAMC,EAAE,gBAAGV,GAAG,oGAGGE,iBAAiB,CAACE,QAAQ,EAE1BE,oBAAoB,CAACI,EAAE,CACvC;AAED,IAAMC,EAAE,gBAAGX,GAAG,oGAGGE,iBAAiB,CAACE,QAAQ,EAE1BE,oBAAoB,CAACK,EAAE,CACvC;AAED,IAAMJ,KAAK,gBAAGP,GAAG,oGAGAE,iBAAiB,CAACC,OAAO,EAEzBG,oBAAoB,CAACC,KAAK,CAC1C;AAED,IAAMK,KAAK,gBAAGZ,GAAG,oGAGAE,iBAAiB,CAACE,QAAQ,EAE1BE,oBAAoB,CAACM,KAAK,CAC1C;AAED,IAAMC,iBAEL,GAAG;EACFL,IAAI,EAAJA,IAAI;EACJC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFC,EAAE,EAAFA,EAAE;EACFJ,KAAK,EAALA,KAAK;EACLK,KAAK,EAALA;AACF,CAAC;AAED,OAAO,SAASE,mBAAmBA,CAACC,MAAc,EAAE;EAClD,OAAOF,iBAAiB,CAACE,MAAM,CAAC;AAClC;AAEA,OAAO,IAAMC,aAAa,GAAG,SAAhBA,aAAaA,CAAA,EAAS;EACjC,OAAOhB,GAAG;AAMZ,CAAC;AAED,OAAO,IAAMiB,gBAAgB,gBAAGlB,MAAM,CAACmB,IAAI,CAAAC,UAAA;EAAAC,WAAA;EAAAC,WAAA;AAAA,4FACvC,UAAAC,IAAA;EAAA,IAAAC,WAAA,GAAAD,IAAA,CAAGP,MAAM;IAANA,MAAM,GAAAQ,WAAA,cAAG,MAAM,GAAAA,WAAA;EAAA,OAAOV,iBAAiB,CAACE,MAAM,CAAC;AAAA,GAC3C,UAAAS,KAAA;EAAA,IAAAC,YAAA,GAAAD,KAAA,CAAGE,MAAM;IAANA,MAAM,GAAAD,YAAA,cAAG,QAAQ,GAAAA,YAAA;EAAA,OAAOxB,MAAM,CAACyB,MAAM,CAAC;AAAA,GACpC,UAAAC,KAAA;EAAA,IAAAC,YAAA,GAAAD,KAAA,CAAGE,MAAM;IAANA,MAAM,GAAAD,YAAA,cAAG,KAAK,GAAAA,YAAA;EAAA,OAAQC,MAAM,GAAG,QAAQ,GAAG,SAAS;AAAA,CAAC,EACtD,UAAAC,KAAA;EAAA,IAAGC,MAAM,GAAAD,KAAA,CAANC,MAAM;EAAA,OAAOA,MAAM,IAAI7B,iBAAiB,CAAC6B,MAAM,CAAC;AAAA,GAChEf,aAAa,EACb,UAAAgB,KAAA;EAAA,IAAGC,UAAU,GAAAD,KAAA,CAAVC,UAAU;EAAA,OACbA,UAAU,6DAIb;AAAA,EAKA"}

package/dist/Typography/Typography.table.story.js

@@ -5,11 +5,11 @@ import { colors } from '../_styles/colors';
 import { getTypographyIntent } from './Typography.styles';
 var StyledBodyCell = /*#__PURE__*/styled(Table.BodyCell).withConfig({
   displayName: "StyledBodyCell",
-  componentId: "core-12_14_0__sc-p4v7d-0"
+  componentId: "core-12_16_0__sc-p4v7d-0"
 })([""]);
 var StyledTextCell = /*#__PURE__*/styled(Table.TextCell).withConfig({
   displayName: "StyledTextCell",
-  componentId: "core-12_14_0__sc-p4v7d-1"
+  componentId: "core-12_16_0__sc-p4v7d-1"
 })(["", " color:", ";"], getTypographyIntent('body'), colors.blue50);
 function BodyCell() {
   return /*#__PURE__*/React.createElement(StyledBodyCell, {

package/dist/_hooks/useCurrentMedia.d.ts

@@ -0,0 +1,36 @@
+export declare type BreakpointName = 'mobile' | 'tabletPortrait' | 'tabletLandscape' | 'desktop';
+declare type MediaValueConfig = Record<BreakpointName, number>;
+/**
+ * Minimum size for that breakpoint to be active
+ */
+export declare const breakpointsMinSize: MediaValueConfig;
+/**
+ * Maximum size for that breakpoint to be active
+ */
+export declare const breakpointsMaxSize: MediaValueConfig;
+declare type BreakpointMediaQueryList = Record<BreakpointName, string>;
+export declare const defaultMediaConfig: {
+    mobile: string;
+    tabletPortrait: string;
+    tabletLandscape: string;
+    desktop: string;
+};
+/**
+ * Point in time check if matching a specific breakpoint
+ */
+export declare function getCurrentMedia(config?: BreakpointMediaQueryList): {
+    isMobile: boolean;
+    isTabletPortrait: boolean;
+    isTabletLandscape: boolean;
+    isDesktop: boolean;
+};
+/**
+ * Reactive check if matching a specific breakpoint
+ */
+export declare function useCurrentMedia(): {
+    isMobile: boolean;
+    isTabletPortrait: boolean;
+    isTabletLandscape: boolean;
+    isDesktop: boolean;
+};
+export {};

package/dist/_hooks/useCurrentMedia.js

@@ -0,0 +1,73 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+/* eslint-disable no-magic-numbers */
+import React from 'react';
+/**
+ * Minimum size for that breakpoint to be active
+ */
+export var breakpointsMinSize = {
+  mobile: 0,
+  tabletPortrait: 768,
+  tabletLandscape: 1024,
+  desktop: 1440
+};
+
+/**
+ * Maximum size for that breakpoint to be active
+ */
+export var breakpointsMaxSize = {
+  mobile: breakpointsMinSize.tabletPortrait - 1,
+  tabletPortrait: breakpointsMinSize.tabletLandscape - 1,
+  tabletLandscape: breakpointsMinSize.desktop - 1,
+  // setting to Infinity messes with matchMedia queries
+  // getMediaQueryString would have to check and adjust the string
+  desktop: breakpointsMinSize.desktop + 10000
+};
+export var defaultMediaConfig = {
+  mobile: "(width <= ".concat(breakpointsMaxSize.mobile, "px)"),
+  tabletPortrait: "(".concat(breakpointsMinSize.tabletPortrait, "px <= width <= ").concat(breakpointsMaxSize.tabletPortrait, "px)"),
+  tabletLandscape: "(".concat(breakpointsMinSize.tabletLandscape, "px <= width <= ").concat(breakpointsMaxSize.tabletLandscape, "px)"),
+  desktop: "(min-width: ".concat(breakpointsMinSize.desktop, "px)")
+};
+
+/**
+ * Point in time check if matching a specific breakpoint
+ */
+export function getCurrentMedia() {
+  var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : defaultMediaConfig;
+  var isMobile = window.matchMedia(config.mobile).matches;
+  var isTabletPortrait = window.matchMedia(config.tabletPortrait).matches;
+  var isTabletLandscape = window.matchMedia(config.tabletLandscape).matches;
+  var isDesktop = window.matchMedia(config.desktop).matches;
+  return {
+    isMobile: isMobile,
+    isTabletPortrait: isTabletPortrait,
+    isTabletLandscape: isTabletLandscape,
+    isDesktop: isDesktop
+  };
+}
+
+/**
+ * Reactive check if matching a specific breakpoint
+ */
+export function useCurrentMedia() {
+  var _React$useState = React.useState(getCurrentMedia()),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    currentMedia = _React$useState2[0],
+    setCurrentMedia = _React$useState2[1];
+  React.useEffect(function () {
+    function handleResize() {
+      setCurrentMedia(getCurrentMedia());
+    }
+    window.addEventListener('resize', handleResize);
+    return function () {
+      return window.removeEventListener('resize', handleResize);
+    };
+  }, []);
+  return currentMedia;
+}
+//# sourceMappingURL=useCurrentMedia.js.map

package/dist/_hooks/useCurrentMedia.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useCurrentMedia.js","names":["React","breakpointsMinSize","mobile","tabletPortrait","tabletLandscape","desktop","breakpointsMaxSize","defaultMediaConfig","concat","getCurrentMedia","config","arguments","length","undefined","isMobile","window","matchMedia","matches","isTabletPortrait","isTabletLandscape","isDesktop","useCurrentMedia","_React$useState","useState","_React$useState2","_slicedToArray","currentMedia","setCurrentMedia","useEffect","handleResize","addEventListener","removeEventListener"],"sources":["../../src/_hooks/useCurrentMedia.ts"],"sourcesContent":["/* eslint-disable no-magic-numbers */\nimport React from 'react'\n\nexport type BreakpointName =\n  | 'mobile'\n  | 'tabletPortrait'\n  | 'tabletLandscape'\n  | 'desktop'\n\ntype MediaValueConfig = Record<BreakpointName, number>\n\n/**\n * Minimum size for that breakpoint to be active\n */\nexport const breakpointsMinSize: MediaValueConfig = {\n  mobile: 0,\n  tabletPortrait: 768,\n  tabletLandscape: 1024,\n  desktop: 1440,\n}\n\n/**\n * Maximum size for that breakpoint to be active\n */\nexport const breakpointsMaxSize: MediaValueConfig = {\n  mobile: breakpointsMinSize.tabletPortrait - 1,\n  tabletPortrait: breakpointsMinSize.tabletLandscape - 1,\n  tabletLandscape: breakpointsMinSize.desktop - 1,\n  // setting to Infinity messes with matchMedia queries\n  // getMediaQueryString would have to check and adjust the string\n  desktop: breakpointsMinSize.desktop + 10000,\n}\n\ntype BreakpointMediaQueryList = Record<BreakpointName, string>\n\nexport const defaultMediaConfig = {\n  mobile: `(width <= ${breakpointsMaxSize.mobile}px)`,\n  tabletPortrait: `(${breakpointsMinSize.tabletPortrait}px <= width <= ${breakpointsMaxSize.tabletPortrait}px)`,\n  tabletLandscape: `(${breakpointsMinSize.tabletLandscape}px <= width <= ${breakpointsMaxSize.tabletLandscape}px)`,\n  desktop: `(min-width: ${breakpointsMinSize.desktop}px)`,\n}\n\n/**\n * Point in time check if matching a specific breakpoint\n */\nexport function getCurrentMedia(\n  config: BreakpointMediaQueryList = defaultMediaConfig\n) {\n  const isMobile = window.matchMedia(config.mobile).matches\n  const isTabletPortrait = window.matchMedia(config.tabletPortrait).matches\n  const isTabletLandscape = window.matchMedia(config.tabletLandscape).matches\n  const isDesktop = window.matchMedia(config.desktop).matches\n\n  return {\n    isMobile,\n    isTabletPortrait,\n    isTabletLandscape,\n    isDesktop,\n  }\n}\n\n/**\n * Reactive check if matching a specific breakpoint\n */\nexport function useCurrentMedia() {\n  const [currentMedia, setCurrentMedia] = React.useState(getCurrentMedia())\n\n  React.useEffect(() => {\n    function handleResize() {\n      setCurrentMedia(getCurrentMedia())\n    }\n\n    window.addEventListener('resize', handleResize)\n    return () => window.removeEventListener('resize', handleResize)\n  }, [])\n\n  return currentMedia\n}\n"],"mappings":";;;;;;AAAA;AACA,OAAOA,KAAK,MAAM,OAAO;AAUzB;AACA;AACA;AACA,OAAO,IAAMC,kBAAoC,GAAG;EAClDC,MAAM,EAAE,CAAC;EACTC,cAAc,EAAE,GAAG;EACnBC,eAAe,EAAE,IAAI;EACrBC,OAAO,EAAE;AACX,CAAC;;AAED;AACA;AACA;AACA,OAAO,IAAMC,kBAAoC,GAAG;EAClDJ,MAAM,EAAED,kBAAkB,CAACE,cAAc,GAAG,CAAC;EAC7CA,cAAc,EAAEF,kBAAkB,CAACG,eAAe,GAAG,CAAC;EACtDA,eAAe,EAAEH,kBAAkB,CAACI,OAAO,GAAG,CAAC;EAC/C;EACA;EACAA,OAAO,EAAEJ,kBAAkB,CAACI,OAAO,GAAG;AACxC,CAAC;AAID,OAAO,IAAME,kBAAkB,GAAG;EAChCL,MAAM,eAAAM,MAAA,CAAeF,kBAAkB,CAACJ,MAAM,QAAK;EACnDC,cAAc,MAAAK,MAAA,CAAMP,kBAAkB,CAACE,cAAc,qBAAAK,MAAA,CAAkBF,kBAAkB,CAACH,cAAc,QAAK;EAC7GC,eAAe,MAAAI,MAAA,CAAMP,kBAAkB,CAACG,eAAe,qBAAAI,MAAA,CAAkBF,kBAAkB,CAACF,eAAe,QAAK;EAChHC,OAAO,iBAAAG,MAAA,CAAiBP,kBAAkB,CAACI,OAAO;AACpD,CAAC;;AAED;AACA;AACA;AACA,OAAO,SAASI,eAAeA,CAAA,EAE7B;EAAA,IADAC,MAAgC,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,QAAAE,SAAA,GAAAF,SAAA,MAAGJ,kBAAkB;EAErD,IAAMO,QAAQ,GAAGC,MAAM,CAACC,UAAU,CAACN,MAAM,CAACR,MAAM,CAAC,CAACe,OAAO;EACzD,IAAMC,gBAAgB,GAAGH,MAAM,CAACC,UAAU,CAACN,MAAM,CAACP,cAAc,CAAC,CAACc,OAAO;EACzE,IAAME,iBAAiB,GAAGJ,MAAM,CAACC,UAAU,CAACN,MAAM,CAACN,eAAe,CAAC,CAACa,OAAO;EAC3E,IAAMG,SAAS,GAAGL,MAAM,CAACC,UAAU,CAACN,MAAM,CAACL,OAAO,CAAC,CAACY,OAAO;EAE3D,OAAO;IACLH,QAAQ,EAARA,QAAQ;IACRI,gBAAgB,EAAhBA,gBAAgB;IAChBC,iBAAiB,EAAjBA,iBAAiB;IACjBC,SAAS,EAATA;EACF,CAAC;AACH;;AAEA;AACA;AACA;AACA,OAAO,SAASC,eAAeA,CAAA,EAAG;EAChC,IAAAC,eAAA,GAAwCtB,KAAK,CAACuB,QAAQ,CAACd,eAAe,CAAC,CAAC,CAAC;IAAAe,gBAAA,GAAAC,cAAA,CAAAH,eAAA;IAAlEI,YAAY,GAAAF,gBAAA;IAAEG,eAAe,GAAAH,gBAAA;EAEpCxB,KAAK,CAAC4B,SAAS,CAAC,YAAM;IACpB,SAASC,YAAYA,CAAA,EAAG;MACtBF,eAAe,CAAClB,eAAe,CAAC,CAAC,CAAC;IACpC;IAEAM,MAAM,CAACe,gBAAgB,CAAC,QAAQ,EAAED,YAAY,CAAC;IAC/C,OAAO;MAAA,OAAMd,MAAM,CAACgB,mBAAmB,CAAC,QAAQ,EAAEF,YAAY,CAAC;IAAA;EACjE,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOH,YAAY;AACrB"}

package/dist/_locales/en-AU.json

@@ -1,7 +1,7 @@
 {
   "core" : {
     "banner" : {
-      "dismissAlert" : "Dismiss Alert"
+      "dismissAlert" : "Dismiss alert"
     },
     "breadcrumbs" : {
       "label" : "Breadcrumb"
@@ -16,15 +16,15 @@
         "forms" : "Forms",
         "photos" : "Photos",
         "selectAlbum" : "Select album",
-        "selectAnAlbum" : "Select an Album",
+        "selectAnAlbum" : "Select an album",
         "selectArea" : "Select area",
-        "selectAnArea" : "Select an Area",
+        "selectAnArea" : "Select an area",
         "selectDiscipline" : "Select discipline",
-        "selectADiscipline" : "Select a Discipline",
+        "selectADiscipline" : "Select a discipline",
         "selectSet" : "Select set",
-        "selectASet" : "Select a Set",
+        "selectASet" : "Select a set",
         "selectTemplate" : "Select template",
-        "selectATemplate" : "Select a Template"
+        "selectATemplate" : "Select a template"
       },
       "emails" : {
         "emailSendErrorTitle" : "Sorry, we couldn't send this message.",
@@ -33,14 +33,14 @@
         "emailContentDisclaimer" : "Note: The general information about “{{title}}” will be included in the body of this email.",
         "recipientSelectPlaceholder" : "Type to search people",
         "emailRecipientRequiredError" : "Enter recipient to send.",
-        "emailSubjectRequiredError" : "Enter Subject to send.",
-        "goToAllEmails" : "All Emails",
+        "emailSubjectRequiredError" : "Enter subject to send.",
+        "goToAllEmails" : "All emails",
         "sendEmail" : "Send",
-        "replyAll" : "Reply All",
-        "downloadAll" : "Download All",
+        "replyAll" : "Reply all",
+        "downloadAll" : "Download all",
         "showAll" : "Show all",
         "showLess" : "Show less",
-        "composeEmailPageTitle" : "Compose New Email",
+        "composeEmailPageTitle" : "Compose new email",
         "emailSentMessage" : "The email was successfully sent.",
         "from" : "From",
         "to" : "To",
@@ -51,9 +51,9 @@
         "privateEmailDisclaimer" : "Private emails are only shown to recipients and the sender of the email.",
         "privateLabel" : "Private",
         "settingsLink" : "Settings",
-        "composeNewEmail" : "Compose Email",
+        "composeNewEmail" : "Compose email",
         "startNewCommunication" : "To initiate a new communication thread associated with this item, send an email to",
-        "emptyStateTitle" : "Send an Email to Get Started",
+        "emptyStateTitle" : "Send an email to get started",
         "emptyStateDescription" : "When you and your team send emails about this item, you can reference them here.",
         "reply" : "Reply",
         "cancel" : "Cancel",
@@ -63,43 +63,43 @@
       "distributionSelect" : {
         "noCompany" : "No company",
         "peopleCount" : "{{count}} people",
-        "distributionGroups" : "Distribution Groups",
+        "distributionGroups" : "Distribution groups",
         "people" : "People"
       },
       "relatedItems" : {
         "cancel" : "Cancel",
         "close" : "Close",
         "date" : "Date",
-        "itemType" : "Item Type",
+        "itemType" : "Item type",
         "itemTypeGroupLabel" : {
           "dailyLog" : "Site Diary",
-          "prostoreFile" : "Attach Files"
+          "prostoreFile" : "Attach files"
         },
-        "itemName" : "Item Name",
+        "itemName" : "Item name",
         "loading" : "Loading",
         "notes" : "Notes",
         "notesPlaceholder" : "Optional explanation of why this item is related",
-        "newItem" : "Link Related Item",
+        "newItem" : "Link related item",
         "noRelatedItems" : {
-          "title" : "Link Related Items to Get Started",
+          "title" : "Link related items to get started",
           "description" : "Linking items to this {{itemName}} makes it easier for you and your team to find relevant information throughout Procore."
         },
         "noItems" : {
-          "title" : "There Are No Items to Display",
+          "title" : "There are no items to display",
           "description" : "Create items in your project to add them as related items here."
         },
         "noResultsSearchQuery" : {
-          "title" : "No Items Match Your Search",
+          "title" : "No items match your search",
           "description" : "Check your spelling and filter options, or search for a different keyword."
         },
         "noResultsServerError" : {
-          "title" : "Something Went Wrong",
+          "title" : "Something went wrong",
           "description" : "Please check your internet connection and try again.",
-          "action" : "Try Again"
+          "action" : "Try again"
         },
-        "panelTitle" : "Link Related Item",
+        "panelTitle" : "Link related item",
         "search" : "Search",
-        "searchItemType" : "Search Item Type",
+        "searchItemType" : "Search item type",
         "submit" : "Link",
         "toast" : {
           "itemAdded" : "The related item was successfully linked.",
@@ -120,26 +120,26 @@
       "emptyState" : {
         "noFilteredResults" : {
           "description" : "Check your spelling and filter options, or search for a different keyword.",
-          "title" : "No Items Match Your Search"
+          "title" : "No items match your search"
         }
       },
       "exporting" : "Exporting...",
       "filters" : {
         "filters" : "Filters",
-        "moreFilters" : "More Filters",
-        "clearAllFilters" : "Clear All Filters"
+        "moreFilters" : "More filters",
+        "clearAllFilters" : "Clear all filters"
       },
-      "grandTotals" : "Grand Totals",
+      "grandTotals" : "Grand totals",
       "search" : "Search",
       "subtotals" : "Subtotals",
       "tableSettings" : {
-        "configureColumns" : "Configure Columns",
-        "resetToDefault" : "Reset To Default",
-        "rowHeight" : "Row Height",
+        "configureColumns" : "Configure columns",
+        "resetToDefault" : "Reset to default",
+        "rowHeight" : "Row height",
         "small" : "Small",
         "medium" : "Medium",
         "large" : "Large",
-        "tableSettings" : "Table Settings"
+        "tableSettings" : "Table settings"
       }
     },
     "dateInput" : {
@@ -168,15 +168,15 @@
     },
     "dropdown" : {
       "search" : "Search",
-      "moreOptions" : "More Options",
+      "moreOptions" : "More options",
       "loading" : "Loading"
     },
     "dropzone" : {
       "uploadFiles" : {
-        "one" : "Upload File",
-        "other" : "Upload Files"
+        "one" : "Upload file",
+        "other" : "Upload files"
       },
-      "dragAndDrop" : "or Drag & Drop",
+      "dragAndDrop" : "or drag & drop",
       "incorrectFileTypeMessage" : {
         "one" : "Sorry - that file type is not allowed.",
         "other" : "Sorry, some of those file types are not allowed."
@@ -186,9 +186,9 @@
         "one" : "Sorry, only {{count}} file can be attached.",
         "other" : "Sorry, only {{count}} files can be attached."
       },
-      "hideDetails" : "Hide Details",
-      "showDetails" : "Show Details",
-      "errorTitle" : "We Couldn't Upload Some of Your Files",
+      "hideDetails" : "Hide details",
+      "showDetails" : "Show details",
+      "errorTitle" : "We couldn't upload some of your files",
       "oneFileAtATimeError" : "Sorry, you can only attach one file at a time.",
       "multipleErrorsMessage" : "Sorry, some of your items could not be uploaded due to multiple errors.",
       "maxFileSizeErrorGroup" : "Max file size ({{sizeInMegabytes}}mb) exceeded",
@@ -200,8 +200,8 @@
       "standaloneMinFileSizeError" : "Sorry, we couldn't upload your files because one or multiple files doesn't meet the minimum file size of {{sizeInMegabytes}}mb.",
       "standaloneMaxFileSizeError" : "Sorry, we couldn't upload your files because one or multiple files doesn't meet the maximum file size of {{sizeInMegabytes}}mb.",
       "uploadTotalProgress" : {
-        "withFailed" : "Total Progress: {{totalProgress}}%. Uploaded {{uploaded}} of {{total}}. Failed {{failed}}.",
-        "withoutFailed" : "Total Progress: {{totalProgress}}%. Uploaded {{uploaded}} of {{total}}."
+        "withFailed" : "Total progress: {{totalProgress}}%. Uploaded {{uploaded}} of {{total}}. Failed {{failed}}.",
+        "withoutFailed" : "Total progress: {{totalProgress}}%. Uploaded {{uploaded}} of {{total}}."
       }
     },
     "modal" : {
@@ -212,7 +212,7 @@
     },
     "multiSelect" : {
       "clearAll" : "Delete field",
-      "selectValues" : "Select Values",
+      "selectValues" : "Select values",
       "noResults" : "No results"
     },
     "tearsheet" : {
@@ -222,8 +222,8 @@
     },
     "fileAttacher" : {
       "attachFiles" : {
-        "one" : "Attach File",
-        "other" : "Attach Files"
+        "one" : "Attach file",
+        "other" : "Attach files"
       }
     },
     "fileToken" : {
@@ -249,13 +249,13 @@
       "cancelAction" : "Cancel",
       "attachAction" : "Attach",
       "maxNumberOfFilesSelected" : "Maximum number of files selected",
-      "modalTitle" : "Attach Files",
+      "modalTitle" : "Attach files",
       "filesPendingUpload" : "One or more files have not finished uploading.",
       "noSelectedItems" : "Please select a file.",
       "emptySearchResults" : "No results found",
       "noItems" : "No items",
       "searchPlaceholder" : "Search",
-      "uploadFailed" : "Upload Failed",
+      "uploadFailed" : "Upload failed",
       "supportedFileTypes" : "Supported file types"
     },
     "form" : {
@@ -275,7 +275,7 @@
         "fixErrorsToUpdate" : "Please fix the errors below and try updating again."
       },
       "field" : {
-        "tooltipHelp" : "More Information"
+        "tooltipHelp" : "More information"
       }
     },
     "menu" : {
@@ -317,15 +317,15 @@
       }
     },
     "fileList" : {
-      "downloadAll" : "Download All",
+      "downloadAll" : "Download all",
       "download" : "Download",
-      "noPreview" : "No Preview Available"
+      "noPreview" : "No preview available"
     },
     "tieredSelect" : {
       "emptyMessage" : "No locations.",
       "goToTier" : "Go to sub menu",
       "placeholder" : "Select an item",
-      "quickCreateActionLabel" : "Create New Location",
+      "quickCreateActionLabel" : "Create new location",
       "quickCreateCancelLabel" : "Cancel",
       "quickCreateCreateLabel" : "Create",
       "quickCreatePlaceholder" : "Add location",
@@ -334,7 +334,7 @@
       "spinnerLabel" : "Loading"
     },
     "tieredDropdown" : {
-      "emptyMessage" : "No Items.",
+      "emptyMessage" : "No items.",
       "searchEmptyMessage" : "No results.",
       "searchPlaceholder" : "Search",
       "spinnerLabel" : "Loading"
@@ -343,18 +343,18 @@
       "remove" : "Remove selection"
     },
     "toolHeader" : {
-      "settingsAction" : "Configure Settings"
+      "settingsAction" : "Configure settings"
     },
     "fileSelect" : {
-      "localFilesSource" : "My Computer",
-      "uploadFailed" : "Upload Failed",
+      "localFilesSource" : "My computer",
+      "uploadFailed" : "Upload failed",
       "maxNumberOfFilesSelected" : "Maximum number of files selected"
     },
     "required" : {
       "requiredFields" : "Required fields"
     },
     "avatarStack" : {
-      "viewAll" : "View All",
+      "viewAll" : "View all",
       "close" : "Close"
     },
     "panel" : {