@veeqo/ui 15.7.0 → 15.8.0

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 (102) hide show
  1. package/dist/components/Action/styles/button.module.scss.cjs +2 -2
  2. package/dist/components/Action/styles/button.module.scss.cjs.map +1 -1
  3. package/dist/components/Action/styles/button.module.scss.js +2 -2
  4. package/dist/components/Action/styles/button.module.scss.js.map +1 -1
  5. package/dist/components/Action/styles/link.module.scss.cjs +2 -2
  6. package/dist/components/Action/styles/link.module.scss.cjs.map +1 -1
  7. package/dist/components/Action/styles/link.module.scss.js +2 -2
  8. package/dist/components/Action/styles/link.module.scss.js.map +1 -1
  9. package/dist/components/Action/styles/{base.module.scss.cjs → reset.module.scss.cjs} +3 -3
  10. package/dist/components/Action/styles/reset.module.scss.cjs.map +1 -0
  11. package/dist/components/Action/styles/{base.module.scss.js → reset.module.scss.js} +3 -3
  12. package/dist/components/Action/styles/reset.module.scss.js.map +1 -0
  13. package/dist/components/Action/utils.cjs +2 -4
  14. package/dist/components/Action/utils.cjs.map +1 -1
  15. package/dist/components/Action/utils.js +2 -4
  16. package/dist/components/Action/utils.js.map +1 -1
  17. package/dist/components/Anchor/types.d.ts +3 -0
  18. package/dist/components/AnimatedDropdown/types.d.ts +3 -0
  19. package/dist/components/Badge/types.d.ts +3 -0
  20. package/dist/components/Banner/Banner.cjs.map +1 -1
  21. package/dist/components/Banner/Banner.d.ts +3 -0
  22. package/dist/components/Banner/Banner.js.map +1 -1
  23. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.cjs +2 -1
  24. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.cjs.map +1 -1
  25. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.js +2 -1
  26. package/dist/components/DataGrid/components/Body/BodyCell/BodyCell.js.map +1 -1
  27. package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.cjs +2 -1
  28. package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.cjs.map +1 -1
  29. package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.js +2 -1
  30. package/dist/components/DataGrid/components/Body/LoadingBody/LoadingBodyCell.js.map +1 -1
  31. package/dist/components/DataGrid/components/GridContainer/GridContainer.cjs +2 -1
  32. package/dist/components/DataGrid/components/GridContainer/GridContainer.cjs.map +1 -1
  33. package/dist/components/DataGrid/components/GridContainer/GridContainer.js +2 -1
  34. package/dist/components/DataGrid/components/GridContainer/GridContainer.js.map +1 -1
  35. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.cjs +2 -1
  36. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.cjs.map +1 -1
  37. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.js +2 -1
  38. package/dist/components/DataGrid/components/Header/HeaderCell/HeaderCell.js.map +1 -1
  39. package/dist/components/DataTable/DataTable.cjs +3 -0
  40. package/dist/components/DataTable/DataTable.cjs.map +1 -1
  41. package/dist/components/DataTable/DataTable.d.ts +3 -0
  42. package/dist/components/DataTable/DataTable.js +3 -0
  43. package/dist/components/DataTable/DataTable.js.map +1 -1
  44. package/dist/components/DataTable/types.cjs.map +1 -1
  45. package/dist/components/DataTable/types.d.ts +3 -0
  46. package/dist/components/DataTable/types.js.map +1 -1
  47. package/dist/components/DescriptionList/DescriptionList.cjs +3 -0
  48. package/dist/components/DescriptionList/DescriptionList.cjs.map +1 -1
  49. package/dist/components/DescriptionList/DescriptionList.d.ts +6 -0
  50. package/dist/components/DescriptionList/DescriptionList.js +3 -0
  51. package/dist/components/DescriptionList/DescriptionList.js.map +1 -1
  52. package/dist/components/DetailPage/DetailPage.cjs +3 -0
  53. package/dist/components/DetailPage/DetailPage.cjs.map +1 -1
  54. package/dist/components/DetailPage/DetailPage.d.ts +6 -0
  55. package/dist/components/DetailPage/DetailPage.js +3 -0
  56. package/dist/components/DetailPage/DetailPage.js.map +1 -1
  57. package/dist/components/LegacyDataTable/LegacyDataTable.cjs +1 -3
  58. package/dist/components/LegacyDataTable/LegacyDataTable.cjs.map +1 -1
  59. package/dist/components/LegacyDataTable/LegacyDataTable.d.ts +1 -3
  60. package/dist/components/LegacyDataTable/LegacyDataTable.js +1 -3
  61. package/dist/components/LegacyDataTable/LegacyDataTable.js.map +1 -1
  62. package/dist/components/LegacyDataTable/utils/types.d.ts +3 -0
  63. package/dist/components/Popover/Popover.cjs +1 -0
  64. package/dist/components/Popover/Popover.cjs.map +1 -1
  65. package/dist/components/Popover/Popover.js +1 -0
  66. package/dist/components/Popover/Popover.js.map +1 -1
  67. package/dist/components/Popup/Popup.cjs +4 -0
  68. package/dist/components/Popup/Popup.cjs.map +1 -1
  69. package/dist/components/Popup/Popup.d.ts +3 -0
  70. package/dist/components/Popup/Popup.js +4 -0
  71. package/dist/components/Popup/Popup.js.map +1 -1
  72. package/dist/components/Popup/types.d.ts +3 -0
  73. package/dist/components/Portal/Portal.cjs +31 -1
  74. package/dist/components/Portal/Portal.cjs.map +1 -1
  75. package/dist/components/Portal/Portal.d.ts +27 -6
  76. package/dist/components/Portal/Portal.js +31 -1
  77. package/dist/components/Portal/Portal.js.map +1 -1
  78. package/dist/components/Portal/PortalContext.cjs +27 -0
  79. package/dist/components/Portal/PortalContext.cjs.map +1 -0
  80. package/dist/components/Portal/PortalContext.d.ts +18 -0
  81. package/dist/components/Portal/PortalContext.js +20 -0
  82. package/dist/components/Portal/PortalContext.js.map +1 -0
  83. package/dist/components/Portal/index.d.ts +1 -0
  84. package/dist/components/Portal/types.d.ts +13 -0
  85. package/dist/components/Stack/types.d.ts +3 -0
  86. package/dist/components/Tooltip/Tooltip.cjs +1 -0
  87. package/dist/components/Tooltip/Tooltip.cjs.map +1 -1
  88. package/dist/components/Tooltip/Tooltip.js +1 -0
  89. package/dist/components/Tooltip/Tooltip.js.map +1 -1
  90. package/dist/components/View/types.cjs.map +1 -1
  91. package/dist/components/View/types.d.ts +3 -0
  92. package/dist/components/View/types.js.map +1 -1
  93. package/dist/components/index.d.ts +1 -1
  94. package/dist/index.cjs +2 -0
  95. package/dist/index.cjs.map +1 -1
  96. package/dist/index.js +1 -0
  97. package/dist/index.js.map +1 -1
  98. package/dist/utils/forms/form.module.scss.cjs +2 -2
  99. package/dist/utils/forms/form.module.scss.js +2 -2
  100. package/package.json +1 -1
  101. package/dist/components/Action/styles/base.module.scss.cjs.map +0 -1
  102. package/dist/components/Action/styles/base.module.scss.js.map +0 -1
@@ -3,10 +3,33 @@
3
3
  var React = require('react');
4
4
  var reactDom = require('react-dom');
5
5
  var generateId = require('../../utils/generateId.cjs');
6
+ var PortalContext = require('./PortalContext.cjs');
6
7
  var utils = require('./utils.cjs');
7
8
 
8
9
  /**
9
- * The portal component renders content on the document `body` unless `rootElementRef` is passed.
10
+ * Renders children into a node appended to `rootElementRef`, the last open dialog, or `document.body`
11
+ * — escaping the current CSS stacking context.
12
+ * Used internally by overlay components (Popover, Dropdown, ActionMenu).
13
+ *
14
+ * Respects `DisablePortals` context — when a `DisablePortals` ancestor is present, children are
15
+ * rendered inline instead, preventing stacking-context conflicts in already-portalled containers
16
+ * such as Toast.
17
+ *
18
+ * @example
19
+ * // Standard usage — renders into document.body
20
+ * <Portal>
21
+ * <div>Overlay content</div>
22
+ * </Portal>
23
+ *
24
+ * @example
25
+ * // Inside an already-portalled container — renders inline
26
+ * <DisablePortals>
27
+ * <SomeComponent>
28
+ * <Portal>
29
+ * <div>Inline content</div>
30
+ * </Portal>
31
+ * </SomeComponent>
32
+ * </DisablePortals>
10
33
  */
11
34
  class Portal extends React.PureComponent {
12
35
  constructor(props) {
@@ -19,6 +42,9 @@ class Portal extends React.PureComponent {
19
42
  };
20
43
  }
21
44
  componentDidMount() {
45
+ const { disablePortal } = this.context;
46
+ if (disablePortal)
47
+ return;
22
48
  const { rootElementRef } = this.props;
23
49
  this.portalNode = document.createElement('div');
24
50
  this.portalNode.id = `portal-${this.id}`;
@@ -35,11 +61,15 @@ class Portal extends React.PureComponent {
35
61
  }
36
62
  }
37
63
  render() {
64
+ const { disablePortal } = this.context;
38
65
  const { children } = this.props;
39
66
  const { isMounted } = this.state;
67
+ if (disablePortal)
68
+ return children;
40
69
  return this.portalNode && isMounted ? reactDom.createPortal(children, this.portalNode) : null;
41
70
  }
42
71
  }
72
+ Portal.contextType = PortalContext.PortalContext;
43
73
 
44
74
  exports.Portal = Portal;
45
75
  //# sourceMappingURL=Portal.cjs.map
@@ -1 +1 @@
1
- {"version":3,"file":"Portal.cjs","sources":["../../../src/components/Portal/Portal.tsx"],"sourcesContent":["import { PureComponent, ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport { generateId } from '../../utils/generateId';\nimport { getLastOpenDialog } from './utils';\n\ntype PortalProps = {\n children: ReactNode;\n rootElementRef?: HTMLElement;\n};\n\ntype PortalState = {\n isMounted: boolean;\n};\n\n/**\n * The portal component renders content on the document `body` unless `rootElementRef` is passed.\n */\nexport class Portal extends PureComponent<PortalProps, PortalState> {\n id = generateId('portal');\n\n portalNode: HTMLElement | null = null;\n\n attachTo: HTMLElement | null = null;\n\n constructor(props: PortalProps) {\n super(props);\n this.state = {\n isMounted: false,\n };\n }\n\n componentDidMount() {\n const { rootElementRef } = this.props;\n\n this.portalNode = document.createElement('div');\n this.portalNode.id = `portal-${this.id}`;\n this.portalNode.style.cssText = 'position: absolute; top: 0; left: 0;';\n\n this.attachTo = rootElementRef || getLastOpenDialog() || document.body;\n this.attachTo.appendChild(this.portalNode);\n\n this.setState({ isMounted: true });\n }\n\n componentWillUnmount() {\n if (this.portalNode && this.attachTo) {\n if (document.contains(this.attachTo) && this.attachTo.contains(this.portalNode)) {\n this.attachTo.removeChild(this.portalNode);\n }\n }\n }\n\n render(): React.ReactPortal | null {\n const { children } = this.props;\n const { isMounted } = this.state;\n\n return this.portalNode && isMounted ? createPortal(children, this.portalNode) : null;\n }\n}\n"],"names":["PureComponent","generateId","getLastOpenDialog","createPortal"],"mappings":";;;;;;;AAcA;;AAEG;AACG,MAAO,MAAO,SAAQA,mBAAuC,CAAA;AAOjE,IAAA,WAAA,CAAY,KAAkB,EAAA;QAC5B,KAAK,CAAC,KAAK,CAAC;AAPd,QAAA,IAAA,CAAA,EAAE,GAAGC,qBAAU,CAAC,QAAQ,CAAC;QAEzB,IAAA,CAAA,UAAU,GAAuB,IAAI;QAErC,IAAA,CAAA,QAAQ,GAAuB,IAAI;QAIjC,IAAI,CAAC,KAAK,GAAG;AACX,YAAA,SAAS,EAAE,KAAK;SACjB;IACH;IAEA,iBAAiB,GAAA;AACf,QAAA,MAAM,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC,KAAK;QAErC,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;QAC/C,IAAI,CAAC,UAAU,CAAC,EAAE,GAAG,UAAU,IAAI,CAAC,EAAE,CAAA,CAAE;QACxC,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,OAAO,GAAG,sCAAsC;QAEtE,IAAI,CAAC,QAAQ,GAAG,cAAc,IAAIC,uBAAiB,EAAE,IAAI,QAAQ,CAAC,IAAI;QACtE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC;QAE1C,IAAI,CAAC,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACpC;IAEA,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,QAAQ,EAAE;AACpC,YAAA,IAAI,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE;gBAC/E,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC;AAC3C,YAAA;AACF,QAAA;IACH;IAEA,MAAM,GAAA;AACJ,QAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK;AAC/B,QAAA,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK;QAEhC,OAAO,IAAI,CAAC,UAAU,IAAI,SAAS,GAAGC,qBAAY,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,CAAC,GAAG,IAAI;IACtF;AACD;;;;"}
1
+ {"version":3,"file":"Portal.cjs","sources":["../../../src/components/Portal/Portal.tsx"],"sourcesContent":["import { PureComponent, ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport { generateId } from '../../utils/generateId';\nimport { PortalContext } from './PortalContext';\nimport type { PortalProps } from './types';\nimport { getLastOpenDialog } from './utils';\n\ntype PortalState = {\n isMounted: boolean;\n};\n\n/**\n * Renders children into a node appended to `rootElementRef`, the last open dialog, or `document.body`\n * — escaping the current CSS stacking context.\n * Used internally by overlay components (Popover, Dropdown, ActionMenu).\n *\n * Respects `DisablePortals` context — when a `DisablePortals` ancestor is present, children are\n * rendered inline instead, preventing stacking-context conflicts in already-portalled containers\n * such as Toast.\n *\n * @example\n * // Standard usage — renders into document.body\n * <Portal>\n * <div>Overlay content</div>\n * </Portal>\n *\n * @example\n * // Inside an already-portalled container — renders inline\n * <DisablePortals>\n * <SomeComponent>\n * <Portal>\n * <div>Inline content</div>\n * </Portal>\n * </SomeComponent>\n * </DisablePortals>\n */\nexport class Portal extends PureComponent<PortalProps, PortalState> {\n // eslint-disable-next-line react/static-property-placement\n declare context: React.ContextType<typeof PortalContext>;\n\n id = generateId('portal');\n\n portalNode: HTMLElement | null = null;\n\n attachTo: HTMLElement | null = null;\n\n constructor(props: PortalProps) {\n super(props);\n this.state = {\n isMounted: false,\n };\n }\n\n componentDidMount() {\n const { disablePortal } = this.context;\n if (disablePortal) return;\n\n const { rootElementRef } = this.props;\n\n this.portalNode = document.createElement('div');\n this.portalNode.id = `portal-${this.id}`;\n this.portalNode.style.cssText = 'position: absolute; top: 0; left: 0;';\n\n this.attachTo = rootElementRef || getLastOpenDialog() || document.body;\n this.attachTo.appendChild(this.portalNode);\n\n this.setState({ isMounted: true });\n }\n\n componentWillUnmount() {\n if (this.portalNode && this.attachTo) {\n if (document.contains(this.attachTo) && this.attachTo.contains(this.portalNode)) {\n this.attachTo.removeChild(this.portalNode);\n }\n }\n }\n\n render(): React.ReactPortal | ReactNode | null {\n const { disablePortal } = this.context;\n const { children } = this.props;\n const { isMounted } = this.state;\n\n if (disablePortal) return children;\n\n return this.portalNode && isMounted ? createPortal(children, this.portalNode) : null;\n }\n}\n\nPortal.contextType = PortalContext;\n"],"names":["PureComponent","generateId","getLastOpenDialog","createPortal","PortalContext"],"mappings":";;;;;;;;AAWA;;;;;;;;;;;;;;;;;;;;;;;;AAwBG;AACG,MAAO,MAAO,SAAQA,mBAAuC,CAAA;AAUjE,IAAA,WAAA,CAAY,KAAkB,EAAA;QAC5B,KAAK,CAAC,KAAK,CAAC;AAPd,QAAA,IAAA,CAAA,EAAE,GAAGC,qBAAU,CAAC,QAAQ,CAAC;QAEzB,IAAA,CAAA,UAAU,GAAuB,IAAI;QAErC,IAAA,CAAA,QAAQ,GAAuB,IAAI;QAIjC,IAAI,CAAC,KAAK,GAAG;AACX,YAAA,SAAS,EAAE,KAAK;SACjB;IACH;IAEA,iBAAiB,GAAA;AACf,QAAA,MAAM,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,OAAO;AACtC,QAAA,IAAI,aAAa;YAAE;AAEnB,QAAA,MAAM,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC,KAAK;QAErC,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;QAC/C,IAAI,CAAC,UAAU,CAAC,EAAE,GAAG,UAAU,IAAI,CAAC,EAAE,CAAA,CAAE;QACxC,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,OAAO,GAAG,sCAAsC;QAEtE,IAAI,CAAC,QAAQ,GAAG,cAAc,IAAIC,uBAAiB,EAAE,IAAI,QAAQ,CAAC,IAAI;QACtE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC;QAE1C,IAAI,CAAC,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACpC;IAEA,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,QAAQ,EAAE;AACpC,YAAA,IAAI,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE;gBAC/E,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC;AAC3C,YAAA;AACF,QAAA;IACH;IAEA,MAAM,GAAA;AACJ,QAAA,MAAM,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,OAAO;AACtC,QAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK;AAC/B,QAAA,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK;AAEhC,QAAA,IAAI,aAAa;AAAE,YAAA,OAAO,QAAQ;QAElC,OAAO,IAAI,CAAC,UAAU,IAAI,SAAS,GAAGC,qBAAY,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,CAAC,GAAG,IAAI;IACtF;AACD;AAED,MAAM,CAAC,WAAW,GAAGC,2BAAa;;;;"}
@@ -1,21 +1,42 @@
1
1
  import { PureComponent, ReactNode } from 'react';
2
- type PortalProps = {
3
- children: ReactNode;
4
- rootElementRef?: HTMLElement;
5
- };
2
+ import { PortalContext } from './PortalContext';
3
+ import type { PortalProps } from './types';
6
4
  type PortalState = {
7
5
  isMounted: boolean;
8
6
  };
9
7
  /**
10
- * The portal component renders content on the document `body` unless `rootElementRef` is passed.
8
+ * Renders children into a node appended to `rootElementRef`, the last open dialog, or `document.body`
9
+ * — escaping the current CSS stacking context.
10
+ * Used internally by overlay components (Popover, Dropdown, ActionMenu).
11
+ *
12
+ * Respects `DisablePortals` context — when a `DisablePortals` ancestor is present, children are
13
+ * rendered inline instead, preventing stacking-context conflicts in already-portalled containers
14
+ * such as Toast.
15
+ *
16
+ * @example
17
+ * // Standard usage — renders into document.body
18
+ * <Portal>
19
+ * <div>Overlay content</div>
20
+ * </Portal>
21
+ *
22
+ * @example
23
+ * // Inside an already-portalled container — renders inline
24
+ * <DisablePortals>
25
+ * <SomeComponent>
26
+ * <Portal>
27
+ * <div>Inline content</div>
28
+ * </Portal>
29
+ * </SomeComponent>
30
+ * </DisablePortals>
11
31
  */
12
32
  export declare class Portal extends PureComponent<PortalProps, PortalState> {
33
+ context: React.ContextType<typeof PortalContext>;
13
34
  id: string;
14
35
  portalNode: HTMLElement | null;
15
36
  attachTo: HTMLElement | null;
16
37
  constructor(props: PortalProps);
17
38
  componentDidMount(): void;
18
39
  componentWillUnmount(): void;
19
- render(): React.ReactPortal | null;
40
+ render(): React.ReactPortal | ReactNode | null;
20
41
  }
21
42
  export {};
@@ -1,10 +1,33 @@
1
1
  import { PureComponent } from 'react';
2
2
  import { createPortal } from 'react-dom';
3
3
  import { generateId } from '../../utils/generateId.js';
4
+ import { PortalContext } from './PortalContext.js';
4
5
  import { getLastOpenDialog } from './utils.js';
5
6
 
6
7
  /**
7
- * The portal component renders content on the document `body` unless `rootElementRef` is passed.
8
+ * Renders children into a node appended to `rootElementRef`, the last open dialog, or `document.body`
9
+ * — escaping the current CSS stacking context.
10
+ * Used internally by overlay components (Popover, Dropdown, ActionMenu).
11
+ *
12
+ * Respects `DisablePortals` context — when a `DisablePortals` ancestor is present, children are
13
+ * rendered inline instead, preventing stacking-context conflicts in already-portalled containers
14
+ * such as Toast.
15
+ *
16
+ * @example
17
+ * // Standard usage — renders into document.body
18
+ * <Portal>
19
+ * <div>Overlay content</div>
20
+ * </Portal>
21
+ *
22
+ * @example
23
+ * // Inside an already-portalled container — renders inline
24
+ * <DisablePortals>
25
+ * <SomeComponent>
26
+ * <Portal>
27
+ * <div>Inline content</div>
28
+ * </Portal>
29
+ * </SomeComponent>
30
+ * </DisablePortals>
8
31
  */
9
32
  class Portal extends PureComponent {
10
33
  constructor(props) {
@@ -17,6 +40,9 @@ class Portal extends PureComponent {
17
40
  };
18
41
  }
19
42
  componentDidMount() {
43
+ const { disablePortal } = this.context;
44
+ if (disablePortal)
45
+ return;
20
46
  const { rootElementRef } = this.props;
21
47
  this.portalNode = document.createElement('div');
22
48
  this.portalNode.id = `portal-${this.id}`;
@@ -33,11 +59,15 @@ class Portal extends PureComponent {
33
59
  }
34
60
  }
35
61
  render() {
62
+ const { disablePortal } = this.context;
36
63
  const { children } = this.props;
37
64
  const { isMounted } = this.state;
65
+ if (disablePortal)
66
+ return children;
38
67
  return this.portalNode && isMounted ? createPortal(children, this.portalNode) : null;
39
68
  }
40
69
  }
70
+ Portal.contextType = PortalContext;
41
71
 
42
72
  export { Portal };
43
73
  //# sourceMappingURL=Portal.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"Portal.js","sources":["../../../src/components/Portal/Portal.tsx"],"sourcesContent":["import { PureComponent, ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport { generateId } from '../../utils/generateId';\nimport { getLastOpenDialog } from './utils';\n\ntype PortalProps = {\n children: ReactNode;\n rootElementRef?: HTMLElement;\n};\n\ntype PortalState = {\n isMounted: boolean;\n};\n\n/**\n * The portal component renders content on the document `body` unless `rootElementRef` is passed.\n */\nexport class Portal extends PureComponent<PortalProps, PortalState> {\n id = generateId('portal');\n\n portalNode: HTMLElement | null = null;\n\n attachTo: HTMLElement | null = null;\n\n constructor(props: PortalProps) {\n super(props);\n this.state = {\n isMounted: false,\n };\n }\n\n componentDidMount() {\n const { rootElementRef } = this.props;\n\n this.portalNode = document.createElement('div');\n this.portalNode.id = `portal-${this.id}`;\n this.portalNode.style.cssText = 'position: absolute; top: 0; left: 0;';\n\n this.attachTo = rootElementRef || getLastOpenDialog() || document.body;\n this.attachTo.appendChild(this.portalNode);\n\n this.setState({ isMounted: true });\n }\n\n componentWillUnmount() {\n if (this.portalNode && this.attachTo) {\n if (document.contains(this.attachTo) && this.attachTo.contains(this.portalNode)) {\n this.attachTo.removeChild(this.portalNode);\n }\n }\n }\n\n render(): React.ReactPortal | null {\n const { children } = this.props;\n const { isMounted } = this.state;\n\n return this.portalNode && isMounted ? createPortal(children, this.portalNode) : null;\n }\n}\n"],"names":[],"mappings":";;;;;AAcA;;AAEG;AACG,MAAO,MAAO,SAAQ,aAAuC,CAAA;AAOjE,IAAA,WAAA,CAAY,KAAkB,EAAA;QAC5B,KAAK,CAAC,KAAK,CAAC;AAPd,QAAA,IAAA,CAAA,EAAE,GAAG,UAAU,CAAC,QAAQ,CAAC;QAEzB,IAAA,CAAA,UAAU,GAAuB,IAAI;QAErC,IAAA,CAAA,QAAQ,GAAuB,IAAI;QAIjC,IAAI,CAAC,KAAK,GAAG;AACX,YAAA,SAAS,EAAE,KAAK;SACjB;IACH;IAEA,iBAAiB,GAAA;AACf,QAAA,MAAM,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC,KAAK;QAErC,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;QAC/C,IAAI,CAAC,UAAU,CAAC,EAAE,GAAG,UAAU,IAAI,CAAC,EAAE,CAAA,CAAE;QACxC,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,OAAO,GAAG,sCAAsC;QAEtE,IAAI,CAAC,QAAQ,GAAG,cAAc,IAAI,iBAAiB,EAAE,IAAI,QAAQ,CAAC,IAAI;QACtE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC;QAE1C,IAAI,CAAC,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACpC;IAEA,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,QAAQ,EAAE;AACpC,YAAA,IAAI,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE;gBAC/E,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC;AAC3C,YAAA;AACF,QAAA;IACH;IAEA,MAAM,GAAA;AACJ,QAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK;AAC/B,QAAA,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK;QAEhC,OAAO,IAAI,CAAC,UAAU,IAAI,SAAS,GAAG,YAAY,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,CAAC,GAAG,IAAI;IACtF;AACD;;;;"}
1
+ {"version":3,"file":"Portal.js","sources":["../../../src/components/Portal/Portal.tsx"],"sourcesContent":["import { PureComponent, ReactNode } from 'react';\nimport { createPortal } from 'react-dom';\nimport { generateId } from '../../utils/generateId';\nimport { PortalContext } from './PortalContext';\nimport type { PortalProps } from './types';\nimport { getLastOpenDialog } from './utils';\n\ntype PortalState = {\n isMounted: boolean;\n};\n\n/**\n * Renders children into a node appended to `rootElementRef`, the last open dialog, or `document.body`\n * — escaping the current CSS stacking context.\n * Used internally by overlay components (Popover, Dropdown, ActionMenu).\n *\n * Respects `DisablePortals` context — when a `DisablePortals` ancestor is present, children are\n * rendered inline instead, preventing stacking-context conflicts in already-portalled containers\n * such as Toast.\n *\n * @example\n * // Standard usage — renders into document.body\n * <Portal>\n * <div>Overlay content</div>\n * </Portal>\n *\n * @example\n * // Inside an already-portalled container — renders inline\n * <DisablePortals>\n * <SomeComponent>\n * <Portal>\n * <div>Inline content</div>\n * </Portal>\n * </SomeComponent>\n * </DisablePortals>\n */\nexport class Portal extends PureComponent<PortalProps, PortalState> {\n // eslint-disable-next-line react/static-property-placement\n declare context: React.ContextType<typeof PortalContext>;\n\n id = generateId('portal');\n\n portalNode: HTMLElement | null = null;\n\n attachTo: HTMLElement | null = null;\n\n constructor(props: PortalProps) {\n super(props);\n this.state = {\n isMounted: false,\n };\n }\n\n componentDidMount() {\n const { disablePortal } = this.context;\n if (disablePortal) return;\n\n const { rootElementRef } = this.props;\n\n this.portalNode = document.createElement('div');\n this.portalNode.id = `portal-${this.id}`;\n this.portalNode.style.cssText = 'position: absolute; top: 0; left: 0;';\n\n this.attachTo = rootElementRef || getLastOpenDialog() || document.body;\n this.attachTo.appendChild(this.portalNode);\n\n this.setState({ isMounted: true });\n }\n\n componentWillUnmount() {\n if (this.portalNode && this.attachTo) {\n if (document.contains(this.attachTo) && this.attachTo.contains(this.portalNode)) {\n this.attachTo.removeChild(this.portalNode);\n }\n }\n }\n\n render(): React.ReactPortal | ReactNode | null {\n const { disablePortal } = this.context;\n const { children } = this.props;\n const { isMounted } = this.state;\n\n if (disablePortal) return children;\n\n return this.portalNode && isMounted ? createPortal(children, this.portalNode) : null;\n }\n}\n\nPortal.contextType = PortalContext;\n"],"names":[],"mappings":";;;;;;AAWA;;;;;;;;;;;;;;;;;;;;;;;;AAwBG;AACG,MAAO,MAAO,SAAQ,aAAuC,CAAA;AAUjE,IAAA,WAAA,CAAY,KAAkB,EAAA;QAC5B,KAAK,CAAC,KAAK,CAAC;AAPd,QAAA,IAAA,CAAA,EAAE,GAAG,UAAU,CAAC,QAAQ,CAAC;QAEzB,IAAA,CAAA,UAAU,GAAuB,IAAI;QAErC,IAAA,CAAA,QAAQ,GAAuB,IAAI;QAIjC,IAAI,CAAC,KAAK,GAAG;AACX,YAAA,SAAS,EAAE,KAAK;SACjB;IACH;IAEA,iBAAiB,GAAA;AACf,QAAA,MAAM,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,OAAO;AACtC,QAAA,IAAI,aAAa;YAAE;AAEnB,QAAA,MAAM,EAAE,cAAc,EAAE,GAAG,IAAI,CAAC,KAAK;QAErC,IAAI,CAAC,UAAU,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC;QAC/C,IAAI,CAAC,UAAU,CAAC,EAAE,GAAG,UAAU,IAAI,CAAC,EAAE,CAAA,CAAE;QACxC,IAAI,CAAC,UAAU,CAAC,KAAK,CAAC,OAAO,GAAG,sCAAsC;QAEtE,IAAI,CAAC,QAAQ,GAAG,cAAc,IAAI,iBAAiB,EAAE,IAAI,QAAQ,CAAC,IAAI;QACtE,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC;QAE1C,IAAI,CAAC,QAAQ,CAAC,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;IACpC;IAEA,oBAAoB,GAAA;AAClB,QAAA,IAAI,IAAI,CAAC,UAAU,IAAI,IAAI,CAAC,QAAQ,EAAE;AACpC,YAAA,IAAI,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE;gBAC/E,IAAI,CAAC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,UAAU,CAAC;AAC3C,YAAA;AACF,QAAA;IACH;IAEA,MAAM,GAAA;AACJ,QAAA,MAAM,EAAE,aAAa,EAAE,GAAG,IAAI,CAAC,OAAO;AACtC,QAAA,MAAM,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC,KAAK;AAC/B,QAAA,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK;AAEhC,QAAA,IAAI,aAAa;AAAE,YAAA,OAAO,QAAQ;QAElC,OAAO,IAAI,CAAC,UAAU,IAAI,SAAS,GAAG,YAAY,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,CAAC,GAAG,IAAI;IACtF;AACD;AAED,MAAM,CAAC,WAAW,GAAG,aAAa;;;;"}
@@ -0,0 +1,27 @@
1
+ 'use strict';
2
+
3
+ var React = require('react');
4
+
5
+ function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
6
+
7
+ var React__default = /*#__PURE__*/_interopDefaultCompat(React);
8
+
9
+ const PortalContext = React.createContext({ disablePortal: false });
10
+ const DISABLE_PORTAL_VALUE = { disablePortal: true };
11
+ /**
12
+ * Instructs all descendant `Portal` instances to render inline instead of into a portal node.
13
+ *
14
+ * Use this when rendering portal-using components (e.g. `ActionMenu`) inside an already-portalled
15
+ * container (e.g. `ToastsLayout`) to prevent z-index and stacking-context conflicts. No prop drilling
16
+ * required — any `Portal` anywhere in the subtree will automatically opt out of portalling.
17
+ *
18
+ * @example
19
+ * <DisablePortals>
20
+ * <ActionMenu /> {/* ActionMenu's internal Portal renders inline *\/}
21
+ * </DisablePortals>
22
+ */
23
+ const DisablePortals = ({ children }) => (React__default.default.createElement(PortalContext.Provider, { value: DISABLE_PORTAL_VALUE }, children));
24
+
25
+ exports.DisablePortals = DisablePortals;
26
+ exports.PortalContext = PortalContext;
27
+ //# sourceMappingURL=PortalContext.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PortalContext.cjs","sources":["../../../src/components/Portal/PortalContext.tsx"],"sourcesContent":["import React, { createContext, ReactNode } from 'react';\nimport type { PortalContextValue } from './types';\n\nexport const PortalContext = createContext<PortalContextValue>({ disablePortal: false });\n\nconst DISABLE_PORTAL_VALUE = { disablePortal: true };\n\n/**\n * Instructs all descendant `Portal` instances to render inline instead of into a portal node.\n *\n * Use this when rendering portal-using components (e.g. `ActionMenu`) inside an already-portalled\n * container (e.g. `ToastsLayout`) to prevent z-index and stacking-context conflicts. No prop drilling\n * required — any `Portal` anywhere in the subtree will automatically opt out of portalling.\n *\n * @example\n * <DisablePortals>\n * <ActionMenu /> {/* ActionMenu's internal Portal renders inline *\\/}\n * </DisablePortals>\n */\nexport const DisablePortals = ({ children }: { children: ReactNode }) => (\n <PortalContext.Provider value={DISABLE_PORTAL_VALUE}>{children}</PortalContext.Provider>\n);\n"],"names":["createContext","React"],"mappings":";;;;;;;;AAGO,MAAM,aAAa,GAAGA,mBAAa,CAAqB,EAAE,aAAa,EAAE,KAAK,EAAE;AAEvF,MAAM,oBAAoB,GAAG,EAAE,aAAa,EAAE,IAAI,EAAE;AAEpD;;;;;;;;;;;AAWG;AACI,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAA2B,MAClEC,qCAAC,aAAa,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,oBAAoB,EAAA,EAAG,QAAQ,CAA0B;;;;;"}
@@ -0,0 +1,18 @@
1
+ import React, { ReactNode } from 'react';
2
+ import type { PortalContextValue } from './types';
3
+ export declare const PortalContext: React.Context<PortalContextValue>;
4
+ /**
5
+ * Instructs all descendant `Portal` instances to render inline instead of into a portal node.
6
+ *
7
+ * Use this when rendering portal-using components (e.g. `ActionMenu`) inside an already-portalled
8
+ * container (e.g. `ToastsLayout`) to prevent z-index and stacking-context conflicts. No prop drilling
9
+ * required — any `Portal` anywhere in the subtree will automatically opt out of portalling.
10
+ *
11
+ * @example
12
+ * <DisablePortals>
13
+ * <ActionMenu /> {/* ActionMenu's internal Portal renders inline *\/}
14
+ * </DisablePortals>
15
+ */
16
+ export declare const DisablePortals: ({ children }: {
17
+ children: ReactNode;
18
+ }) => React.JSX.Element;
@@ -0,0 +1,20 @@
1
+ import React__default, { createContext } from 'react';
2
+
3
+ const PortalContext = createContext({ disablePortal: false });
4
+ const DISABLE_PORTAL_VALUE = { disablePortal: true };
5
+ /**
6
+ * Instructs all descendant `Portal` instances to render inline instead of into a portal node.
7
+ *
8
+ * Use this when rendering portal-using components (e.g. `ActionMenu`) inside an already-portalled
9
+ * container (e.g. `ToastsLayout`) to prevent z-index and stacking-context conflicts. No prop drilling
10
+ * required — any `Portal` anywhere in the subtree will automatically opt out of portalling.
11
+ *
12
+ * @example
13
+ * <DisablePortals>
14
+ * <ActionMenu /> {/* ActionMenu's internal Portal renders inline *\/}
15
+ * </DisablePortals>
16
+ */
17
+ const DisablePortals = ({ children }) => (React__default.createElement(PortalContext.Provider, { value: DISABLE_PORTAL_VALUE }, children));
18
+
19
+ export { DisablePortals, PortalContext };
20
+ //# sourceMappingURL=PortalContext.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"PortalContext.js","sources":["../../../src/components/Portal/PortalContext.tsx"],"sourcesContent":["import React, { createContext, ReactNode } from 'react';\nimport type { PortalContextValue } from './types';\n\nexport const PortalContext = createContext<PortalContextValue>({ disablePortal: false });\n\nconst DISABLE_PORTAL_VALUE = { disablePortal: true };\n\n/**\n * Instructs all descendant `Portal` instances to render inline instead of into a portal node.\n *\n * Use this when rendering portal-using components (e.g. `ActionMenu`) inside an already-portalled\n * container (e.g. `ToastsLayout`) to prevent z-index and stacking-context conflicts. No prop drilling\n * required — any `Portal` anywhere in the subtree will automatically opt out of portalling.\n *\n * @example\n * <DisablePortals>\n * <ActionMenu /> {/* ActionMenu's internal Portal renders inline *\\/}\n * </DisablePortals>\n */\nexport const DisablePortals = ({ children }: { children: ReactNode }) => (\n <PortalContext.Provider value={DISABLE_PORTAL_VALUE}>{children}</PortalContext.Provider>\n);\n"],"names":["React"],"mappings":";;AAGO,MAAM,aAAa,GAAG,aAAa,CAAqB,EAAE,aAAa,EAAE,KAAK,EAAE;AAEvF,MAAM,oBAAoB,GAAG,EAAE,aAAa,EAAE,IAAI,EAAE;AAEpD;;;;;;;;;;;AAWG;AACI,MAAM,cAAc,GAAG,CAAC,EAAE,QAAQ,EAA2B,MAClEA,6BAAC,aAAa,CAAC,QAAQ,EAAA,EAAC,KAAK,EAAE,oBAAoB,EAAA,EAAG,QAAQ,CAA0B;;;;"}
@@ -1 +1,2 @@
1
1
  export { Portal } from './Portal';
2
+ export { DisablePortals } from './PortalContext';
@@ -0,0 +1,13 @@
1
+ import type { ReactNode } from 'react';
2
+ /** Props for the Portal component */
3
+ export type PortalProps = {
4
+ /** Content to render inside the portal */
5
+ children: ReactNode;
6
+ /** Optional element to attach the portal node to. Defaults to `document.body` or the last open dialog. */
7
+ rootElementRef?: HTMLElement;
8
+ };
9
+ /** Internal context value consumed by Portal to determine whether to skip portalling */
10
+ export type PortalContextValue = {
11
+ /** When `true`, Portal renders children inline instead of into a portal */
12
+ disablePortal: boolean;
13
+ };
@@ -21,6 +21,9 @@ export declare const sizeScale: SizeScale;
21
21
  export declare const sizeAliases: SizeScale;
22
22
  declare const sizes: SizeScale;
23
23
  export type Size = keyof typeof sizes;
24
+ /**
25
+ * @deprecated Stack is deprecated and will be removed in a future release. Replaced by `FlexCol` and `FlexRow`.
26
+ */
24
27
  export type StackProps = {
25
28
  /**
26
29
  * Direction of component
@@ -4,6 +4,7 @@ var React = require('react');
4
4
  var framerMotion = require('framer-motion');
5
5
  var TooltipPopover = require('./components/TooltipPopover.cjs');
6
6
  var Portal = require('../Portal/Portal.cjs');
7
+ require('../Portal/PortalContext.cjs');
7
8
  var buildClassnames = require('../../utils/buildClassnames.cjs');
8
9
  require('uid/secure');
9
10
  var Tooltip_module = require('./Tooltip.module.scss.cjs');
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.cjs","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode, useState } from 'react';\nimport { AnimatePresence } from 'framer-motion';\nimport { TooltipProps } from './types';\nimport { TooltipPopover } from './components/TooltipPopover';\nimport { LegacyClassNames } from './components/types';\nimport { Portal } from '../Portal';\nimport { buildClassnames } from '../../utils';\nimport tooltipStyles from './Tooltip.module.scss';\n\nconst WithOptionalPortal: React.FC<{ usePortal: boolean; children: ReactNode }> = ({\n usePortal = false,\n children,\n // eslint-disable-next-line react/jsx-no-useless-fragment\n}) => (usePortal ? <Portal>{children}</Portal> : <>{children}</>);\n\nexport const Tooltip = ({\n children,\n text,\n content,\n config,\n reversed = false,\n className,\n hoverableClassName,\n withTriangle,\n initialShouldShow = false,\n useReactPortal = true,\n}: TooltipProps): ReactElement | null => {\n const [shouldShow, setShouldShow] = useState(initialShouldShow);\n const [hoverableElement, setHoverableElement] = useState<HTMLDivElement | null>(null);\n\n const hasText = text ? text.trim().length > 0 : false;\n const hasContent = !!(content || hasText);\n\n // Backward-compatible suffix classes for monolith consumers that\n // target sub-elements via the className prefix convention.\n const legacyClassNames: LegacyClassNames | undefined = className\n ? {\n tip: `${className}-tip`,\n wrap: `${className}-wrap`,\n triangle: `${className}-triangle`,\n }\n : undefined;\n\n if (!hasContent) return children;\n\n const show = () => setShouldShow(true);\n const hide = () => setShouldShow(false);\n\n return (\n <div className={buildClassnames([tooltipStyles.container, className, className && `${className}-container`])}>\n <AnimatePresence>\n {shouldShow && (\n <WithOptionalPortal usePortal={useReactPortal}>\n <TooltipPopover\n key=\"tooltip-popover\"\n hoverableElement={hoverableElement}\n config={config}\n reversed={reversed}\n withTriangle={withTriangle}\n text={text}\n content={content}\n legacyClassNames={legacyClassNames}\n />\n </WithOptionalPortal>\n )}\n </AnimatePresence>\n\n <div\n ref={setHoverableElement}\n className={buildClassnames([tooltipStyles.hoverable, hoverableClassName, className && `${className}-hoverable`])}\n onMouseEnter={show}\n onMouseLeave={hide}\n >\n {children}\n </div>\n </div>\n );\n};\n"],"names":["React","Portal","useState","buildClassnames","tooltipStyles","AnimatePresence","TooltipPopover"],"mappings":";;;;;;;;;;;;;;AASA,MAAM,kBAAkB,GAA0D,CAAC,EACjF,SAAS,GAAG,KAAK,EACjB,QAAQ;AACR;AACD,EAAA,MAAM,SAAS,GAAGA,sBAAA,CAAA,aAAA,CAACC,aAAM,QAAE,QAAQ,CAAU,GAAGD,4EAAG,QAAQ,CAAI,CAAC;AAE1D,MAAM,OAAO,GAAG,CAAC,EACtB,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,GAAG,KAAK,EACzB,cAAc,GAAG,IAAI,GACR,KAAyB;IACtC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGE,cAAQ,CAAC,iBAAiB,CAAC;IAC/D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAGA,cAAQ,CAAwB,IAAI,CAAC;AAErF,IAAA,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK;IACrD,MAAM,UAAU,GAAG,CAAC,EAAE,OAAO,IAAI,OAAO,CAAC;;;IAIzC,MAAM,gBAAgB,GAAiC;AACrD,UAAE;YACE,GAAG,EAAE,CAAA,EAAG,SAAS,CAAA,IAAA,CAAM;YACvB,IAAI,EAAE,CAAA,EAAG,SAAS,CAAA,KAAA,CAAO;YACzB,QAAQ,EAAE,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW;AAClC;UACD,SAAS;AAEb,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAO,QAAQ;IAEhC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,IAAI,CAAC;IACtC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,KAAK,CAAC;AAEvC,IAAA,QACEF,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEG,+BAAe,CAAC,CAACC,cAAa,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,IAAI,GAAG,SAAS,CAAA,UAAA,CAAY,CAAC,CAAC,EAAA;QAC1GJ,sBAAA,CAAA,aAAA,CAACK,4BAAe,EAAA,IAAA,EACb,UAAU,KACTL,qCAAC,kBAAkB,EAAA,EAAC,SAAS,EAAE,cAAc,EAAA;AAC3C,YAAAA,sBAAA,CAAA,aAAA,CAACM,6BAAc,EAAA,EACb,GAAG,EAAC,iBAAiB,EACrB,gBAAgB,EAAE,gBAAgB,EAClC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE,gBAAgB,EAAA,CAClC,CACiB,CACtB,CACe;AAElB,QAAAN,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,mBAAmB,EACxB,SAAS,EAAEG,+BAAe,CAAC,CAACC,cAAa,CAAC,SAAS,EAAE,kBAAkB,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,YAAY,CAAC,CAAC,EAChH,YAAY,EAAE,IAAI,EAClB,YAAY,EAAE,IAAI,EAAA,EAEjB,QAAQ,CACL,CACF;AAEV;;;;"}
1
+ {"version":3,"file":"Tooltip.cjs","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode, useState } from 'react';\nimport { AnimatePresence } from 'framer-motion';\nimport { TooltipProps } from './types';\nimport { TooltipPopover } from './components/TooltipPopover';\nimport { LegacyClassNames } from './components/types';\nimport { Portal } from '../Portal';\nimport { buildClassnames } from '../../utils';\nimport tooltipStyles from './Tooltip.module.scss';\n\nconst WithOptionalPortal: React.FC<{ usePortal: boolean; children: ReactNode }> = ({\n usePortal = false,\n children,\n // eslint-disable-next-line react/jsx-no-useless-fragment\n}) => (usePortal ? <Portal>{children}</Portal> : <>{children}</>);\n\nexport const Tooltip = ({\n children,\n text,\n content,\n config,\n reversed = false,\n className,\n hoverableClassName,\n withTriangle,\n initialShouldShow = false,\n useReactPortal = true,\n}: TooltipProps): ReactElement | null => {\n const [shouldShow, setShouldShow] = useState(initialShouldShow);\n const [hoverableElement, setHoverableElement] = useState<HTMLDivElement | null>(null);\n\n const hasText = text ? text.trim().length > 0 : false;\n const hasContent = !!(content || hasText);\n\n // Backward-compatible suffix classes for monolith consumers that\n // target sub-elements via the className prefix convention.\n const legacyClassNames: LegacyClassNames | undefined = className\n ? {\n tip: `${className}-tip`,\n wrap: `${className}-wrap`,\n triangle: `${className}-triangle`,\n }\n : undefined;\n\n if (!hasContent) return children;\n\n const show = () => setShouldShow(true);\n const hide = () => setShouldShow(false);\n\n return (\n <div className={buildClassnames([tooltipStyles.container, className, className && `${className}-container`])}>\n <AnimatePresence>\n {shouldShow && (\n <WithOptionalPortal usePortal={useReactPortal}>\n <TooltipPopover\n key=\"tooltip-popover\"\n hoverableElement={hoverableElement}\n config={config}\n reversed={reversed}\n withTriangle={withTriangle}\n text={text}\n content={content}\n legacyClassNames={legacyClassNames}\n />\n </WithOptionalPortal>\n )}\n </AnimatePresence>\n\n <div\n ref={setHoverableElement}\n className={buildClassnames([tooltipStyles.hoverable, hoverableClassName, className && `${className}-hoverable`])}\n onMouseEnter={show}\n onMouseLeave={hide}\n >\n {children}\n </div>\n </div>\n );\n};\n"],"names":["React","Portal","useState","buildClassnames","tooltipStyles","AnimatePresence","TooltipPopover"],"mappings":";;;;;;;;;;;;;;;AASA,MAAM,kBAAkB,GAA0D,CAAC,EACjF,SAAS,GAAG,KAAK,EACjB,QAAQ;AACR;AACD,EAAA,MAAM,SAAS,GAAGA,sBAAA,CAAA,aAAA,CAACC,aAAM,QAAE,QAAQ,CAAU,GAAGD,4EAAG,QAAQ,CAAI,CAAC;AAE1D,MAAM,OAAO,GAAG,CAAC,EACtB,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,GAAG,KAAK,EACzB,cAAc,GAAG,IAAI,GACR,KAAyB;IACtC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAGE,cAAQ,CAAC,iBAAiB,CAAC;IAC/D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAGA,cAAQ,CAAwB,IAAI,CAAC;AAErF,IAAA,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK;IACrD,MAAM,UAAU,GAAG,CAAC,EAAE,OAAO,IAAI,OAAO,CAAC;;;IAIzC,MAAM,gBAAgB,GAAiC;AACrD,UAAE;YACE,GAAG,EAAE,CAAA,EAAG,SAAS,CAAA,IAAA,CAAM;YACvB,IAAI,EAAE,CAAA,EAAG,SAAS,CAAA,KAAA,CAAO;YACzB,QAAQ,EAAE,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW;AAClC;UACD,SAAS;AAEb,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAO,QAAQ;IAEhC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,IAAI,CAAC;IACtC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,KAAK,CAAC;AAEvC,IAAA,QACEF,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAEG,+BAAe,CAAC,CAACC,cAAa,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,IAAI,GAAG,SAAS,CAAA,UAAA,CAAY,CAAC,CAAC,EAAA;QAC1GJ,sBAAA,CAAA,aAAA,CAACK,4BAAe,EAAA,IAAA,EACb,UAAU,KACTL,qCAAC,kBAAkB,EAAA,EAAC,SAAS,EAAE,cAAc,EAAA;AAC3C,YAAAA,sBAAA,CAAA,aAAA,CAACM,6BAAc,EAAA,EACb,GAAG,EAAC,iBAAiB,EACrB,gBAAgB,EAAE,gBAAgB,EAClC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE,gBAAgB,EAAA,CAClC,CACiB,CACtB,CACe;AAElB,QAAAN,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,mBAAmB,EACxB,SAAS,EAAEG,+BAAe,CAAC,CAACC,cAAa,CAAC,SAAS,EAAE,kBAAkB,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,YAAY,CAAC,CAAC,EAChH,YAAY,EAAE,IAAI,EAClB,YAAY,EAAE,IAAI,EAAA,EAEjB,QAAQ,CACL,CACF;AAEV;;;;"}
@@ -2,6 +2,7 @@ import React__default, { useState } from 'react';
2
2
  import { AnimatePresence } from 'framer-motion';
3
3
  import { TooltipPopover } from './components/TooltipPopover.js';
4
4
  import { Portal } from '../Portal/Portal.js';
5
+ import '../Portal/PortalContext.js';
5
6
  import { buildClassnames } from '../../utils/buildClassnames.js';
6
7
  import 'uid/secure';
7
8
  import tooltipStyles from './Tooltip.module.scss.js';
@@ -1 +1 @@
1
- {"version":3,"file":"Tooltip.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode, useState } from 'react';\nimport { AnimatePresence } from 'framer-motion';\nimport { TooltipProps } from './types';\nimport { TooltipPopover } from './components/TooltipPopover';\nimport { LegacyClassNames } from './components/types';\nimport { Portal } from '../Portal';\nimport { buildClassnames } from '../../utils';\nimport tooltipStyles from './Tooltip.module.scss';\n\nconst WithOptionalPortal: React.FC<{ usePortal: boolean; children: ReactNode }> = ({\n usePortal = false,\n children,\n // eslint-disable-next-line react/jsx-no-useless-fragment\n}) => (usePortal ? <Portal>{children}</Portal> : <>{children}</>);\n\nexport const Tooltip = ({\n children,\n text,\n content,\n config,\n reversed = false,\n className,\n hoverableClassName,\n withTriangle,\n initialShouldShow = false,\n useReactPortal = true,\n}: TooltipProps): ReactElement | null => {\n const [shouldShow, setShouldShow] = useState(initialShouldShow);\n const [hoverableElement, setHoverableElement] = useState<HTMLDivElement | null>(null);\n\n const hasText = text ? text.trim().length > 0 : false;\n const hasContent = !!(content || hasText);\n\n // Backward-compatible suffix classes for monolith consumers that\n // target sub-elements via the className prefix convention.\n const legacyClassNames: LegacyClassNames | undefined = className\n ? {\n tip: `${className}-tip`,\n wrap: `${className}-wrap`,\n triangle: `${className}-triangle`,\n }\n : undefined;\n\n if (!hasContent) return children;\n\n const show = () => setShouldShow(true);\n const hide = () => setShouldShow(false);\n\n return (\n <div className={buildClassnames([tooltipStyles.container, className, className && `${className}-container`])}>\n <AnimatePresence>\n {shouldShow && (\n <WithOptionalPortal usePortal={useReactPortal}>\n <TooltipPopover\n key=\"tooltip-popover\"\n hoverableElement={hoverableElement}\n config={config}\n reversed={reversed}\n withTriangle={withTriangle}\n text={text}\n content={content}\n legacyClassNames={legacyClassNames}\n />\n </WithOptionalPortal>\n )}\n </AnimatePresence>\n\n <div\n ref={setHoverableElement}\n className={buildClassnames([tooltipStyles.hoverable, hoverableClassName, className && `${className}-hoverable`])}\n onMouseEnter={show}\n onMouseLeave={hide}\n >\n {children}\n </div>\n </div>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;;AASA,MAAM,kBAAkB,GAA0D,CAAC,EACjF,SAAS,GAAG,KAAK,EACjB,QAAQ;AACR;AACD,EAAA,MAAM,SAAS,GAAGA,cAAA,CAAA,aAAA,CAAC,MAAM,QAAE,QAAQ,CAAU,GAAGA,4DAAG,QAAQ,CAAI,CAAC;AAE1D,MAAM,OAAO,GAAG,CAAC,EACtB,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,GAAG,KAAK,EACzB,cAAc,GAAG,IAAI,GACR,KAAyB;IACtC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,iBAAiB,CAAC;IAC/D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAwB,IAAI,CAAC;AAErF,IAAA,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK;IACrD,MAAM,UAAU,GAAG,CAAC,EAAE,OAAO,IAAI,OAAO,CAAC;;;IAIzC,MAAM,gBAAgB,GAAiC;AACrD,UAAE;YACE,GAAG,EAAE,CAAA,EAAG,SAAS,CAAA,IAAA,CAAM;YACvB,IAAI,EAAE,CAAA,EAAG,SAAS,CAAA,KAAA,CAAO;YACzB,QAAQ,EAAE,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW;AAClC;UACD,SAAS;AAEb,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAO,QAAQ;IAEhC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,IAAI,CAAC;IACtC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,KAAK,CAAC;AAEvC,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,eAAe,CAAC,CAAC,aAAa,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,IAAI,GAAG,SAAS,CAAA,UAAA,CAAY,CAAC,CAAC,EAAA;QAC1GA,cAAA,CAAA,aAAA,CAAC,eAAe,EAAA,IAAA,EACb,UAAU,KACTA,6BAAC,kBAAkB,EAAA,EAAC,SAAS,EAAE,cAAc,EAAA;AAC3C,YAAAA,cAAA,CAAA,aAAA,CAAC,cAAc,EAAA,EACb,GAAG,EAAC,iBAAiB,EACrB,gBAAgB,EAAE,gBAAgB,EAClC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE,gBAAgB,EAAA,CAClC,CACiB,CACtB,CACe;AAElB,QAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,mBAAmB,EACxB,SAAS,EAAE,eAAe,CAAC,CAAC,aAAa,CAAC,SAAS,EAAE,kBAAkB,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,YAAY,CAAC,CAAC,EAChH,YAAY,EAAE,IAAI,EAClB,YAAY,EAAE,IAAI,EAAA,EAEjB,QAAQ,CACL,CACF;AAEV;;;;"}
1
+ {"version":3,"file":"Tooltip.js","sources":["../../../src/components/Tooltip/Tooltip.tsx"],"sourcesContent":["import React, { ReactElement, ReactNode, useState } from 'react';\nimport { AnimatePresence } from 'framer-motion';\nimport { TooltipProps } from './types';\nimport { TooltipPopover } from './components/TooltipPopover';\nimport { LegacyClassNames } from './components/types';\nimport { Portal } from '../Portal';\nimport { buildClassnames } from '../../utils';\nimport tooltipStyles from './Tooltip.module.scss';\n\nconst WithOptionalPortal: React.FC<{ usePortal: boolean; children: ReactNode }> = ({\n usePortal = false,\n children,\n // eslint-disable-next-line react/jsx-no-useless-fragment\n}) => (usePortal ? <Portal>{children}</Portal> : <>{children}</>);\n\nexport const Tooltip = ({\n children,\n text,\n content,\n config,\n reversed = false,\n className,\n hoverableClassName,\n withTriangle,\n initialShouldShow = false,\n useReactPortal = true,\n}: TooltipProps): ReactElement | null => {\n const [shouldShow, setShouldShow] = useState(initialShouldShow);\n const [hoverableElement, setHoverableElement] = useState<HTMLDivElement | null>(null);\n\n const hasText = text ? text.trim().length > 0 : false;\n const hasContent = !!(content || hasText);\n\n // Backward-compatible suffix classes for monolith consumers that\n // target sub-elements via the className prefix convention.\n const legacyClassNames: LegacyClassNames | undefined = className\n ? {\n tip: `${className}-tip`,\n wrap: `${className}-wrap`,\n triangle: `${className}-triangle`,\n }\n : undefined;\n\n if (!hasContent) return children;\n\n const show = () => setShouldShow(true);\n const hide = () => setShouldShow(false);\n\n return (\n <div className={buildClassnames([tooltipStyles.container, className, className && `${className}-container`])}>\n <AnimatePresence>\n {shouldShow && (\n <WithOptionalPortal usePortal={useReactPortal}>\n <TooltipPopover\n key=\"tooltip-popover\"\n hoverableElement={hoverableElement}\n config={config}\n reversed={reversed}\n withTriangle={withTriangle}\n text={text}\n content={content}\n legacyClassNames={legacyClassNames}\n />\n </WithOptionalPortal>\n )}\n </AnimatePresence>\n\n <div\n ref={setHoverableElement}\n className={buildClassnames([tooltipStyles.hoverable, hoverableClassName, className && `${className}-hoverable`])}\n onMouseEnter={show}\n onMouseLeave={hide}\n >\n {children}\n </div>\n </div>\n );\n};\n"],"names":["React"],"mappings":";;;;;;;;;AASA,MAAM,kBAAkB,GAA0D,CAAC,EACjF,SAAS,GAAG,KAAK,EACjB,QAAQ;AACR;AACD,EAAA,MAAM,SAAS,GAAGA,cAAA,CAAA,aAAA,CAAC,MAAM,QAAE,QAAQ,CAAU,GAAGA,4DAAG,QAAQ,CAAI,CAAC;AAE1D,MAAM,OAAO,GAAG,CAAC,EACtB,QAAQ,EACR,IAAI,EACJ,OAAO,EACP,MAAM,EACN,QAAQ,GAAG,KAAK,EAChB,SAAS,EACT,kBAAkB,EAClB,YAAY,EACZ,iBAAiB,GAAG,KAAK,EACzB,cAAc,GAAG,IAAI,GACR,KAAyB;IACtC,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,iBAAiB,CAAC;IAC/D,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAwB,IAAI,CAAC;AAErF,IAAA,MAAM,OAAO,GAAG,IAAI,GAAG,IAAI,CAAC,IAAI,EAAE,CAAC,MAAM,GAAG,CAAC,GAAG,KAAK;IACrD,MAAM,UAAU,GAAG,CAAC,EAAE,OAAO,IAAI,OAAO,CAAC;;;IAIzC,MAAM,gBAAgB,GAAiC;AACrD,UAAE;YACE,GAAG,EAAE,CAAA,EAAG,SAAS,CAAA,IAAA,CAAM;YACvB,IAAI,EAAE,CAAA,EAAG,SAAS,CAAA,KAAA,CAAO;YACzB,QAAQ,EAAE,CAAA,EAAG,SAAS,CAAA,SAAA,CAAW;AAClC;UACD,SAAS;AAEb,IAAA,IAAI,CAAC,UAAU;AAAE,QAAA,OAAO,QAAQ;IAEhC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,IAAI,CAAC;IACtC,MAAM,IAAI,GAAG,MAAM,aAAa,CAAC,KAAK,CAAC;AAEvC,IAAA,QACEA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,eAAe,CAAC,CAAC,aAAa,CAAC,SAAS,EAAE,SAAS,EAAE,SAAS,IAAI,GAAG,SAAS,CAAA,UAAA,CAAY,CAAC,CAAC,EAAA;QAC1GA,cAAA,CAAA,aAAA,CAAC,eAAe,EAAA,IAAA,EACb,UAAU,KACTA,6BAAC,kBAAkB,EAAA,EAAC,SAAS,EAAE,cAAc,EAAA;AAC3C,YAAAA,cAAA,CAAA,aAAA,CAAC,cAAc,EAAA,EACb,GAAG,EAAC,iBAAiB,EACrB,gBAAgB,EAAE,gBAAgB,EAClC,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,QAAQ,EAClB,YAAY,EAAE,YAAY,EAC1B,IAAI,EAAE,IAAI,EACV,OAAO,EAAE,OAAO,EAChB,gBAAgB,EAAE,gBAAgB,EAAA,CAClC,CACiB,CACtB,CACe;AAElB,QAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EACE,GAAG,EAAE,mBAAmB,EACxB,SAAS,EAAE,eAAe,CAAC,CAAC,aAAa,CAAC,SAAS,EAAE,kBAAkB,EAAE,SAAS,IAAI,CAAA,EAAG,SAAS,YAAY,CAAC,CAAC,EAChH,YAAY,EAAE,IAAI,EAClB,YAAY,EAAE,IAAI,EAAA,EAEjB,QAAQ,CACL,CACF;AAEV;;;;"}
@@ -1 +1 @@
1
- {"version":3,"file":"types.cjs","sources":["../../../src/components/View/types.ts"],"sourcesContent":["import { ReactElement } from 'react';\nimport { ColourPalette } from '../../theme/modules/colors';\n\nexport type ViewId = string;\n\nexport enum ViewTypes {\n saved = 'saved',\n fixed = 'fixed',\n draft = 'draft',\n}\n\nexport interface ViewProps {\n /** ClassName to override styles on outer root element */\n className?: string;\n\n /** Colour palette for the view */\n colourPalette?: ColourPalette;\n\n /** customTextColour - Custom Rest State colour */\n customTextColour?: string;\n\n /** Flag to toggle active state styles on the Tab */\n active?: boolean;\n\n /** View name, eg.: Jade's view */\n name: string;\n\n /** IconSlot for passing */\n iconSlot?: ReactElement;\n\n /** View's unique identifier */\n id: ViewId;\n\n /** View type */\n type?: keyof typeof ViewTypes;\n\n /** Number or string value to show near view label */\n count?: number | string;\n\n /** Event handler for when View component is clicked (should get activated) */\n onClick: (id: ViewId) => void;\n\n /** Event handler for when user clicks the delete/cross icon */\n onDelete?: (id: ViewId) => void;\n\n /** Event handler for when user clicks to edit the view */\n onEdit?: (id: ViewId) => void;\n\n /** Class name for e2e testing */\n e2eClassName?: string;\n}\n"],"names":["ViewTypes"],"mappings":";;AAKYA;AAAZ,CAAA,UAAY,SAAS,EAAA;AACnB,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACjB,CAAC,EAJWA,iBAAS,KAATA,iBAAS,GAAA,EAAA,CAAA,CAAA;;"}
1
+ {"version":3,"file":"types.cjs","sources":["../../../src/components/View/types.ts"],"sourcesContent":["import { ReactElement } from 'react';\nimport { ColourPalette } from '../../theme/modules/colors';\n\nexport type ViewId = string;\n\nexport enum ViewTypes {\n saved = 'saved',\n fixed = 'fixed',\n draft = 'draft',\n}\n\n/**\n * @deprecated View is deprecated and will be removed in a future release. Use the `ViewTab` component instead.\n */\nexport interface ViewProps {\n /** ClassName to override styles on outer root element */\n className?: string;\n\n /** Colour palette for the view */\n colourPalette?: ColourPalette;\n\n /** customTextColour - Custom Rest State colour */\n customTextColour?: string;\n\n /** Flag to toggle active state styles on the Tab */\n active?: boolean;\n\n /** View name, eg.: Jade's view */\n name: string;\n\n /** IconSlot for passing */\n iconSlot?: ReactElement;\n\n /** View's unique identifier */\n id: ViewId;\n\n /** View type */\n type?: keyof typeof ViewTypes;\n\n /** Number or string value to show near view label */\n count?: number | string;\n\n /** Event handler for when View component is clicked (should get activated) */\n onClick: (id: ViewId) => void;\n\n /** Event handler for when user clicks the delete/cross icon */\n onDelete?: (id: ViewId) => void;\n\n /** Event handler for when user clicks to edit the view */\n onEdit?: (id: ViewId) => void;\n\n /** Class name for e2e testing */\n e2eClassName?: string;\n}\n"],"names":["ViewTypes"],"mappings":";;AAKYA;AAAZ,CAAA,UAAY,SAAS,EAAA;AACnB,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACjB,CAAC,EAJWA,iBAAS,KAATA,iBAAS,GAAA,EAAA,CAAA,CAAA;;"}
@@ -6,6 +6,9 @@ export declare enum ViewTypes {
6
6
  fixed = "fixed",
7
7
  draft = "draft"
8
8
  }
9
+ /**
10
+ * @deprecated View is deprecated and will be removed in a future release. Use the `ViewTab` component instead.
11
+ */
9
12
  export interface ViewProps {
10
13
  /** ClassName to override styles on outer root element */
11
14
  className?: string;
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sources":["../../../src/components/View/types.ts"],"sourcesContent":["import { ReactElement } from 'react';\nimport { ColourPalette } from '../../theme/modules/colors';\n\nexport type ViewId = string;\n\nexport enum ViewTypes {\n saved = 'saved',\n fixed = 'fixed',\n draft = 'draft',\n}\n\nexport interface ViewProps {\n /** ClassName to override styles on outer root element */\n className?: string;\n\n /** Colour palette for the view */\n colourPalette?: ColourPalette;\n\n /** customTextColour - Custom Rest State colour */\n customTextColour?: string;\n\n /** Flag to toggle active state styles on the Tab */\n active?: boolean;\n\n /** View name, eg.: Jade's view */\n name: string;\n\n /** IconSlot for passing */\n iconSlot?: ReactElement;\n\n /** View's unique identifier */\n id: ViewId;\n\n /** View type */\n type?: keyof typeof ViewTypes;\n\n /** Number or string value to show near view label */\n count?: number | string;\n\n /** Event handler for when View component is clicked (should get activated) */\n onClick: (id: ViewId) => void;\n\n /** Event handler for when user clicks the delete/cross icon */\n onDelete?: (id: ViewId) => void;\n\n /** Event handler for when user clicks to edit the view */\n onEdit?: (id: ViewId) => void;\n\n /** Class name for e2e testing */\n e2eClassName?: string;\n}\n"],"names":[],"mappings":"IAKY;AAAZ,CAAA,UAAY,SAAS,EAAA;AACnB,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACjB,CAAC,EAJW,SAAS,KAAT,SAAS,GAAA,EAAA,CAAA,CAAA;;;;"}
1
+ {"version":3,"file":"types.js","sources":["../../../src/components/View/types.ts"],"sourcesContent":["import { ReactElement } from 'react';\nimport { ColourPalette } from '../../theme/modules/colors';\n\nexport type ViewId = string;\n\nexport enum ViewTypes {\n saved = 'saved',\n fixed = 'fixed',\n draft = 'draft',\n}\n\n/**\n * @deprecated View is deprecated and will be removed in a future release. Use the `ViewTab` component instead.\n */\nexport interface ViewProps {\n /** ClassName to override styles on outer root element */\n className?: string;\n\n /** Colour palette for the view */\n colourPalette?: ColourPalette;\n\n /** customTextColour - Custom Rest State colour */\n customTextColour?: string;\n\n /** Flag to toggle active state styles on the Tab */\n active?: boolean;\n\n /** View name, eg.: Jade's view */\n name: string;\n\n /** IconSlot for passing */\n iconSlot?: ReactElement;\n\n /** View's unique identifier */\n id: ViewId;\n\n /** View type */\n type?: keyof typeof ViewTypes;\n\n /** Number or string value to show near view label */\n count?: number | string;\n\n /** Event handler for when View component is clicked (should get activated) */\n onClick: (id: ViewId) => void;\n\n /** Event handler for when user clicks the delete/cross icon */\n onDelete?: (id: ViewId) => void;\n\n /** Event handler for when user clicks to edit the view */\n onEdit?: (id: ViewId) => void;\n\n /** Class name for e2e testing */\n e2eClassName?: string;\n}\n"],"names":[],"mappings":"IAKY;AAAZ,CAAA,UAAY,SAAS,EAAA;AACnB,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,SAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACjB,CAAC,EAJW,SAAS,KAAT,SAAS,GAAA,EAAA,CAAA,CAAA;;;;"}
@@ -44,7 +44,7 @@ export { Modal, type Action as ModalAction } from './Modal';
44
44
  export { Pagination } from './Pagination';
45
45
  export { Popover } from './Popover';
46
46
  export { Popup, type PopupProps } from './Popup';
47
- export { Portal } from './Portal';
47
+ export { Portal, DisablePortals } from './Portal';
48
48
  export { PriceInput } from './PriceInput';
49
49
  export { Radio } from './Radio';
50
50
  export { ScreenReaderOnly } from './ScreenReaderOnly';
package/dist/index.cjs CHANGED
@@ -53,6 +53,7 @@ var Pagination = require('./components/Pagination/Pagination.cjs');
53
53
  var Popover = require('./components/Popover/Popover.cjs');
54
54
  var Popup = require('./components/Popup/Popup.cjs');
55
55
  var Portal = require('./components/Portal/Portal.cjs');
56
+ var PortalContext = require('./components/Portal/PortalContext.cjs');
56
57
  var PriceInput = require('./components/PriceInput/PriceInput.cjs');
57
58
  var Radio = require('./components/Radio/Radio.cjs');
58
59
  var ScreenReaderOnly = require('./components/ScreenReaderOnly/ScreenReaderOnly.cjs');
@@ -412,6 +413,7 @@ exports.Pagination = Pagination.Pagination;
412
413
  exports.Popover = Popover.Popover;
413
414
  exports.Popup = Popup.Popup;
414
415
  exports.Portal = Portal.Portal;
416
+ exports.DisablePortals = PortalContext.DisablePortals;
415
417
  exports.PriceInput = PriceInput.PriceInput;
416
418
  exports.Radio = Radio.Radio;
417
419
  exports.ScreenReaderOnly = ScreenReaderOnly.ScreenReaderOnly;
@@ -1 +1 @@
1
- {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/dist/index.js CHANGED
@@ -51,6 +51,7 @@ export { Pagination } from './components/Pagination/Pagination.js';
51
51
  export { Popover } from './components/Popover/Popover.js';
52
52
  export { Popup } from './components/Popup/Popup.js';
53
53
  export { Portal } from './components/Portal/Portal.js';
54
+ export { DisablePortals } from './components/Portal/PortalContext.js';
54
55
  export { PriceInput } from './components/PriceInput/PriceInput.js';
55
56
  export { Radio } from './components/Radio/Radio.js';
56
57
  export { ScreenReaderOnly } from './components/ScreenReaderOnly/ScreenReaderOnly.js';
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
@@ -2,8 +2,8 @@
2
2
 
3
3
  var ___$insertStyle = require('../../_virtual/____insertStyle.cjs');
4
4
 
5
- ___$insertStyle("._fullStyles_4dcpo_1 {\n --outline-size: var(--sizes-xs);\n --border-color: var(--colors-neutral-ink-lightest);\n --shadow-color: var(--colors-secondary-blue-light);\n}\n._fullStyles_4dcpo_1:disabled, ._fullStyles_4dcpo_1[data-disabled] {\n opacity: 1;\n box-shadow: none;\n background-color: var(--colors-neutral-grey-light);\n cursor: not-allowed;\n}\n._fullStyles_4dcpo_1._compact_4dcpo_12 {\n --outline-size: 2px;\n min-height: var(--sizes-8);\n}\n._fullStyles_4dcpo_1._error_4dcpo_16 {\n --border-color: var(--colors-secondary-red-base);\n --shadow-color: var(--colors-secondary-red-light);\n}\n._fullStyles_4dcpo_1:focus {\n border-color: var(--border-color);\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n outline: 0;\n}\n._fullStyles_4dcpo_1::placeholder {\n font-family: var(--text-placeholder-font-family);\n font-style: var(--text-placeholder-font-style);\n font-weight: var(--text-placeholder-font-weight);\n font-size: var(--text-placeholder-font-size);\n line-height: var(--text-placeholder-line-height);\n color: var(--text-placeholder-color);\n text-decoration: var(--text-placeholder-text-decoration);\n letter-spacing: var(--text-placeholder-letter-spacing);\n}\n._fullStyles_4dcpo_1:invalid {\n box-shadow: 0 0 0 var(--outline-size) var(--border-color);\n border-color: var(--colors-secondary-red-base);\n}\n\n._base_4dcpo_40 {\n font-family: var(--text-body-font-family);\n font-style: var(--text-body-font-style);\n font-weight: var(--text-body-font-weight);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n color: var(--text-body-color);\n text-decoration: var(--text-body-text-decoration);\n letter-spacing: var(--text-body-letter-spacing);\n appearance: none;\n box-sizing: border-box;\n background-color: white;\n text-align: left;\n min-height: var(--sizes-10);\n padding-inline: var(--sizes-3);\n border-radius: var(--radius-base);\n border: 1px solid var(--border-color);\n display: flex;\n align-items: center;\n justify-content: flex-start;\n /* When inside an InputGroup, reduce inline padding to bring content closer together */\n}\n._base_4dcpo_40._inputGroup_4dcpo_62:first-child {\n padding-right: calc(var(--sizes-3) - var(--sizes-1));\n}\n._base_4dcpo_40._inputGroup_4dcpo_62:last-child {\n padding-left: var(--sizes-2);\n}\n._base_4dcpo_40._inputGroup_4dcpo_62:not(:first-child):not(:last-child) {\n padding-inline: var(--sizes-2);\n}\n\n/** InputGroup styles from the InputGroup component */\n._inputGroup_4dcpo_62 {\n display: flex;\n /* Remove inline margins from all children */\n /* Bring in-focus and active children to the front to maintain outlines */\n /* Remove inline borders for children in the middle */\n /* Remove right border radius from first child */\n /* Remove left border radius from last child */\n}\n._inputGroup_4dcpo_62 > * {\n margin-left: 0;\n margin-right: 0;\n box-shadow: none;\n}\n._inputGroup_4dcpo_62 > *:focus, ._inputGroup_4dcpo_62 > *:active {\n z-index: 5;\n}\n._inputGroup_4dcpo_62 > *:not(:first-child):not(:last-child) {\n border-radius: 0 !important;\n border-inline: 0 !important;\n}\n._inputGroup_4dcpo_62 > *:first-child {\n border-top-right-radius: 0 !important;\n border-bottom-right-radius: 0 !important;\n border-right: 0 !important;\n}\n._inputGroup_4dcpo_62 > *:last-child {\n border-top-left-radius: 0 !important;\n border-bottom-left-radius: 0 !important;\n border-left: 0 !important;\n}");
6
- var formStyles = {"fullStyles":"_fullStyles_4dcpo_1","compact":"_compact_4dcpo_12","error":"_error_4dcpo_16","base":"_base_4dcpo_40","inputGroup":"_inputGroup_4dcpo_62"};
5
+ ___$insertStyle("._fullStyles_1x1rs_1 {\n --outline-size: var(--sizes-xs);\n --border-color: var(--colors-neutral-ink-lightest);\n --shadow-color: var(--colors-secondary-blue-light);\n}\n._fullStyles_1x1rs_1:disabled, ._fullStyles_1x1rs_1[data-disabled] {\n opacity: 1;\n box-shadow: none;\n background-color: var(--colors-neutral-grey-light);\n cursor: not-allowed;\n}\n._fullStyles_1x1rs_1._compact_1x1rs_12 {\n --outline-size: 2px;\n min-height: var(--sizes-8);\n}\n._fullStyles_1x1rs_1._error_1x1rs_16 {\n --border-color: var(--colors-secondary-red-base);\n --shadow-color: var(--colors-secondary-red-light);\n}\n._fullStyles_1x1rs_1:focus {\n border-color: var(--border-color);\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n outline: 0;\n}\n._fullStyles_1x1rs_1::placeholder {\n font-family: var(--text-placeholder-font-family);\n font-style: var(--text-placeholder-font-style);\n font-weight: var(--text-placeholder-font-weight);\n font-size: var(--text-placeholder-font-size);\n line-height: var(--text-placeholder-line-height);\n color: var(--text-placeholder-color);\n text-decoration: var(--text-placeholder-text-decoration);\n letter-spacing: var(--text-placeholder-letter-spacing);\n}\n._fullStyles_1x1rs_1:invalid {\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n border-color: var(--colors-secondary-red-base);\n}\n\n._base_1x1rs_40 {\n font-family: var(--text-body-font-family);\n font-style: var(--text-body-font-style);\n font-weight: var(--text-body-font-weight);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n color: var(--text-body-color);\n text-decoration: var(--text-body-text-decoration);\n letter-spacing: var(--text-body-letter-spacing);\n appearance: none;\n box-sizing: border-box;\n background-color: white;\n text-align: left;\n min-height: var(--sizes-10);\n padding-inline: var(--sizes-3);\n border-radius: var(--radius-base);\n border: 1px solid var(--border-color);\n display: flex;\n align-items: center;\n justify-content: flex-start;\n /* When inside an InputGroup, reduce inline padding to bring content closer together */\n}\n._base_1x1rs_40._inputGroup_1x1rs_62:first-child {\n padding-right: calc(var(--sizes-3) - var(--sizes-1));\n}\n._base_1x1rs_40._inputGroup_1x1rs_62:last-child {\n padding-left: var(--sizes-2);\n}\n._base_1x1rs_40._inputGroup_1x1rs_62:not(:first-child):not(:last-child) {\n padding-inline: var(--sizes-2);\n}\n\n/** InputGroup styles from the InputGroup component */\n._inputGroup_1x1rs_62 {\n display: flex;\n /* Remove inline margins from all children */\n /* Bring in-focus and active children to the front to maintain outlines */\n /* Remove inline borders for children in the middle */\n /* Remove right border radius from first child */\n /* Remove left border radius from last child */\n}\n._inputGroup_1x1rs_62 > * {\n margin-left: 0;\n margin-right: 0;\n box-shadow: none;\n}\n._inputGroup_1x1rs_62 > *:focus, ._inputGroup_1x1rs_62 > *:active {\n z-index: 5;\n}\n._inputGroup_1x1rs_62 > *:not(:first-child):not(:last-child) {\n border-radius: 0 !important;\n border-inline: 0 !important;\n}\n._inputGroup_1x1rs_62 > *:first-child {\n border-top-right-radius: 0 !important;\n border-bottom-right-radius: 0 !important;\n border-right: 0 !important;\n}\n._inputGroup_1x1rs_62 > *:last-child {\n border-top-left-radius: 0 !important;\n border-bottom-left-radius: 0 !important;\n border-left: 0 !important;\n}");
6
+ var formStyles = {"fullStyles":"_fullStyles_1x1rs_1","compact":"_compact_1x1rs_12","error":"_error_1x1rs_16","base":"_base_1x1rs_40","inputGroup":"_inputGroup_1x1rs_62"};
7
7
 
8
8
  module.exports = formStyles;
9
9
  //# sourceMappingURL=form.module.scss.cjs.map
@@ -1,7 +1,7 @@
1
1
  import insertStyle from '../../_virtual/____insertStyle.js';
2
2
 
3
- insertStyle("._fullStyles_4dcpo_1 {\n --outline-size: var(--sizes-xs);\n --border-color: var(--colors-neutral-ink-lightest);\n --shadow-color: var(--colors-secondary-blue-light);\n}\n._fullStyles_4dcpo_1:disabled, ._fullStyles_4dcpo_1[data-disabled] {\n opacity: 1;\n box-shadow: none;\n background-color: var(--colors-neutral-grey-light);\n cursor: not-allowed;\n}\n._fullStyles_4dcpo_1._compact_4dcpo_12 {\n --outline-size: 2px;\n min-height: var(--sizes-8);\n}\n._fullStyles_4dcpo_1._error_4dcpo_16 {\n --border-color: var(--colors-secondary-red-base);\n --shadow-color: var(--colors-secondary-red-light);\n}\n._fullStyles_4dcpo_1:focus {\n border-color: var(--border-color);\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n outline: 0;\n}\n._fullStyles_4dcpo_1::placeholder {\n font-family: var(--text-placeholder-font-family);\n font-style: var(--text-placeholder-font-style);\n font-weight: var(--text-placeholder-font-weight);\n font-size: var(--text-placeholder-font-size);\n line-height: var(--text-placeholder-line-height);\n color: var(--text-placeholder-color);\n text-decoration: var(--text-placeholder-text-decoration);\n letter-spacing: var(--text-placeholder-letter-spacing);\n}\n._fullStyles_4dcpo_1:invalid {\n box-shadow: 0 0 0 var(--outline-size) var(--border-color);\n border-color: var(--colors-secondary-red-base);\n}\n\n._base_4dcpo_40 {\n font-family: var(--text-body-font-family);\n font-style: var(--text-body-font-style);\n font-weight: var(--text-body-font-weight);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n color: var(--text-body-color);\n text-decoration: var(--text-body-text-decoration);\n letter-spacing: var(--text-body-letter-spacing);\n appearance: none;\n box-sizing: border-box;\n background-color: white;\n text-align: left;\n min-height: var(--sizes-10);\n padding-inline: var(--sizes-3);\n border-radius: var(--radius-base);\n border: 1px solid var(--border-color);\n display: flex;\n align-items: center;\n justify-content: flex-start;\n /* When inside an InputGroup, reduce inline padding to bring content closer together */\n}\n._base_4dcpo_40._inputGroup_4dcpo_62:first-child {\n padding-right: calc(var(--sizes-3) - var(--sizes-1));\n}\n._base_4dcpo_40._inputGroup_4dcpo_62:last-child {\n padding-left: var(--sizes-2);\n}\n._base_4dcpo_40._inputGroup_4dcpo_62:not(:first-child):not(:last-child) {\n padding-inline: var(--sizes-2);\n}\n\n/** InputGroup styles from the InputGroup component */\n._inputGroup_4dcpo_62 {\n display: flex;\n /* Remove inline margins from all children */\n /* Bring in-focus and active children to the front to maintain outlines */\n /* Remove inline borders for children in the middle */\n /* Remove right border radius from first child */\n /* Remove left border radius from last child */\n}\n._inputGroup_4dcpo_62 > * {\n margin-left: 0;\n margin-right: 0;\n box-shadow: none;\n}\n._inputGroup_4dcpo_62 > *:focus, ._inputGroup_4dcpo_62 > *:active {\n z-index: 5;\n}\n._inputGroup_4dcpo_62 > *:not(:first-child):not(:last-child) {\n border-radius: 0 !important;\n border-inline: 0 !important;\n}\n._inputGroup_4dcpo_62 > *:first-child {\n border-top-right-radius: 0 !important;\n border-bottom-right-radius: 0 !important;\n border-right: 0 !important;\n}\n._inputGroup_4dcpo_62 > *:last-child {\n border-top-left-radius: 0 !important;\n border-bottom-left-radius: 0 !important;\n border-left: 0 !important;\n}");
4
- var formStyles = {"fullStyles":"_fullStyles_4dcpo_1","compact":"_compact_4dcpo_12","error":"_error_4dcpo_16","base":"_base_4dcpo_40","inputGroup":"_inputGroup_4dcpo_62"};
3
+ insertStyle("._fullStyles_1x1rs_1 {\n --outline-size: var(--sizes-xs);\n --border-color: var(--colors-neutral-ink-lightest);\n --shadow-color: var(--colors-secondary-blue-light);\n}\n._fullStyles_1x1rs_1:disabled, ._fullStyles_1x1rs_1[data-disabled] {\n opacity: 1;\n box-shadow: none;\n background-color: var(--colors-neutral-grey-light);\n cursor: not-allowed;\n}\n._fullStyles_1x1rs_1._compact_1x1rs_12 {\n --outline-size: 2px;\n min-height: var(--sizes-8);\n}\n._fullStyles_1x1rs_1._error_1x1rs_16 {\n --border-color: var(--colors-secondary-red-base);\n --shadow-color: var(--colors-secondary-red-light);\n}\n._fullStyles_1x1rs_1:focus {\n border-color: var(--border-color);\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n outline: 0;\n}\n._fullStyles_1x1rs_1::placeholder {\n font-family: var(--text-placeholder-font-family);\n font-style: var(--text-placeholder-font-style);\n font-weight: var(--text-placeholder-font-weight);\n font-size: var(--text-placeholder-font-size);\n line-height: var(--text-placeholder-line-height);\n color: var(--text-placeholder-color);\n text-decoration: var(--text-placeholder-text-decoration);\n letter-spacing: var(--text-placeholder-letter-spacing);\n}\n._fullStyles_1x1rs_1:invalid {\n box-shadow: 0 0 0 var(--outline-size) var(--shadow-color);\n border-color: var(--colors-secondary-red-base);\n}\n\n._base_1x1rs_40 {\n font-family: var(--text-body-font-family);\n font-style: var(--text-body-font-style);\n font-weight: var(--text-body-font-weight);\n font-size: var(--text-body-font-size);\n line-height: var(--text-body-line-height);\n color: var(--text-body-color);\n text-decoration: var(--text-body-text-decoration);\n letter-spacing: var(--text-body-letter-spacing);\n appearance: none;\n box-sizing: border-box;\n background-color: white;\n text-align: left;\n min-height: var(--sizes-10);\n padding-inline: var(--sizes-3);\n border-radius: var(--radius-base);\n border: 1px solid var(--border-color);\n display: flex;\n align-items: center;\n justify-content: flex-start;\n /* When inside an InputGroup, reduce inline padding to bring content closer together */\n}\n._base_1x1rs_40._inputGroup_1x1rs_62:first-child {\n padding-right: calc(var(--sizes-3) - var(--sizes-1));\n}\n._base_1x1rs_40._inputGroup_1x1rs_62:last-child {\n padding-left: var(--sizes-2);\n}\n._base_1x1rs_40._inputGroup_1x1rs_62:not(:first-child):not(:last-child) {\n padding-inline: var(--sizes-2);\n}\n\n/** InputGroup styles from the InputGroup component */\n._inputGroup_1x1rs_62 {\n display: flex;\n /* Remove inline margins from all children */\n /* Bring in-focus and active children to the front to maintain outlines */\n /* Remove inline borders for children in the middle */\n /* Remove right border radius from first child */\n /* Remove left border radius from last child */\n}\n._inputGroup_1x1rs_62 > * {\n margin-left: 0;\n margin-right: 0;\n box-shadow: none;\n}\n._inputGroup_1x1rs_62 > *:focus, ._inputGroup_1x1rs_62 > *:active {\n z-index: 5;\n}\n._inputGroup_1x1rs_62 > *:not(:first-child):not(:last-child) {\n border-radius: 0 !important;\n border-inline: 0 !important;\n}\n._inputGroup_1x1rs_62 > *:first-child {\n border-top-right-radius: 0 !important;\n border-bottom-right-radius: 0 !important;\n border-right: 0 !important;\n}\n._inputGroup_1x1rs_62 > *:last-child {\n border-top-left-radius: 0 !important;\n border-bottom-left-radius: 0 !important;\n border-left: 0 !important;\n}");
4
+ var formStyles = {"fullStyles":"_fullStyles_1x1rs_1","compact":"_compact_1x1rs_12","error":"_error_1x1rs_16","base":"_base_1x1rs_40","inputGroup":"_inputGroup_1x1rs_62"};
5
5
 
6
6
  export { formStyles as default };
7
7
  //# sourceMappingURL=form.module.scss.js.map
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@veeqo/ui",
3
- "version": "15.7.0",
3
+ "version": "15.8.0",
4
4
  "description": "New optimised component library for Veeqo.",
5
5
  "author": "Robert Wealthall",
6
6
  "license": "ISC",
@@ -1 +0,0 @@
1
- {"version":3,"file":"base.module.scss.cjs","sources":["../../../../src/components/Action/styles/base.module.scss"],"sourcesContent":[".reset {\n appearance: none;\n border: 0;\n background-color: transparent;\n padding: unset;\n font: inherit;\n text-decoration: none;\n text-align: start;\n color: inherit;\n\n &:hover {\n cursor: pointer;\n }\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,mPAAA;AACA,iBAAA,CAAA,OAAA,CAAA,gBAAA;;;;"}
@@ -1 +0,0 @@
1
- {"version":3,"file":"base.module.scss.js","sources":["../../../../src/components/Action/styles/base.module.scss"],"sourcesContent":[".reset {\n appearance: none;\n border: 0;\n background-color: transparent;\n padding: unset;\n font: inherit;\n text-decoration: none;\n text-align: start;\n color: inherit;\n\n &:hover {\n cursor: pointer;\n }\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,mPAAA;AACA,iBAAA,CAAA,OAAA,CAAA,gBAAA;;;;"}