@servicetitan/anvil2 1.33.1 → 1.34.1

package/dist/{Divider-AD1Jb85d.js.map → Divider-BkObIjoj.js.map}

@@ -1 +1 @@
-{"version":3,"file":"Divider-AD1Jb85d.js","sources":["../../hammer-react/dist/Divider-DzyOJRzb.js","../src/components/Divider/Divider.tsx"],"sourcesContent":["import { jsx, jsxs, Fragment } from 'react/jsx-runtime';\nimport { forwardRef } from 'react';\nimport cx from 'classnames';\nimport { u as useLayoutPropsUtil } from './useLayoutPropsUtil-3B2XYWSr.js';\n\nimport './Divider.css';const container = \"_container_k5nkz_3\";\nconst divider = \"_divider_k5nkz_24\";\nconst content = \"_content_k5nkz_41\";\nconst vertical = \"_vertical_k5nkz_52\";\nconst styles = {\n\tcontainer: container,\n\tdivider: divider,\n\tcontent: content,\n\tvertical: vertical,\n\t\"align-start\": \"_align-start_k5nkz_58\",\n\t\"align-end\": \"_align-end_k5nkz_61\",\n\t\"spacing-0\": \"_spacing-0_k5nkz_64\",\n\t\"spacing-half\": \"_spacing-half_k5nkz_68\",\n\t\"spacing-1\": \"_spacing-1_k5nkz_72\",\n\t\"spacing-2\": \"_spacing-2_k5nkz_76\",\n\t\"spacing-3\": \"_spacing-3_k5nkz_80\",\n\t\"spacing-4\": \"_spacing-4_k5nkz_84\",\n\t\"spacing-5\": \"_spacing-5_k5nkz_88\",\n\t\"spacing-6\": \"_spacing-6_k5nkz_92\",\n\t\"spacing-8\": \"_spacing-8_k5nkz_96\",\n\t\"spacing-12\": \"_spacing-12_k5nkz_100\"\n};\n\nconst Divider = forwardRef(\n  (props, ref) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const { alignContent, ...restOfLayoutStyles } = layoutStyles;\n    const {\n      children,\n      className,\n      spacing = \"0\",\n      vertical = false,\n      style,\n      ...rest\n    } = componentProps;\n    const ContainerClasses = cx(styles[\"container\"], className, {\n      [styles[`spacing-${spacing === 0.5 ? \"half\" : spacing}`]]: spacing,\n      [styles[\"vertical\"]]: vertical,\n      [styles[\"align-start\"]]: alignContent === \"start\",\n      [styles[\"align-end\"]]: alignContent === \"end\"\n    });\n    const contentOrdering = () => {\n      if (children) {\n        if (alignContent === \"start\") {\n          return /* @__PURE__ */ jsxs(Fragment, { children: [\n            /* @__PURE__ */ jsx(\"span\", { className: styles[\"content\"], children }),\n            /* @__PURE__ */ jsx(\"hr\", { className: styles[\"divider\"] })\n          ] });\n        }\n        if (alignContent === \"end\") {\n          return /* @__PURE__ */ jsxs(Fragment, { children: [\n            /* @__PURE__ */ jsx(\"hr\", { className: styles[\"divider\"] }),\n            /* @__PURE__ */ jsx(\"span\", { className: styles[\"content\"], children })\n          ] });\n        }\n        return /* @__PURE__ */ jsxs(Fragment, { children: [\n          /* @__PURE__ */ jsx(\"hr\", { className: styles[\"divider\"] }),\n          /* @__PURE__ */ jsx(\"span\", { className: styles[\"content\"], children }),\n          /* @__PURE__ */ jsx(\"hr\", { className: styles[\"divider\"] })\n        ] });\n      }\n      return /* @__PURE__ */ jsx(\"hr\", { className: styles[\"divider\"] });\n    };\n    const styleCombined = {\n      ...style,\n      ...restOfLayoutStyles\n    };\n    return /* @__PURE__ */ jsx(\n      \"span\",\n      {\n        \"data-anv\": \"divider\",\n        ref,\n        style: styleCombined,\n        ...rest,\n        className: ContainerClasses,\n        children: contentOrdering()\n      }\n    );\n  }\n);\nDivider.displayName = \"Divider\";\n\nexport { Divider as D };\n//# sourceMappingURL=Divider-DzyOJRzb.js.map\n","import {\n  DividerProps as CoreDividerProps,\n  Divider as CoreDivider,\n} from \"@servicetitan/hammer-react\";\nimport { Ref, forwardRef } from \"react\";\n\nexport type DividerProps = CoreDividerProps;\n\nexport const Divider = forwardRef(\n  (props: DividerProps, ref: Ref<HTMLSpanElement>) => {\n    return <CoreDivider ref={ref} {...props} />;\n  },\n);\n"],"names":["Divider","CoreDivider"],"mappings":";;;;;AAKuB,MAAM,SAAS,GAAG,oBAAoB;AAC7D,MAAM,OAAO,GAAG,mBAAmB;AACnC,MAAM,OAAO,GAAG,mBAAmB;AACnC,MAAM,QAAQ,GAAG,oBAAoB;AACrC,MAAM,MAAM,GAAG;AACf,CAAC,SAAS,EAAE,SAAS;AACrB,CAAC,OAAO,EAAE,OAAO;AACjB,CAAC,OAAO,EAAE,OAAO;AACjB,CAAC,QAAQ,EAAE,QAAQ;AACnB,CAAC,aAAa,EAAE,uBAAuB;AACvC,CAAC,WAAW,EAAE,qBAAqB;AACnC,CAAC,WAAW,EAAE,qBAAqB;AACnC,CAAC,cAAc,EAAE,wBAAwB;AACzC,CAAC,WAAW,EAAE,qBAAqB;AACnC,CAAC,WAAW,EAAE,qBAAqB;AACnC,CAAC,WAAW,EAAE,qBAAqB;AACnC,CAAC,WAAW,EAAE,qBAAqB;AACnC,CAAC,WAAW,EAAE,qBAAqB;AACnC,CAAC,WAAW,EAAE,qBAAqB;AACnC,CAAC,WAAW,EAAE,qBAAqB;AACnC,CAAC,YAAY,EAAE;AACf,CAAC;;AAED,MAAMA,SAAO,GAAG,UAAU;AAC1B,EAAE,CAAC,KAAK,EAAE,GAAG,KAAK;AAClB,IAAI,MAAM,EAAE,YAAY,EAAE,cAAc,EAAE,GAAG,kBAAkB,CAAC,KAAK,CAAC;AACtE,IAAI,MAAM,EAAE,YAAY,EAAE,GAAG,kBAAkB,EAAE,GAAG,YAAY;AAChE,IAAI,MAAM;AACV,MAAM,QAAQ;AACd,MAAM,SAAS;AACf,MAAM,OAAO,GAAG,GAAG;AACnB,MAAM,QAAQ,GAAG,KAAK;AACtB,MAAM,KAAK;AACX,MAAM,GAAG;AACT,KAAK,GAAG,cAAc;AACtB,IAAI,MAAM,gBAAgB,GAAG,EAAE,CAAC,MAAM,CAAC,WAAW,CAAC,EAAE,SAAS,EAAE;AAChE,MAAM,CAAC,MAAM,CAAC,CAAC,QAAQ,EAAE,OAAO,KAAK,GAAG,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC,CAAC,GAAG,OAAO;AACxE,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC,GAAG,QAAQ;AACpC,MAAM,CAAC,MAAM,CAAC,aAAa,CAAC,GAAG,YAAY,KAAK,OAAO;AACvD,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,GAAG,YAAY,KAAK;AAC9C,KAAK,CAAC;AACN,IAAI,MAAM,eAAe,GAAG,MAAM;AAClC,MAAM,IAAI,QAAQ,EAAE;AACpB,QAAQ,IAAI,YAAY,KAAK,OAAO,EAAE;AACtC,UAAU,uBAAuB,IAAI,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE;AAC5D,4BAA4B,GAAG,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAC;AACnF,4BAA4B,GAAG,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE;AACtE,WAAW,EAAE,CAAC;AACd;AACA,QAAQ,IAAI,YAAY,KAAK,KAAK,EAAE;AACpC,UAAU,uBAAuB,IAAI,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE;AAC5D,4BAA4B,GAAG,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC;AACvE,4BAA4B,GAAG,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,QAAQ,EAAE;AAClF,WAAW,EAAE,CAAC;AACd;AACA,QAAQ,uBAAuB,IAAI,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE;AAC1D,0BAA0B,GAAG,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC;AACrE,0BAA0B,GAAG,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,QAAQ,EAAE,CAAC;AACjF,0BAA0B,GAAG,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE;AACpE,SAAS,EAAE,CAAC;AACZ;AACA,MAAM,uBAAuB,GAAG,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,MAAM,CAAC,SAAS,CAAC,EAAE,CAAC;AACxE,KAAK;AACL,IAAI,MAAM,aAAa,GAAG;AAC1B,MAAM,GAAG,KAAK;AACd,MAAM,GAAG;AACT,KAAK;AACL,IAAI,uBAAuB,GAAG;AAC9B,MAAM,MAAM;AACZ,MAAM;AACN,QAAQ,UAAU,EAAE,SAAS;AAC7B,QAAQ,GAAG;AACX,QAAQ,KAAK,EAAE,aAAa;AAC5B,QAAQ,GAAG,IAAI;AACf,QAAQ,SAAS,EAAE,gBAAgB;AACnC,QAAQ,QAAQ,EAAE,eAAe;AACjC;AACA,KAAK;AACL;AACA,CAAC;AACDA,SAAO,CAAC,WAAW,GAAG,SAAS;;AC7ExB,MAAM,OAAU,GAAA,UAAA;AAAA,EACrB,CAAC,OAAqB,GAA8B,KAAA;AAClD,IAAA,uBAAQ,GAAA,CAAAC,SAAA,EAAA,EAAY,GAAW,EAAA,GAAG,KAAO,EAAA,CAAA;AAAA;AAE7C;;;;"}
+{"version":3,"file":"Divider-BkObIjoj.js","sources":["../../hammer-react/dist/Divider-HzWyke5T.js","../src/components/Divider/Divider.tsx"],"sourcesContent":["import { jsx, jsxs, Fragment } from 'react/jsx-runtime';\nimport { forwardRef } from 'react';\nimport cx from 'classnames';\nimport { u as useLayoutPropsUtil } from './useLayoutPropsUtil-GT5myWCm.js';\n\nimport './Divider.css';const container = \"_container_1qvqe_3\";\nconst divider = \"_divider_1qvqe_24\";\nconst content = \"_content_1qvqe_42\";\nconst vertical = \"_vertical_1qvqe_53\";\nconst styles = {\n\tcontainer: container,\n\tdivider: divider,\n\tcontent: content,\n\tvertical: vertical,\n\t\"align-start\": \"_align-start_1qvqe_59\",\n\t\"align-end\": \"_align-end_1qvqe_62\",\n\t\"spacing-0\": \"_spacing-0_1qvqe_65\",\n\t\"spacing-half\": \"_spacing-half_1qvqe_69\",\n\t\"spacing-1\": \"_spacing-1_1qvqe_73\",\n\t\"spacing-2\": \"_spacing-2_1qvqe_77\",\n\t\"spacing-3\": \"_spacing-3_1qvqe_81\",\n\t\"spacing-4\": \"_spacing-4_1qvqe_85\",\n\t\"spacing-5\": \"_spacing-5_1qvqe_89\",\n\t\"spacing-6\": \"_spacing-6_1qvqe_93\",\n\t\"spacing-8\": \"_spacing-8_1qvqe_97\",\n\t\"spacing-12\": \"_spacing-12_1qvqe_101\"\n};\n\nconst Divider = forwardRef(\n  (props, ref) => {\n    const { layoutStyles, componentProps } = useLayoutPropsUtil(props);\n    const { alignContent, ...restOfLayoutStyles } = layoutStyles;\n    const {\n      children,\n      className,\n      spacing = \"0\",\n      vertical = false,\n      style,\n      ...rest\n    } = componentProps;\n    const ContainerClasses = cx(styles[\"container\"], className, {\n      [styles[`spacing-${spacing === 0.5 ? \"half\" : spacing}`]]: spacing,\n      [styles[\"vertical\"]]: vertical,\n      [styles[\"align-start\"]]: alignContent === \"start\",\n      [styles[\"align-end\"]]: alignContent === \"end\"\n    });\n    const contentOrdering = () => {\n      if (children) {\n        if (alignContent === \"start\") {\n          return /* @__PURE__ */ jsxs(Fragment, { children: [\n            /* @__PURE__ */ jsx(\"span\", { className: styles[\"content\"], children }),\n            /* @__PURE__ */ jsx(\"hr\", { className: styles[\"divider\"] })\n          ] });\n        }\n        if (alignContent === \"end\") {\n          return /* @__PURE__ */ jsxs(Fragment, { children: [\n            /* @__PURE__ */ jsx(\"hr\", { className: styles[\"divider\"] }),\n            /* @__PURE__ */ jsx(\"span\", { className: styles[\"content\"], children })\n          ] });\n        }\n        return /* @__PURE__ */ jsxs(Fragment, { children: [\n          /* @__PURE__ */ jsx(\"hr\", { className: styles[\"divider\"] }),\n          /* @__PURE__ */ jsx(\"span\", { className: styles[\"content\"], children }),\n          /* @__PURE__ */ jsx(\"hr\", { className: styles[\"divider\"] })\n        ] });\n      }\n      return /* @__PURE__ */ jsx(\"hr\", { className: styles[\"divider\"] });\n    };\n    const styleCombined = {\n      ...style,\n      ...restOfLayoutStyles\n    };\n    return /* @__PURE__ */ jsx(\n      \"span\",\n      {\n        \"data-anv\": \"divider\",\n        ref,\n        style: styleCombined,\n        ...rest,\n        className: ContainerClasses,\n        children: contentOrdering()\n      }\n    );\n  }\n);\nDivider.displayName = \"Divider\";\n\nexport { Divider as D };\n//# sourceMappingURL=Divider-HzWyke5T.js.map\n","import {\n  DividerProps as CoreDividerProps,\n  Divider as CoreDivider,\n} from \"@servicetitan/hammer-react\";\nimport { Ref, forwardRef } from \"react\";\n\nexport type DividerProps = CoreDividerProps;\n\nexport const Divider = forwardRef(\n  (props: DividerProps, ref: Ref<HTMLSpanElement>) => {\n    return <CoreDivider ref={ref} {...props} />;\n  },\n);\n"],"names":["Divider","CoreDivider"],"mappings":"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"}

package/dist/Divider.css

@@ -2,7 +2,7 @@
 
 @layer starter, reset, base, state, application;
 @layer reset {
-  ._container_k5nkz_3 {
+  ._container_1qvqe_3 {
     all: unset;
     font-family: var(--font-family-base, "Nunito Sans", sans-serif);
     font-size: 100%;
@@ -17,7 +17,7 @@
   }
 }
 @layer base {
-  ._container_k5nkz_3 {
+  ._container_1qvqe_3 {
     background-color: unset;
     width: -webkit-fill-available;
     width: -moz-available;
@@ -25,7 +25,7 @@
     position: relative;
     overflow: visible;
   }
-  ._container_k5nkz_3 ._divider_k5nkz_24 {
+  ._container_1qvqe_3 ._divider_1qvqe_24 {
     all: unset;
     font-family: var(--font-family-base, "Nunito Sans", sans-serif);
     font-size: 100%;
@@ -37,6 +37,7 @@
     border-color: transparent;
     box-sizing: border-box;
     display: inline-block;
+    flex: 1;
     text-align: center;
     height: 0.0625rem;
     width: -webkit-fill-available;
@@ -44,7 +45,7 @@
     width: stretch;
     min-width: 1rem;
   }
-  ._container_k5nkz_3 ._content_k5nkz_41 {
+  ._container_1qvqe_3 ._content_1qvqe_42 {
     z-index: 1;
     background-color: inherit;
     height: inherit;
@@ -55,117 +56,117 @@
   }
 }
 @layer state {
-  ._container_k5nkz_3:not(._vertical_k5nkz_52) {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53) {
     align-items: center;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52) ._divider_k5nkz_24 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53) ._divider_1qvqe_24 {
     border-block-start: 0.0625rem solid var(--border-color-subdued, #dfe0e1);
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._align-start_k5nkz_58 ._content_k5nkz_41 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._align-start_1qvqe_59 ._content_1qvqe_42 {
     padding-inline-start: 0;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._align-end_k5nkz_61 ._content_k5nkz_41 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._align-end_1qvqe_62 ._content_1qvqe_42 {
     padding-inline-end: 0;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._spacing-0_k5nkz_64 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._spacing-0_1qvqe_65 {
     padding-block-start: 0;
     padding-block-end: 0;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._spacing-half_k5nkz_68 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._spacing-half_1qvqe_69 {
     padding-block-start: 0.25rem;
     padding-block-end: 0.25rem;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._spacing-1_k5nkz_72 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._spacing-1_1qvqe_73 {
     padding-block-start: 0.5rem;
     padding-block-end: 0.5rem;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._spacing-2_k5nkz_76 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._spacing-2_1qvqe_77 {
     padding-block-start: 0.5rem;
     padding-block-end: 0.5rem;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._spacing-3_k5nkz_80 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._spacing-3_1qvqe_81 {
     padding-block-start: 0.75rem;
     padding-block-end: 0.75rem;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._spacing-4_k5nkz_84 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._spacing-4_1qvqe_85 {
     padding-block-start: 1rem;
     padding-block-end: 1rem;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._spacing-5_k5nkz_88 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._spacing-5_1qvqe_89 {
     padding-block-start: 1.25rem;
     padding-block-end: 1.25rem;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._spacing-6_k5nkz_92 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._spacing-6_1qvqe_93 {
     padding-block-start: 1.5rem;
     padding-block-end: 1.5rem;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._spacing-8_k5nkz_96 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._spacing-8_1qvqe_97 {
     padding-block-start: 2rem;
     padding-block-end: 2rem;
   }
-  ._container_k5nkz_3:not(._vertical_k5nkz_52)._spacing-12_k5nkz_100 {
+  ._container_1qvqe_3:not(._vertical_1qvqe_53)._spacing-12_1qvqe_101 {
     padding-block-start: 3rem;
     padding-block-end: 3rem;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52 {
+  ._container_1qvqe_3._vertical_1qvqe_53 {
     width: 0.0625rem;
     flex-direction: column;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52 ._divider_k5nkz_24 {
+  ._container_1qvqe_3._vertical_1qvqe_53 ._divider_1qvqe_24 {
     border-left: 0.0625rem solid var(--border-color-subdued, #dfe0e1);
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._align-start_k5nkz_58 ._content_k5nkz_41 {
+  ._container_1qvqe_3._vertical_1qvqe_53._align-start_1qvqe_59 ._content_1qvqe_42 {
     padding-block-start: 0;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._align-end_k5nkz_61 ._content_k5nkz_41 {
+  ._container_1qvqe_3._vertical_1qvqe_53._align-end_1qvqe_62 ._content_1qvqe_42 {
     padding-block-end: 0;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52 ._content_k5nkz_41 {
+  ._container_1qvqe_3._vertical_1qvqe_53 ._content_1qvqe_42 {
     width: -moz-fit-content;
     width: fit-content;
     transform: translateX(-50%);
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._spacing-0_k5nkz_64 {
+  ._container_1qvqe_3._vertical_1qvqe_53._spacing-0_1qvqe_65 {
     padding-inline-start: 0;
     padding-inline-end: 0;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._spacing-half_k5nkz_68 {
+  ._container_1qvqe_3._vertical_1qvqe_53._spacing-half_1qvqe_69 {
     padding-inline-start: 0.125rem;
     padding-inline-end: 0.125rem;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._spacing-1_k5nkz_72 {
+  ._container_1qvqe_3._vertical_1qvqe_53._spacing-1_1qvqe_73 {
     padding-inline-start: 0.25rem;
     padding-inline-end: 0.25rem;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._spacing-2_k5nkz_76 {
+  ._container_1qvqe_3._vertical_1qvqe_53._spacing-2_1qvqe_77 {
     padding-inline-start: 0.5rem;
     padding-inline-end: 0.5rem;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._spacing-3_k5nkz_80 {
+  ._container_1qvqe_3._vertical_1qvqe_53._spacing-3_1qvqe_81 {
     padding-inline-start: 0.75rem;
     padding-inline-end: 0.75rem;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._spacing-4_k5nkz_84 {
+  ._container_1qvqe_3._vertical_1qvqe_53._spacing-4_1qvqe_85 {
     padding-inline-start: 1rem;
     padding-inline-end: 1rem;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._spacing-5_k5nkz_88 {
+  ._container_1qvqe_3._vertical_1qvqe_53._spacing-5_1qvqe_89 {
     padding-inline-start: 1.25rem;
     padding-inline-end: 1.25rem;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._spacing-6_k5nkz_92 {
+  ._container_1qvqe_3._vertical_1qvqe_53._spacing-6_1qvqe_93 {
     padding-inline-start: 1.5rem;
     padding-inline-end: 1.5rem;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._spacing-8_k5nkz_96 {
+  ._container_1qvqe_3._vertical_1qvqe_53._spacing-8_1qvqe_97 {
     padding-inline-start: 2rem;
     padding-inline-end: 2rem;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52._spacing-12_k5nkz_100 {
+  ._container_1qvqe_3._vertical_1qvqe_53._spacing-12_1qvqe_101 {
     padding-inline-start: 3rem;
     padding-inline-end: 3rem;
   }
-  ._container_k5nkz_3._vertical_k5nkz_52 ._divider_k5nkz_24 {
+  ._container_1qvqe_3._vertical_1qvqe_53 ._divider_1qvqe_24 {
     height: 100%;
     width: 0.0625rem;
   }

package/dist/Divider.js

@@ -1,2 +1,2 @@
-export { D as Divider, D as default } from './Divider-AD1Jb85d.js';
+export { D as Divider, D as default } from './Divider-BkObIjoj.js';
 //# sourceMappingURL=Divider.js.map

package/dist/Dnd.d.ts

@@ -0,0 +1,2 @@
+export * from './components/Dnd/index'
+export {}

package/dist/Dnd.js

@@ -0,0 +1,2 @@
+export { D as Dnd } from './index-BOekhwqw-Taf40KX_.js';
+//# sourceMappingURL=Dnd.js.map

package/dist/Dnd.js.map

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

package/dist/{DndSort-BVcdqJLB.js → DndSort-CYFyN62U.js}

@@ -1,12 +1,12 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import * as React from 'react';
 import React__default, { useLayoutEffect, useEffect, useMemo, useRef, useCallback, useState, memo, useContext, createContext, useReducer, forwardRef, cloneElement } from 'react';
 import { unstable_batchedUpdates, createPortal } from 'react-dom';
+import { a as DndHandleButton, b as DndHandle, D as Dnd, c as DndSortLine, s as styles } from './index-BOekhwqw-Taf40KX_.js';
 import { c as cx } from './index-tZvMCc77.js';
-import { F as Flex } from './Flex-CLu2TnzF-aW2OhBYv.js';
-import { B as ButtonCompound } from './ButtonCompound-BeUo4_Zv-psxZY03N.js';
-import { C as Card } from './Card-DukbBYaA-C2a2vYKk.js';
-import { I as Icon } from './Icon-DuwR7O2z-C_rTZRSc.js';
+import { B as ButtonCompound } from './ButtonCompound-Agrm0TFv-BH9CzNcb.js';
+import { C as Card } from './Card-Ct_7fGY7-31Vi9Yzf.js';
+import { F as Flex } from './Flex-D3J8BIR_-C2zh0Ijz.js';
+import { s as sizeToToken } from './useLayoutPropsUtil-GT5myWCm-Cgn7OEq9.js';
 
 import './DndSort.css';function useCombinedRefs() {
   for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
@@ -4152,81 +4152,6 @@ const DragOverlay = /*#__PURE__*/React__default.memo(_ref => {
   }, children) : null));
 });
 
-const styles = {
-	"drop-line": "_drop-line_1oxam_4",
-	"drag-preview": "_drag-preview_1oxam_19",
-	"orientation-horizontal": "_orientation-horizontal_1oxam_38",
-	"position-before": "_position-before_1oxam_42",
-	"position-after": "_position-after_1oxam_45",
-	"orientation-vertical": "_orientation-vertical_1oxam_52",
-	"drop-zone": "_drop-zone_1oxam_66",
-	"can-be-dropped": "_can-be-dropped_1oxam_71",
-	"active-not-over": "_active-not-over_1oxam_75",
-	"over-valid": "_over-valid_1oxam_82",
-	"over-invalid": "_over-invalid_1oxam_86"
-};
-
-const DndSortLine = ({ orientation, position }) => {
-  const classes = cx(
-    styles["drop-line"],
-    styles[`orientation-${orientation}`],
-    styles[`position-${position}`]
-  );
-  return /* @__PURE__ */ jsx("div", { "aria-hidden": true, className: classes });
-};
-
-const DEFAULT_GAP = 4;
-const DndZone = forwardRef(
-  ({
-    children,
-    className,
-    disabled,
-    gap = `${DEFAULT_GAP}`,
-    id,
-    isDragging,
-    isOver,
-    isValid,
-    orientation,
-    style,
-    ...rest
-  }, ref) => {
-    const classes = cx(className, {
-      [styles["drop-zone"]]: true,
-      [styles["over-valid"]]: isDragging && isOver && isValid,
-      [styles["over-invalid"]]: isDragging && isOver && !isValid,
-      [styles["active-not-over"]]: isDragging && !isOver
-    });
-    const orientationToDirection = {
-      horizontal: "row",
-      vertical: "column"
-    };
-    return /* @__PURE__ */ jsx(
-      Flex,
-      {
-        "data-testid": `drag-and-drop-zone-${id}`,
-        direction: orientationToDirection[orientation ?? ""] || void 0,
-        ...rest,
-        ref,
-        className: classes,
-        gap,
-        style: {
-          padding: (isNaN(Number(gap)) ? DEFAULT_GAP : Number(gap)) * 0.25 + "rem",
-          ...style,
-          "--drop-zone-gap": gap
-        },
-        children
-      }
-    );
-  }
-);
-DndZone.displayName = "DndZoneBase";
-
-const Dnd = {
-  Zone: DndZone
-};
-
-const SvgDragIndicator = (props) => /* @__PURE__ */ React.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: "1em", height: "1em", viewBox: "0 0 24 24", ...props }, /* @__PURE__ */ React.createElement("path", { d: "M11 18c0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2 2 .9 2 2zm-2-8c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0-6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm6 4c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z" }));
-
 /**
  * Move an array item to a different position. Returns a new array with the item moved to the new position.
  */
@@ -5245,15 +5170,6 @@ function DndSort$1({
   );
 }
 
-const ghost = "_ghost_18e23_27";
-const cardDraggableStyles = {
-	"draggable-card-button": "_draggable-card-button_18e23_4",
-	"draggable-card": "_draggable-card_18e23_4",
-	"drag-indicator-button": "_drag-indicator-button_18e23_15",
-	"drag-indicator-icon": "_drag-indicator-icon_18e23_16",
-	ghost: ghost
-};
-
 const DndSortZoneContext = createContext(null);
 function DndSortZoneContextProvider(props) {
   return /* @__PURE__ */ jsx(DndSortZoneContext.Provider, { value: props, children: props?.children });
@@ -5387,13 +5303,29 @@ function DndSortItem({
         position: "relative"
       },
       children: [
-        line.show && /* @__PURE__ */ jsx(DndSortLine, { orientation, position: line.position }),
+        line.show && /* @__PURE__ */ jsx(
+          DndSortLine,
+          {
+            offset: `calc(-1 * var(--drop-zone-gap) / 2)`,
+            orientation,
+            position: line.position
+          }
+        ),
         children
       ]
     }
   );
 }
 
+const card = "_card_1wa2x_5";
+const active = "_active_1wa2x_11";
+const dndSortStyles = {
+	card: card,
+	active: active,
+	"card-handle": "_card-handle_1wa2x_14",
+	"card-button-wrapper": "_card-button-wrapper_1wa2x_21"
+};
+
 function DndSortCard({
   children,
   dragOnlyWithHandle = false,
@@ -5407,26 +5339,16 @@ function DndSortCard({
   const { active } = useDndContext();
   const { setPreviewRenderer } = useDndSortContext();
   const isActive = active?.id === id;
-  const buttonClasses = cx(cardDraggableStyles["draggable-card-button"], {
-    [cardDraggableStyles["ghost"]]: isActive
+  const cardClasses = cx(rest.className, dndSortStyles["card"], {
+    [dndSortStyles["active"]]: isActive,
+    [dndSortStyles["card-as-button"]]: !dragOnlyWithHandle
+  });
+  const buttonWrapperClasses = cx(dndSortStyles["card-button-wrapper"], {
+    [dndSortStyles["card-as-button"]]: !dragOnlyWithHandle
   });
-  const handleButtonClasses = cx(
-    cardDraggableStyles["drag-indicator-button"],
-    cardDraggableStyles["drag-indicator-icon"],
-    {
-      [cardDraggableStyles["ghost"]]: isActive
-    }
-  );
-  const cardClasses = cx(
-    rest.className,
-    cardDraggableStyles["draggable-card"],
-    {
-      [cardDraggableStyles["ghost"]]: isActive
-    }
-  );
   const previewRenderer = useCallback(() => {
-    return /* @__PURE__ */ jsx(DndSortCardPreview, { children });
-  }, [children]);
+    return /* @__PURE__ */ jsx(DndSortCardPreview, { ...rest, children });
+  }, []);
   useEffect(() => {
     if (active?.id === id) {
       setPreviewRenderer(() => previewRendererProp ?? previewRenderer);
@@ -5457,16 +5379,14 @@ function DndSortCard({
             className: cardClasses,
             children: [
               /* @__PURE__ */ jsx(
-                ButtonCompound,
+                DndHandleButton,
                 {
                   ref: setActivatorNodeRef,
                   ...attributes,
                   ...listeners,
                   style,
-                  className: handleButtonClasses,
-                  type: "button",
-                  shape: "rounded",
-                  children: /* @__PURE__ */ jsx(Icon, { svg: SvgDragIndicator, role: "presentation" })
+                  className: dndSortStyles["card-handle"],
+                  isActive
                 }
               ),
               children
@@ -5483,47 +5403,38 @@ function DndSortCard({
       ...attributes,
       ...listeners,
       style,
-      className: buttonClasses,
+      className: buttonWrapperClasses,
       type: "button",
       shape: "rounded",
       "data-testid": `drag-and-drop-draggable-${id}`,
       children: /* @__PURE__ */ jsxs(Card, { ...rest, "data-anv": "draggable-card", className: cardClasses, children: [
-        /* @__PURE__ */ jsx(
-          Icon,
-          {
-            svg: SvgDragIndicator,
-            className: cardDraggableStyles["drag-indicator-icon"],
-            role: "presentation"
-          }
-        ),
+        /* @__PURE__ */ jsx(DndHandle, { className: dndSortStyles["card-handle"] }),
         children
       ] })
     }
   ) }) });
 }
-const DndSortCardPreview = ({ children }) => {
-  const cardClasses = cx(cardDraggableStyles["draggable-card"]);
+const DndSortCardPreview = ({
+  children,
+  ...rest
+}) => {
+  const cardClasses = cx(dndSortStyles["card"], dndSortStyles["preview"]);
   return /* @__PURE__ */ jsxs(
     Card,
     {
+      ...rest,
       "data-anv": "draggable-card",
       className: cardClasses,
       "data-testid": "drag-and-drop-overlay",
       children: [
-        /* @__PURE__ */ jsx(
-          Icon,
-          {
-            svg: SvgDragIndicator,
-            className: cardDraggableStyles["drag-indicator-icon"],
-            role: "presentation"
-          }
-        ),
+        /* @__PURE__ */ jsx(DndHandle, { className: dndSortStyles["card-handle"] }),
         children
       ]
     }
   );
 };
 
+const DEFAULT_GAP = 4;
 function DndSortZone(props) {
   const {
     acceptedTypes,
@@ -5537,10 +5448,11 @@ function DndSortZone(props) {
     sortedIds,
     sortable,
     validator,
-    ...rest
+    style,
+    ...flexProps
   } = {
     defaultDropPosition: "end",
-    gap: "4",
+    gap: DEFAULT_GAP,
     sortable: false,
     sortedIds: [],
     ...props
@@ -5588,17 +5500,29 @@ function DndSortZone(props) {
       });
     }
   }, [isDragging, isOverThis, isValid, props, previouslyDragging]);
+  const orientationToDirection = {
+    horizontal: "row",
+    vertical: "column"
+  };
   const shared = /* @__PURE__ */ jsx(
     Dnd.Zone,
     {
+      el: Flex,
       ref: setNodeRef,
-      ...rest,
+      "data-testid": `drag-and-drop-zone-${id}`,
+      ...flexProps,
       gap,
       id,
       orientation,
       isDragging: !!active,
       isOver: isOverThis,
       isValid,
+      style: {
+        "--drop-zone-gap": sizeToToken(gap),
+        padding: sizeToToken(gap),
+        flexDirection: orientationToDirection[orientation ?? ""] || void 0,
+        ...style
+      },
       children: /* @__PURE__ */ jsx(DndSortZoneContextProvider, { sortable, ...props, children: advancedRender || children })
     }
   );
@@ -5619,4 +5543,4 @@ const DndSort = Object.assign(DndSort$1, {
 });
 
 export { DndSort as D, DndSortCard as a, DndSortZone as b };
-//# sourceMappingURL=DndSort-BVcdqJLB.js.map
+//# sourceMappingURL=DndSort-CYFyN62U.js.map