@veeqo/ui 13.4.5 → 13.5.0

package/dist/components/Container/Container.cjs

@@ -0,0 +1,37 @@
+'use strict';
+
+var React = require('react');
+var buildClassnames = require('../../utils/buildClassnames.cjs');
+require('uid/secure');
+var Container_module = require('./Container.module.scss.cjs');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+const sizeClasses = {
+    small: Container_module.small,
+    medium: Container_module.medium,
+    large: Container_module.large,
+};
+/**
+ * Warning: This component uses container queries, and they don't work well when used on an element that is a direct child
+ * of a flexbox or grid container. This is because the element doesn't have a defined width, so the container
+ * query can't be resolved correctly.
+ *
+ * If you need to use multiple Container components stacked vertically, consider wrapping them in a div and using
+ * margins to apply spacing between them if necessary.
+ */
+function Container({ size, children, className, ...otherProps }) {
+    const classNames = buildClassnames.buildClassnames([
+        className,
+        Container_module.container,
+        size && Container_module.centered,
+        size && sizeClasses[size],
+    ]);
+    return (React__default.default.createElement("div", { className: classNames, ...otherProps }, children));
+}
+
+exports.Container = Container;
+exports.sizeClasses = sizeClasses;
+//# sourceMappingURL=Container.cjs.map

package/dist/components/Container/Container.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.cjs","sources":["../../../src/components/Container/Container.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../utils';\nimport styles from './Container.module.scss';\n\nexport const sizeClasses = {\n  small: styles.small,\n  medium: styles.medium,\n  large: styles.large,\n};\n\nexport type ContainerSize = keyof typeof sizeClasses;\n\nexport type ContainerProps = React.HTMLAttributes<HTMLDivElement> & {\n  size?: ContainerSize;\n  children: React.ReactNode;\n};\n\n/**\n * Warning: This component uses container queries, and they don't work well when used on an element that is a direct child\n * of a flexbox or grid container. This is because the element doesn't have a defined width, so the container\n * query can't be resolved correctly.\n *\n * If you need to use multiple Container components stacked vertically, consider wrapping them in a div and using\n * margins to apply spacing between them if necessary.\n */\nexport function Container({ size, children, className, ...otherProps }: ContainerProps) {\n  const classNames = buildClassnames([\n    className,\n    styles.container,\n    size && styles.centered,\n    size && sizeClasses[size],\n  ]);\n\n  return (\n    <div className={classNames} {...otherProps}>\n      {children}\n    </div>\n  );\n}\n"],"names":["styles","buildClassnames","React"],"mappings":";;;;;;;;;;;AAIa,MAAA,WAAW,GAAG;IACzB,KAAK,EAAEA,gBAAM,CAAC,KAAK;IACnB,MAAM,EAAEA,gBAAM,CAAC,MAAM;IACrB,KAAK,EAAEA,gBAAM,CAAC,KAAK;;AAUrB;;;;;;;AAOG;AACa,SAAA,SAAS,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,UAAU,EAAkB,EAAA;IACpF,MAAM,UAAU,GAAGC,+BAAe,CAAC;QACjC,SAAS;AACT,QAAAD,gBAAM,CAAC,SAAS;QAChB,IAAI,IAAIA,gBAAM,CAAC,QAAQ;AACvB,QAAA,IAAI,IAAI,WAAW,CAAC,IAAI,CAAC;AAC1B,KAAA,CAAC;IAEF,QACEE,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,EAAM,GAAA,UAAU,EACvC,EAAA,QAAQ,CACL;AAEV;;;;;"}

package/dist/components/Container/Container.d.ts

@@ -0,0 +1,20 @@
+import React from 'react';
+export declare const sizeClasses: {
+    small: any;
+    medium: any;
+    large: any;
+};
+export type ContainerSize = keyof typeof sizeClasses;
+export type ContainerProps = React.HTMLAttributes<HTMLDivElement> & {
+    size?: ContainerSize;
+    children: React.ReactNode;
+};
+/**
+ * Warning: This component uses container queries, and they don't work well when used on an element that is a direct child
+ * of a flexbox or grid container. This is because the element doesn't have a defined width, so the container
+ * query can't be resolved correctly.
+ *
+ * If you need to use multiple Container components stacked vertically, consider wrapping them in a div and using
+ * margins to apply spacing between them if necessary.
+ */
+export declare function Container({ size, children, className, ...otherProps }: ContainerProps): React.JSX.Element;

package/dist/components/Container/Container.js

@@ -0,0 +1,30 @@
+import React__default from 'react';
+import { buildClassnames } from '../../utils/buildClassnames.js';
+import 'uid/secure';
+import styles from './Container.module.scss.js';
+
+const sizeClasses = {
+    small: styles.small,
+    medium: styles.medium,
+    large: styles.large,
+};
+/**
+ * Warning: This component uses container queries, and they don't work well when used on an element that is a direct child
+ * of a flexbox or grid container. This is because the element doesn't have a defined width, so the container
+ * query can't be resolved correctly.
+ *
+ * If you need to use multiple Container components stacked vertically, consider wrapping them in a div and using
+ * margins to apply spacing between them if necessary.
+ */
+function Container({ size, children, className, ...otherProps }) {
+    const classNames = buildClassnames([
+        className,
+        styles.container,
+        size && styles.centered,
+        size && sizeClasses[size],
+    ]);
+    return (React__default.createElement("div", { className: classNames, ...otherProps }, children));
+}
+
+export { Container, sizeClasses };
+//# sourceMappingURL=Container.js.map

package/dist/components/Container/Container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.js","sources":["../../../src/components/Container/Container.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../utils';\nimport styles from './Container.module.scss';\n\nexport const sizeClasses = {\n  small: styles.small,\n  medium: styles.medium,\n  large: styles.large,\n};\n\nexport type ContainerSize = keyof typeof sizeClasses;\n\nexport type ContainerProps = React.HTMLAttributes<HTMLDivElement> & {\n  size?: ContainerSize;\n  children: React.ReactNode;\n};\n\n/**\n * Warning: This component uses container queries, and they don't work well when used on an element that is a direct child\n * of a flexbox or grid container. This is because the element doesn't have a defined width, so the container\n * query can't be resolved correctly.\n *\n * If you need to use multiple Container components stacked vertically, consider wrapping them in a div and using\n * margins to apply spacing between them if necessary.\n */\nexport function Container({ size, children, className, ...otherProps }: ContainerProps) {\n  const classNames = buildClassnames([\n    className,\n    styles.container,\n    size && styles.centered,\n    size && sizeClasses[size],\n  ]);\n\n  return (\n    <div className={classNames} {...otherProps}>\n      {children}\n    </div>\n  );\n}\n"],"names":["React"],"mappings":";;;;;AAIa,MAAA,WAAW,GAAG;IACzB,KAAK,EAAE,MAAM,CAAC,KAAK;IACnB,MAAM,EAAE,MAAM,CAAC,MAAM;IACrB,KAAK,EAAE,MAAM,CAAC,KAAK;;AAUrB;;;;;;;AAOG;AACa,SAAA,SAAS,CAAC,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,GAAG,UAAU,EAAkB,EAAA;IACpF,MAAM,UAAU,GAAG,eAAe,CAAC;QACjC,SAAS;AACT,QAAA,MAAM,CAAC,SAAS;QAChB,IAAI,IAAI,MAAM,CAAC,QAAQ;AACvB,QAAA,IAAI,IAAI,WAAW,CAAC,IAAI,CAAC;AAC1B,KAAA,CAAC;IAEF,QACEA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,EAAM,GAAA,UAAU,EACvC,EAAA,QAAQ,CACL;AAEV;;;;"}

package/dist/components/Container/Container.module.scss.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+var ___$insertStyle = require('../../_virtual/____insertStyle.cjs');
+
+___$insertStyle("._container_tqie6_1 {\n  container-type: inline-size;\n}\n\n._centered_tqie6_5 {\n  margin-inline: auto;\n  padding-inline: var(--sizes-6);\n}\n\n._small_tqie6_10 {\n  max-width: 540px;\n}\n\n._medium_tqie6_14 {\n  max-width: 720px;\n}\n\n._large_tqie6_18 {\n  max-width: 960px;\n}");
+var styles = {"container":"_container_tqie6_1","centered":"_centered_tqie6_5","small":"_small_tqie6_10","medium":"_medium_tqie6_14","large":"_large_tqie6_18"};
+
+module.exports = styles;
+//# sourceMappingURL=Container.module.scss.cjs.map

package/dist/components/Container/Container.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.module.scss.cjs","sources":["../../../src/components/Container/Container.module.scss"],"sourcesContent":[".container {\n  container-type: inline-size;\n}\n\n.centered {\n  margin-inline: auto;\n  padding-inline: var(--sizes-6);\n}\n\n.small {\n  max-width: 540px;\n}\n\n.medium {\n  max-width: 720px;\n}\n\n.large {\n  max-width: 960px;\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,2RAAA;;;;;"}

package/dist/components/Container/Container.module.scss.js

@@ -0,0 +1,7 @@
+import insertStyle from '../../_virtual/____insertStyle.js';
+
+insertStyle("._container_tqie6_1 {\n  container-type: inline-size;\n}\n\n._centered_tqie6_5 {\n  margin-inline: auto;\n  padding-inline: var(--sizes-6);\n}\n\n._small_tqie6_10 {\n  max-width: 540px;\n}\n\n._medium_tqie6_14 {\n  max-width: 720px;\n}\n\n._large_tqie6_18 {\n  max-width: 960px;\n}");
+var styles = {"container":"_container_tqie6_1","centered":"_centered_tqie6_5","small":"_small_tqie6_10","medium":"_medium_tqie6_14","large":"_large_tqie6_18"};
+
+export { styles as default };
+//# sourceMappingURL=Container.module.scss.js.map

package/dist/components/Container/Container.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Container.module.scss.js","sources":["../../../src/components/Container/Container.module.scss"],"sourcesContent":[".container {\n  container-type: inline-size;\n}\n\n.centered {\n  margin-inline: auto;\n  padding-inline: var(--sizes-6);\n}\n\n.small {\n  max-width: 540px;\n}\n\n.medium {\n  max-width: 720px;\n}\n\n.large {\n  max-width: 960px;\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,2RAAA;;;;;"}

package/dist/components/Container/index.d.ts

@@ -0,0 +1 @@
+export { Container } from './Container';

package/dist/components/Divider/Divider.cjs

@@ -0,0 +1,18 @@
+'use strict';
+
+var React = require('react');
+var buildClassnames = require('../../utils/buildClassnames.cjs');
+require('uid/secure');
+var Divider_module = require('./Divider.module.scss.cjs');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+function Divider({ className, ...otherProps }) {
+    const classNames = buildClassnames.buildClassnames([Divider_module.divider, className]);
+    return React__default.default.createElement("div", { className: classNames, ...otherProps });
+}
+
+exports.Divider = Divider;
+//# sourceMappingURL=Divider.cjs.map

package/dist/components/Divider/Divider.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.cjs","sources":["../../../src/components/Divider/Divider.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../utils';\nimport styles from './Divider.module.scss';\n\ntype DividerProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport function Divider({ className, ...otherProps }: DividerProps) {\n  const classNames = buildClassnames([styles.divider, className]);\n  return <div className={classNames} {...otherProps} />;\n}\n"],"names":["buildClassnames","styles","React"],"mappings":";;;;;;;;;;;AAMM,SAAU,OAAO,CAAC,EAAE,SAAS,EAAE,GAAG,UAAU,EAAgB,EAAA;AAChE,IAAA,MAAM,UAAU,GAAGA,+BAAe,CAAC,CAACC,cAAM,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;AAC/D,IAAA,OAAOC,8CAAK,SAAS,EAAE,UAAU,EAAM,GAAA,UAAU,GAAI;AACvD;;;;"}

package/dist/components/Divider/Divider.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+type DividerProps = React.HTMLAttributes<HTMLDivElement>;
+export declare function Divider({ className, ...otherProps }: DividerProps): React.JSX.Element;
+export {};

package/dist/components/Divider/Divider.js

@@ -0,0 +1,12 @@
+import React__default from 'react';
+import { buildClassnames } from '../../utils/buildClassnames.js';
+import 'uid/secure';
+import styles from './Divider.module.scss.js';
+
+function Divider({ className, ...otherProps }) {
+    const classNames = buildClassnames([styles.divider, className]);
+    return React__default.createElement("div", { className: classNames, ...otherProps });
+}
+
+export { Divider };
+//# sourceMappingURL=Divider.js.map

package/dist/components/Divider/Divider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.js","sources":["../../../src/components/Divider/Divider.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../utils';\nimport styles from './Divider.module.scss';\n\ntype DividerProps = React.HTMLAttributes<HTMLDivElement>;\n\nexport function Divider({ className, ...otherProps }: DividerProps) {\n  const classNames = buildClassnames([styles.divider, className]);\n  return <div className={classNames} {...otherProps} />;\n}\n"],"names":["React"],"mappings":";;;;;AAMM,SAAU,OAAO,CAAC,EAAE,SAAS,EAAE,GAAG,UAAU,EAAgB,EAAA;AAChE,IAAA,MAAM,UAAU,GAAG,eAAe,CAAC,CAAC,MAAM,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;AAC/D,IAAA,OAAOA,sCAAK,SAAS,EAAE,UAAU,EAAM,GAAA,UAAU,GAAI;AACvD;;;;"}

package/dist/components/Divider/Divider.module.scss.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+var ___$insertStyle = require('../../_virtual/____insertStyle.cjs');
+
+___$insertStyle("._divider_1bzcp_1 {\n  height: var(--sizes-line);\n  background-color: var(--colors-neutral-grey-base);\n}");
+var styles = {"divider":"_divider_1bzcp_1"};
+
+module.exports = styles;
+//# sourceMappingURL=Divider.module.scss.cjs.map

package/dist/components/Divider/Divider.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.module.scss.cjs","sources":["../../../src/components/Divider/Divider.module.scss"],"sourcesContent":[".divider {\n  height: var(--sizes-line);\n  background-color: var(--colors-neutral-grey-base);\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,4GAAA;AACA,aAAA,CAAA,SAAA,CAAA,kBAAA;;;;"}

package/dist/components/Divider/Divider.module.scss.js

@@ -0,0 +1,7 @@
+import insertStyle from '../../_virtual/____insertStyle.js';
+
+insertStyle("._divider_1bzcp_1 {\n  height: var(--sizes-line);\n  background-color: var(--colors-neutral-grey-base);\n}");
+var styles = {"divider":"_divider_1bzcp_1"};
+
+export { styles as default };
+//# sourceMappingURL=Divider.module.scss.js.map

package/dist/components/Divider/Divider.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Divider.module.scss.js","sources":["../../../src/components/Divider/Divider.module.scss"],"sourcesContent":[".divider {\n  height: var(--sizes-line);\n  background-color: var(--colors-neutral-grey-base);\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,4GAAA;AACA,aAAA,CAAA,SAAA,CAAA,kBAAA;;;;"}

package/dist/components/Divider/index.d.ts

@@ -0,0 +1 @@
+export { Divider } from './Divider';

package/dist/components/SectionLayout/SectionLayout.cjs

@@ -0,0 +1,25 @@
+'use strict';
+
+var React = require('react');
+var buildClassnames = require('../../utils/buildClassnames.cjs');
+require('uid/secure');
+var FlexCol = require('../Flex/FlexCol/FlexCol.cjs');
+var Text = require('../Text/Text.cjs');
+var SectionLayout_module = require('./SectionLayout.module.scss.cjs');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefaultCompat(React);
+
+function SectionLayout({ children, title, description, accessorySlot, className, ...otherProps }) {
+    const classNames = buildClassnames.buildClassnames([SectionLayout_module.grid, className]);
+    return (React__default.default.createElement("div", { className: classNames, ...otherProps },
+        React__default.default.createElement(FlexCol.FlexCol, null,
+            React__default.default.createElement(Text.Text, { variant: "headingSmall" }, title),
+            description && React__default.default.createElement(Text.Text, { variant: "hintText" }, description),
+            accessorySlot),
+        React__default.default.createElement("div", null, children)));
+}
+
+exports.SectionLayout = SectionLayout;
+//# sourceMappingURL=SectionLayout.cjs.map

package/dist/components/SectionLayout/SectionLayout.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionLayout.cjs","sources":["../../../src/components/SectionLayout/SectionLayout.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../utils';\nimport { FlexCol } from '../Flex/FlexCol';\nimport { Text } from '../Text';\nimport styles from './SectionLayout.module.scss';\n\ntype SectionLayoutProps = React.HTMLAttributes<HTMLDivElement> & {\n  children: React.ReactNode;\n  title: string;\n  description?: string;\n  accessorySlot?: React.ReactNode;\n};\n\nexport function SectionLayout({\n  children,\n  title,\n  description,\n  accessorySlot,\n  className,\n  ...otherProps\n}: SectionLayoutProps) {\n  const classNames = buildClassnames([styles.grid, className]);\n  return (\n    <div className={classNames} {...otherProps}>\n      <FlexCol>\n        <Text variant=\"headingSmall\">{title}</Text>\n        {description && <Text variant=\"hintText\">{description}</Text>}\n        {accessorySlot}\n      </FlexCol>\n      <div>{children}</div>\n    </div>\n  );\n}\n"],"names":["buildClassnames","styles","React","FlexCol","Text"],"mappings":";;;;;;;;;;;;;SAagB,aAAa,CAAC,EAC5B,QAAQ,EACR,KAAK,EACL,WAAW,EACX,aAAa,EACb,SAAS,EACT,GAAG,UAAU,EACM,EAAA;AACnB,IAAA,MAAM,UAAU,GAAGA,+BAAe,CAAC,CAACC,oBAAM,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;AAC5D,IAAA,QACEC,sBAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,KAAM,UAAU,EAAA;AACxC,QAAAA,sBAAA,CAAA,aAAA,CAACC,eAAO,EAAA,IAAA;AACN,YAAAD,sBAAA,CAAA,aAAA,CAACE,SAAI,EAAC,EAAA,OAAO,EAAC,cAAc,EAAA,EAAE,KAAK,CAAQ;YAC1C,WAAW,IAAIF,qCAACE,SAAI,EAAA,EAAC,OAAO,EAAC,UAAU,EAAE,EAAA,WAAW,CAAQ;AAC5D,YAAA,aAAa,CACN;AACV,QAAAF,sBAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA,EAAM,QAAQ,CAAO,CACjB;AAEV;;;;"}

package/dist/components/SectionLayout/SectionLayout.d.ts

@@ -0,0 +1,9 @@
+import React from 'react';
+type SectionLayoutProps = React.HTMLAttributes<HTMLDivElement> & {
+    children: React.ReactNode;
+    title: string;
+    description?: string;
+    accessorySlot?: React.ReactNode;
+};
+export declare function SectionLayout({ children, title, description, accessorySlot, className, ...otherProps }: SectionLayoutProps): React.JSX.Element;
+export {};

package/dist/components/SectionLayout/SectionLayout.js

@@ -0,0 +1,19 @@
+import React__default from 'react';
+import { buildClassnames } from '../../utils/buildClassnames.js';
+import 'uid/secure';
+import { FlexCol } from '../Flex/FlexCol/FlexCol.js';
+import { Text } from '../Text/Text.js';
+import styles from './SectionLayout.module.scss.js';
+
+function SectionLayout({ children, title, description, accessorySlot, className, ...otherProps }) {
+    const classNames = buildClassnames([styles.grid, className]);
+    return (React__default.createElement("div", { className: classNames, ...otherProps },
+        React__default.createElement(FlexCol, null,
+            React__default.createElement(Text, { variant: "headingSmall" }, title),
+            description && React__default.createElement(Text, { variant: "hintText" }, description),
+            accessorySlot),
+        React__default.createElement("div", null, children)));
+}
+
+export { SectionLayout };
+//# sourceMappingURL=SectionLayout.js.map

package/dist/components/SectionLayout/SectionLayout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionLayout.js","sources":["../../../src/components/SectionLayout/SectionLayout.tsx"],"sourcesContent":["import React from 'react';\nimport { buildClassnames } from '../../utils';\nimport { FlexCol } from '../Flex/FlexCol';\nimport { Text } from '../Text';\nimport styles from './SectionLayout.module.scss';\n\ntype SectionLayoutProps = React.HTMLAttributes<HTMLDivElement> & {\n  children: React.ReactNode;\n  title: string;\n  description?: string;\n  accessorySlot?: React.ReactNode;\n};\n\nexport function SectionLayout({\n  children,\n  title,\n  description,\n  accessorySlot,\n  className,\n  ...otherProps\n}: SectionLayoutProps) {\n  const classNames = buildClassnames([styles.grid, className]);\n  return (\n    <div className={classNames} {...otherProps}>\n      <FlexCol>\n        <Text variant=\"headingSmall\">{title}</Text>\n        {description && <Text variant=\"hintText\">{description}</Text>}\n        {accessorySlot}\n      </FlexCol>\n      <div>{children}</div>\n    </div>\n  );\n}\n"],"names":["React"],"mappings":";;;;;;;SAagB,aAAa,CAAC,EAC5B,QAAQ,EACR,KAAK,EACL,WAAW,EACX,aAAa,EACb,SAAS,EACT,GAAG,UAAU,EACM,EAAA;AACnB,IAAA,MAAM,UAAU,GAAG,eAAe,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,SAAS,CAAC,CAAC;AAC5D,IAAA,QACEA,cAAK,CAAA,aAAA,CAAA,KAAA,EAAA,EAAA,SAAS,EAAE,UAAU,KAAM,UAAU,EAAA;AACxC,QAAAA,cAAA,CAAA,aAAA,CAAC,OAAO,EAAA,IAAA;AACN,YAAAA,cAAA,CAAA,aAAA,CAAC,IAAI,EAAC,EAAA,OAAO,EAAC,cAAc,EAAA,EAAE,KAAK,CAAQ;YAC1C,WAAW,IAAIA,6BAAC,IAAI,EAAA,EAAC,OAAO,EAAC,UAAU,EAAE,EAAA,WAAW,CAAQ;AAC5D,YAAA,aAAa,CACN;AACV,QAAAA,cAAA,CAAA,aAAA,CAAA,KAAA,EAAA,IAAA,EAAM,QAAQ,CAAO,CACjB;AAEV;;;;"}

package/dist/components/SectionLayout/SectionLayout.module.scss.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+var ___$insertStyle = require('../../_virtual/____insertStyle.cjs');
+
+___$insertStyle("._grid_o5hjx_1 {\n  display: grid;\n  grid-template-columns: 1fr 2fr;\n  gap: var(--sizes-10);\n}\n\n@container (width < 600px) {\n  ._grid_o5hjx_1 {\n    grid-template-columns: 1fr;\n    gap: var(--sizes-6);\n  }\n}");
+var styles = {"grid":"_grid_o5hjx_1"};
+
+module.exports = styles;
+//# sourceMappingURL=SectionLayout.module.scss.cjs.map

package/dist/components/SectionLayout/SectionLayout.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionLayout.module.scss.cjs","sources":["../../../src/components/SectionLayout/SectionLayout.module.scss"],"sourcesContent":[".grid {\n  display: grid;\n  grid-template-columns: 1fr 2fr;\n  gap: var(--sizes-10);\n}\n\n@container (width < 600px) {\n  .grid {\n    grid-template-columns: 1fr;\n    gap: var(--sizes-6);\n  }\n}\n"],"names":[],"mappings":";;;;AACE,eAAA,CAAA,0NAAA;AACA,aAAA,CAAA,MAAA,CAAA,eAAA;;;;"}

package/dist/components/SectionLayout/SectionLayout.module.scss.js

@@ -0,0 +1,7 @@
+import insertStyle from '../../_virtual/____insertStyle.js';
+
+insertStyle("._grid_o5hjx_1 {\n  display: grid;\n  grid-template-columns: 1fr 2fr;\n  gap: var(--sizes-10);\n}\n\n@container (width < 600px) {\n  ._grid_o5hjx_1 {\n    grid-template-columns: 1fr;\n    gap: var(--sizes-6);\n  }\n}");
+var styles = {"grid":"_grid_o5hjx_1"};
+
+export { styles as default };
+//# sourceMappingURL=SectionLayout.module.scss.js.map

package/dist/components/SectionLayout/SectionLayout.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SectionLayout.module.scss.js","sources":["../../../src/components/SectionLayout/SectionLayout.module.scss"],"sourcesContent":[".grid {\n  display: grid;\n  grid-template-columns: 1fr 2fr;\n  gap: var(--sizes-10);\n}\n\n@container (width < 600px) {\n  .grid {\n    grid-template-columns: 1fr;\n    gap: var(--sizes-6);\n  }\n}\n"],"names":["___$insertStyle"],"mappings":";;AACEA,WAAA,CAAA,0NAAA;AACA,aAAA,CAAA,MAAA,CAAA,eAAA;;;;"}

package/dist/components/SectionLayout/index.d.ts

@@ -0,0 +1 @@
+export { SectionLayout } from './SectionLayout';

package/dist/components/_internal/Placeholder.d.ts

@@ -0,0 +1,13 @@
+import React from 'react';
+/**
+ * A visual placeholder component for internal use only.
+ *
+ * This component is intended to be used within stories or development environments
+ * to visually represent empty slots or areas where content will be placed.
+ * It displays a styled box with optional children content.
+ *
+ * @internal
+ * @param style - Optional custom styles to override the default placeholder styles.
+ * @param children - Optional React nodes to display inside the placeholder.
+ */
+export declare function Placeholder({ style, children }: any): React.JSX.Element;

package/dist/components/index.d.ts

@@ -16,6 +16,7 @@ export { CardHeader } from './CardHeader';
 export { Checkbox } from './Checkbox';
 export { Choice } from './Choice';
 export { ChoiceList } from './ChoiceList';
+export { Container } from './Container';
 export { CopyToClipboard } from './CopyToClipboard';
 export { DateInputField } from './DateInputField';
 export { DatePicker } from './DatePicker';
@@ -24,6 +25,7 @@ export { DataTable, ColumnWidthsType, ColumnConfig, useCellWidths, useColumns, u
 export { DescriptionList } from './DescriptionList';
 export { DetailPage } from './DetailPage';
 export { DimensionsInput } from './DimensionsInput';
+export { Divider } from './Divider';
 export { Dropdown } from './Dropdown';
 export { FilterTag } from './FilterTag';
 export { Grid } from './Grid';
@@ -41,6 +43,7 @@ export { PriceInput } from './PriceInput';
 export { Radio } from './Radio';
 export { ScreenReaderOnly } from './ScreenReaderOnly';
 export { Search, SearchProps } from './Search';
+export { SectionLayout } from './SectionLayout';
 export { SegmentedControl } from './SegmentedControl';
 export { Select, SelectOption } from './Select';
 export { ShortcutKeys } from './ShortcutKeys';

package/dist/index.cjs

@@ -21,6 +21,7 @@ var CardHeader = require('./components/CardHeader/CardHeader.cjs');
 var Checkbox = require('./components/Checkbox/Checkbox.cjs');
 var Choice = require('./components/Choice/Choice.cjs');
 var ChoiceList = require('./components/ChoiceList/ChoiceList.cjs');
+var Container = require('./components/Container/Container.cjs');
 var CopyToClipboard = require('./components/CopyToClipboard/CopyToClipboard.cjs');
 var index = require('./components/DateInputField/index.cjs');
 var DatePicker = require('./components/DatePicker/DatePicker.cjs');
@@ -35,6 +36,7 @@ var useSelection = require('./components/DataTable/hooks/useSelection.cjs');
 var DescriptionList = require('./components/DescriptionList/DescriptionList.cjs');
 var DetailPage = require('./components/DetailPage/DetailPage.cjs');
 var DimensionsInput = require('./components/DimensionsInput/DimensionsInput.cjs');
+var Divider = require('./components/Divider/Divider.cjs');
 var Dropdown = require('./components/Dropdown/Dropdown.cjs');
 var FilterTag = require('./components/FilterTag/FilterTag.cjs');
 var index$1 = require('./components/Grid/index.cjs');
@@ -52,6 +54,7 @@ var PriceInput = require('./components/PriceInput/PriceInput.cjs');
 var Radio = require('./components/Radio/Radio.cjs');
 var ScreenReaderOnly = require('./components/ScreenReaderOnly/ScreenReaderOnly.cjs');
 var Search = require('./components/Search/Search.cjs');
+var SectionLayout = require('./components/SectionLayout/SectionLayout.cjs');
 var SegmentedControl = require('./components/SegmentedControl/SegmentedControl.cjs');
 var Select = require('./components/Select/Select.cjs');
 var ShortcutKeys = require('./components/ShortcutKeys/ShortcutKeys.cjs');
@@ -355,6 +358,7 @@ exports.CardHeader = CardHeader.CardHeader;
 exports.Checkbox = Checkbox.Checkbox;
 exports.Choice = Choice.Choice;
 exports.ChoiceList = ChoiceList.ChoiceList;
+exports.Container = Container.Container;
 exports.CopyToClipboard = CopyToClipboard.CopyToClipboard;
 exports.DateInputField = index.DateInputField;
 exports.DatePicker = DatePicker.DatePicker;
@@ -376,6 +380,7 @@ exports.useSelection = useSelection.useSelection;
 exports.DescriptionList = DescriptionList.DescriptionList;
 exports.DetailPage = DetailPage.DetailPage;
 exports.DimensionsInput = DimensionsInput.DimensionsInput;
+exports.Divider = Divider.Divider;
 exports.Dropdown = Dropdown.Dropdown;
 exports.FilterTag = FilterTag.FilterTag;
 exports.Grid = index$1.Grid;
@@ -393,6 +398,7 @@ exports.PriceInput = PriceInput.PriceInput;
 exports.Radio = Radio.Radio;
 exports.ScreenReaderOnly = ScreenReaderOnly.ScreenReaderOnly;
 exports.Search = Search.Search;
+exports.SectionLayout = SectionLayout.SectionLayout;
 exports.SegmentedControl = SegmentedControl.SegmentedControl;
 exports.Select = Select.Select;
 exports.ShortcutKeys = ShortcutKeys.ShortcutKeys;

package/dist/index.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/index.js

@@ -19,6 +19,7 @@ export { CardHeader } from './components/CardHeader/CardHeader.js';
 export { Checkbox } from './components/Checkbox/Checkbox.js';
 export { Choice } from './components/Choice/Choice.js';
 export { ChoiceList } from './components/ChoiceList/ChoiceList.js';
+export { Container } from './components/Container/Container.js';
 export { CopyToClipboard } from './components/CopyToClipboard/CopyToClipboard.js';
 export { DateInputField } from './components/DateInputField/index.js';
 export { DatePicker } from './components/DatePicker/DatePicker.js';
@@ -33,6 +34,7 @@ export { useSelection } from './components/DataTable/hooks/useSelection.js';
 export { DescriptionList } from './components/DescriptionList/DescriptionList.js';
 export { DetailPage } from './components/DetailPage/DetailPage.js';
 export { DimensionsInput } from './components/DimensionsInput/DimensionsInput.js';
+export { Divider } from './components/Divider/Divider.js';
 export { Dropdown } from './components/Dropdown/Dropdown.js';
 export { FilterTag } from './components/FilterTag/FilterTag.js';
 export { Grid } from './components/Grid/index.js';
@@ -50,6 +52,7 @@ export { PriceInput } from './components/PriceInput/PriceInput.js';
 export { Radio } from './components/Radio/Radio.js';
 export { ScreenReaderOnly } from './components/ScreenReaderOnly/ScreenReaderOnly.js';
 export { Search } from './components/Search/Search.js';
+export { SectionLayout } from './components/SectionLayout/SectionLayout.js';
 export { SegmentedControl } from './components/SegmentedControl/SegmentedControl.js';
 export { Select } from './components/Select/Select.js';
 export { ShortcutKeys } from './components/ShortcutKeys/ShortcutKeys.js';

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/testUtils/itSupportsCommonProps.d.ts

@@ -0,0 +1,6 @@
+import React from 'react';
+type Options = {
+    Component: React.ComponentType<any>;
+};
+export declare function itSupportsCommonProps({ Component }: Options): void;
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veeqo/ui",
-  "version": "13.4.5",
+  "version": "13.5.0",
   "description": "New optimised component library for Veeqo.",
   "author": "Robert Wealthall",
   "license": "ISC",