@imposium-hub/components 2.2.1 → 2.2.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/cjs/utils/assets.d.ts +1 -1
  2. package/dist/cjs/utils/assets.js +10 -9
  3. package/dist/cjs/utils/assets.js.map +1 -1
  4. package/dist/esm/utils/assets.d.ts +1 -1
  5. package/dist/esm/utils/assets.js +9 -9
  6. package/dist/esm/utils/assets.js.map +1 -1
  7. package/package.json +1 -1
  8. package/src/utils/assets.ts +12 -9
package/dist/cjs/utils/assets.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import { CSSProperties } from 'react';
2
- export declare const getMediaPreviewStyle: (mediaWidth: number, mediaHeight: number, element: any) => CSSProperties;
2
+ export declare const getMediaPreviewStyle: (mediaWidth: number, mediaHeight: number, element: any, offsetY?: number) => CSSProperties;
package/dist/cjs/utils/assets.js CHANGED
@@ -2,7 +2,8 @@
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.getMediaPreviewStyle = void 0;
4
4
  var assets_1 = require("../constants/assets");
5
- var getMediaPreviewStyle = function (mediaWidth, mediaHeight, element) {
5
+ var getMediaPreviewStyle = function (mediaWidth, mediaHeight, element, offsetY) {
6
+ if (offsetY === void 0) { offsetY = 0; }
6
7
  if (!element) {
7
8
  return;
8
9
  }
@@ -24,17 +25,17 @@ var getMediaPreviewStyle = function (mediaWidth, mediaHeight, element) {
24
25
  height = assets_1.PREVIEW_MAX_HEIGHT;
25
26
  width = height * aspect;
26
27
  }
27
- // try top left
28
- var left = iconRect.x + iconRect.width - width - 15;
29
- var top = iconRect.y + iconRect.height - height - 20;
30
- // if the preview is off on the left, switch to the right of the icon
28
+ // Default to top right
29
+ var left = iconRect.x + iconRect.width - width;
30
+ var top = iconRect.y - height - offsetY;
31
+ // If it's off on the top, put it on the bottom
32
+ if (top < assets_1.HEADER_HEIGHT) {
33
+ top = iconRect.y + iconRect.height + offsetY;
34
+ }
35
+ // If it's off on the left, put it on the right
31
36
  if (left < 0) {
32
37
  left = iconRect.x;
33
38
  }
34
- // if the preview is off on the top, switch to bottom of the icon
35
- if (top < assets_1.HEADER_HEIGHT) {
36
- top = iconRect.y + 20;
37
- }
38
39
  return {
39
40
  top: top,
40
41
  left: left,
package/dist/cjs/utils/assets.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"assets.js","sourceRoot":"","sources":["../../../src/utils/assets.ts"],"names":[],"mappings":";;;AAAA,8CAA2F;AAGpF,IAAM,oBAAoB,GAAG,UAChC,UAAkB,EAClB,WAAmB,EACnB,OAAY;IAEZ,IAAI,CAAC,OAAO,EAAE;QACV,OAAO;KACV;IACD,IAAI,CAAC,UAAU,EAAE;QACb,UAAU,GAAG,0BAAiB,CAAC;KAClC;IACD,IAAI,CAAC,WAAW,EAAE;QACd,WAAW,GAAG,2BAAkB,CAAC;KACpC;IAED,IAAM,UAAU,GAAG,OAAO,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC;IAC7E,IAAI,CAAC,UAAU,EAAE;QACb,OAAO;KACV;IACD,IAAM,QAAQ,GAAG,UAAU,CAAC,qBAAqB,EAAE,CAAC;IACpD,IAAM,MAAM,GAAW,UAAU,GAAG,WAAW,CAAC;IAChD,IAAI,KAAK,GAAW,0BAAiB,CAAC;IACtC,IAAI,MAAM,GAAW,KAAK,GAAG,MAAM,CAAC;IAEpC,IAAI,MAAM,GAAG,2BAAkB,EAAE;QAC7B,MAAM,GAAG,2BAAkB,CAAC;QAC5B,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;KAC3B;IAED,eAAe;IACf,IAAI,IAAI,GAAG,QAAQ,CAAC,CAAC,GAAG,QAAQ,CAAC,KAAK,GAAG,KAAK,GAAG,EAAE,CAAC;IACpD,IAAI,GAAG,GAAG,QAAQ,CAAC,CAAC,GAAG,QAAQ,CAAC,MAAM,GAAG,MAAM,GAAG,EAAE,CAAC;IACrD,qEAAqE;IACrE,IAAI,IAAI,GAAG,CAAC,EAAE;QACV,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC;KACrB;IACD,iEAAiE;IACjE,IAAI,GAAG,GAAG,sBAAa,EAAE;QACrB,GAAG,GAAG,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC;KACzB;IAED,OAAO;QACH,GAAG,KAAA;QACH,IAAI,MAAA;QACJ,KAAK,OAAA;QACL,MAAM,QAAA;QACN,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,IAAI;KACf,CAAC;AACN,CAAC,CAAC;AAjDW,QAAA,oBAAoB,wBAiD/B"}
1
+ {"version":3,"file":"assets.js","sourceRoot":"","sources":["../../../src/utils/assets.ts"],"names":[],"mappings":";;;AAAA,8CAA2F;AAGpF,IAAM,oBAAoB,GAAG,UAChC,UAAkB,EAClB,WAAmB,EACnB,OAAY,EACZ,OAAmB;IAAnB,wBAAA,EAAA,WAAmB;IAEnB,IAAI,CAAC,OAAO,EAAE;QACV,OAAO;KACV;IACD,IAAI,CAAC,UAAU,EAAE;QACb,UAAU,GAAG,0BAAiB,CAAC;KAClC;IACD,IAAI,CAAC,WAAW,EAAE;QACd,WAAW,GAAG,2BAAkB,CAAC;KACpC;IAED,IAAM,UAAU,GAAG,OAAO,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC;IAC7E,IAAI,CAAC,UAAU,EAAE;QACb,OAAO;KACV;IACD,IAAM,QAAQ,GAAG,UAAU,CAAC,qBAAqB,EAAE,CAAC;IACpD,IAAM,MAAM,GAAW,UAAU,GAAG,WAAW,CAAC;IAChD,IAAI,KAAK,GAAW,0BAAiB,CAAC;IACtC,IAAI,MAAM,GAAW,KAAK,GAAG,MAAM,CAAC;IAEpC,IAAI,MAAM,GAAG,2BAAkB,EAAE;QAC7B,MAAM,GAAG,2BAAkB,CAAC;QAC5B,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;KAC3B;IAED,uBAAuB;IACvB,IAAI,IAAI,GAAG,QAAQ,CAAC,CAAC,GAAG,QAAQ,CAAC,KAAK,GAAG,KAAK,CAAC;IAC/C,IAAI,GAAG,GAAG,QAAQ,CAAC,CAAC,GAAG,MAAM,GAAG,OAAO,CAAC;IAExC,+CAA+C;IAC/C,IAAI,GAAG,GAAG,sBAAa,EAAE;QACrB,GAAG,GAAG,QAAQ,CAAC,CAAC,GAAG,QAAQ,CAAC,MAAM,GAAG,OAAO,CAAC;KAChD;IAED,+CAA+C;IAC/C,IAAI,IAAI,GAAG,CAAC,EAAE;QACV,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC;KACrB;IAED,OAAO;QACH,GAAG,KAAA;QACH,IAAI,MAAA;QACJ,KAAK,OAAA;QACL,MAAM,QAAA;QACN,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,IAAI;KACf,CAAC;AACN,CAAC,CAAC;AApDW,QAAA,oBAAoB,wBAoD/B"}
package/dist/esm/utils/assets.d.ts CHANGED
@@ -1,2 +1,2 @@
1
1
  import { CSSProperties } from 'react';
2
- export declare const getMediaPreviewStyle: (mediaWidth: number, mediaHeight: number, element: any) => CSSProperties;
2
+ export declare const getMediaPreviewStyle: (mediaWidth: number, mediaHeight: number, element: any, offsetY?: number) => CSSProperties;
package/dist/esm/utils/assets.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { HEADER_HEIGHT, PREVIEW_MAX_HEIGHT, PREVIEW_MAX_WIDTH } from '../constants/assets';
2
- export const getMediaPreviewStyle = (mediaWidth, mediaHeight, element) => {
2
+ export const getMediaPreviewStyle = (mediaWidth, mediaHeight, element, offsetY = 0) => {
3
3
  if (!element) {
4
4
  return;
5
5
  }
@@ -21,17 +21,17 @@ export const getMediaPreviewStyle = (mediaWidth, mediaHeight, element) => {
21
21
  height = PREVIEW_MAX_HEIGHT;
22
22
  width = height * aspect;
23
23
  }
24
- // try top left
25
- let left = iconRect.x + iconRect.width - width - 15;
26
- let top = iconRect.y + iconRect.height - height - 20;
27
- // if the preview is off on the left, switch to the right of the icon
24
+ // Default to top right
25
+ let left = iconRect.x + iconRect.width - width;
26
+ let top = iconRect.y - height - offsetY;
27
+ // If it's off on the top, put it on the bottom
28
+ if (top < HEADER_HEIGHT) {
29
+ top = iconRect.y + iconRect.height + offsetY;
30
+ }
31
+ // If it's off on the left, put it on the right
28
32
  if (left < 0) {
29
33
  left = iconRect.x;
30
34
  }
31
- // if the preview is off on the top, switch to bottom of the icon
32
- if (top < HEADER_HEIGHT) {
33
- top = iconRect.y + 20;
34
- }
35
35
  return {
36
36
  top,
37
37
  left,
package/dist/esm/utils/assets.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"assets.js","sourceRoot":"","sources":["../../../src/utils/assets.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAG3F,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAChC,UAAkB,EAClB,WAAmB,EACnB,OAAY,EACC,EAAE;IACf,IAAI,CAAC,OAAO,EAAE;QACV,OAAO;KACV;IACD,IAAI,CAAC,UAAU,EAAE;QACb,UAAU,GAAG,iBAAiB,CAAC;KAClC;IACD,IAAI,CAAC,WAAW,EAAE;QACd,WAAW,GAAG,kBAAkB,CAAC;KACpC;IAED,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC;IAC7E,IAAI,CAAC,UAAU,EAAE;QACb,OAAO;KACV;IACD,MAAM,QAAQ,GAAG,UAAU,CAAC,qBAAqB,EAAE,CAAC;IACpD,MAAM,MAAM,GAAW,UAAU,GAAG,WAAW,CAAC;IAChD,IAAI,KAAK,GAAW,iBAAiB,CAAC;IACtC,IAAI,MAAM,GAAW,KAAK,GAAG,MAAM,CAAC;IAEpC,IAAI,MAAM,GAAG,kBAAkB,EAAE;QAC7B,MAAM,GAAG,kBAAkB,CAAC;QAC5B,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;KAC3B;IAED,eAAe;IACf,IAAI,IAAI,GAAG,QAAQ,CAAC,CAAC,GAAG,QAAQ,CAAC,KAAK,GAAG,KAAK,GAAG,EAAE,CAAC;IACpD,IAAI,GAAG,GAAG,QAAQ,CAAC,CAAC,GAAG,QAAQ,CAAC,MAAM,GAAG,MAAM,GAAG,EAAE,CAAC;IACrD,qEAAqE;IACrE,IAAI,IAAI,GAAG,CAAC,EAAE;QACV,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC;KACrB;IACD,iEAAiE;IACjE,IAAI,GAAG,GAAG,aAAa,EAAE;QACrB,GAAG,GAAG,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC;KACzB;IAED,OAAO;QACH,GAAG;QACH,IAAI;QACJ,KAAK;QACL,MAAM;QACN,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,IAAI;KACf,CAAC;AACN,CAAC,CAAC"}
1
+ {"version":3,"file":"assets.js","sourceRoot":"","sources":["../../../src/utils/assets.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAG3F,MAAM,CAAC,MAAM,oBAAoB,GAAG,CAChC,UAAkB,EAClB,WAAmB,EACnB,OAAY,EACZ,UAAkB,CAAC,EACN,EAAE;IACf,IAAI,CAAC,OAAO,EAAE;QACV,OAAO;KACV;IACD,IAAI,CAAC,UAAU,EAAE;QACb,UAAU,GAAG,iBAAiB,CAAC;KAClC;IACD,IAAI,CAAC,WAAW,EAAE;QACd,WAAW,GAAG,kBAAkB,CAAC;KACpC;IAED,MAAM,UAAU,GAAG,OAAO,CAAC,OAAO,KAAK,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC;IAC7E,IAAI,CAAC,UAAU,EAAE;QACb,OAAO;KACV;IACD,MAAM,QAAQ,GAAG,UAAU,CAAC,qBAAqB,EAAE,CAAC;IACpD,MAAM,MAAM,GAAW,UAAU,GAAG,WAAW,CAAC;IAChD,IAAI,KAAK,GAAW,iBAAiB,CAAC;IACtC,IAAI,MAAM,GAAW,KAAK,GAAG,MAAM,CAAC;IAEpC,IAAI,MAAM,GAAG,kBAAkB,EAAE;QAC7B,MAAM,GAAG,kBAAkB,CAAC;QAC5B,KAAK,GAAG,MAAM,GAAG,MAAM,CAAC;KAC3B;IAED,uBAAuB;IACvB,IAAI,IAAI,GAAG,QAAQ,CAAC,CAAC,GAAG,QAAQ,CAAC,KAAK,GAAG,KAAK,CAAC;IAC/C,IAAI,GAAG,GAAG,QAAQ,CAAC,CAAC,GAAG,MAAM,GAAG,OAAO,CAAC;IAExC,+CAA+C;IAC/C,IAAI,GAAG,GAAG,aAAa,EAAE;QACrB,GAAG,GAAG,QAAQ,CAAC,CAAC,GAAG,QAAQ,CAAC,MAAM,GAAG,OAAO,CAAC;KAChD;IAED,+CAA+C;IAC/C,IAAI,IAAI,GAAG,CAAC,EAAE;QACV,IAAI,GAAG,QAAQ,CAAC,CAAC,CAAC;KACrB;IAED,OAAO;QACH,GAAG;QACH,IAAI;QACJ,KAAK;QACL,MAAM;QACN,QAAQ,EAAE,UAAU;QACpB,MAAM,EAAE,IAAI;KACf,CAAC;AACN,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@imposium-hub/components",
3
- "version": "2.2.1",
3
+ "version": "2.2.2",
4
4
  "description": "React & Typescript component / asset library for Imposium front-ends",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "module": "./dist/esm/index.js",
package/src/utils/assets.ts CHANGED
@@ -4,7 +4,8 @@ import { CSSProperties } from 'react';
4
4
  export const getMediaPreviewStyle = (
5
5
  mediaWidth: number,
6
6
  mediaHeight: number,
7
- element: any
7
+ element: any,
8
+ offsetY: number = 0
8
9
  ): CSSProperties => {
9
10
  if (!element) {
10
11
  return;
@@ -30,17 +31,19 @@ export const getMediaPreviewStyle = (
30
31
  width = height * aspect;
31
32
  }
32
33
 
33
- // try top left
34
- let left = iconRect.x + iconRect.width - width - 15;
35
- let top = iconRect.y + iconRect.height - height - 20;
36
- // if the preview is off on the left, switch to the right of the icon
34
+ // Default to top right
35
+ let left = iconRect.x + iconRect.width - width;
36
+ let top = iconRect.y - height - offsetY;
37
+
38
+ // If it's off on the top, put it on the bottom
39
+ if (top < HEADER_HEIGHT) {
40
+ top = iconRect.y + iconRect.height + offsetY;
41
+ }
42
+
43
+ // If it's off on the left, put it on the right
37
44
  if (left < 0) {
38
45
  left = iconRect.x;
39
46
  }
40
- // if the preview is off on the top, switch to bottom of the icon
41
- if (top < HEADER_HEIGHT) {
42
- top = iconRect.y + 20;
43
- }
44
47
 
45
48
  return {
46
49
  top,