@frontify/fondue 12.0.0-beta.383 → 12.0.0-beta.384

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.
@@ -3,7 +3,7 @@ import { Children as b } from "react";
3
3
  import { merge as i } from "../../../utilities/merge.es.js";
4
4
  import f from "../../../foundation/Icon/Generated/IconGrabHandle12.es.js";
5
5
  import { INDENTATION_WIDTH as x } from "../helpers/constants.es.js";
6
- const g = ({
6
+ const h = ({
7
7
  id: d,
8
8
  label: e,
9
9
  level: r = 0,
@@ -13,7 +13,7 @@ const g = ({
13
13
  dragHandlerPosition: o = "left",
14
14
  showContentWhileDragging: l = !1
15
15
  }) => {
16
- const m = b.count(s) > 0, c = { marginLeft: r * x }, a = /* @__PURE__ */ t("button", { tabIndex: -1, className: "tw-p-1", children: /* @__PURE__ */ t(f, {}) });
16
+ const m = b.count(s) > 0, c = { marginLeft: r * x }, a = /* @__PURE__ */ t("button", { tabIndex: -1, className: "tw-p-1 tw-touch-none", children: /* @__PURE__ */ t(f, {}) });
17
17
  return /* @__PURE__ */ p(
18
18
  "li",
19
19
  {
@@ -46,8 +46,8 @@ const g = ({
46
46
  }
47
47
  );
48
48
  };
49
- g.displayName = "FondueTreeItemOverlay";
49
+ h.displayName = "FondueTreeItemOverlay";
50
50
  export {
51
- g as TreeItemOverlay
51
+ h as TreeItemOverlay
52
52
  };
53
53
  //# sourceMappingURL=TreeItemOverlay.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"TreeItemOverlay.es.js","sources":["../../../../src/components/Tree/TreeItem/TreeItemOverlay.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Children, ReactNode } from 'react';\n\nimport { merge } from '@utilities/merge';\nimport { IconGrabHandle12 } from '@foundation/Icon';\n\nimport { INDENTATION_WIDTH } from '../helpers';\nimport { DragHandlerPosition } from '../types';\n\nexport type Overlay = {\n id: string;\n label?: string;\n level?: number;\n children: ReactNode;\n contentComponent?: ReactNode;\n isSelected?: boolean;\n dragHandlerPosition?: DragHandlerPosition;\n showContentWhileDragging: boolean;\n};\n\nexport const TreeItemOverlay = ({\n id,\n label,\n level = 0,\n children,\n contentComponent,\n isSelected,\n dragHandlerPosition = 'left',\n showContentWhileDragging = false,\n}: Overlay) => {\n const hasChildren = Children.count(children) > 0;\n\n const indentation = level * INDENTATION_WIDTH;\n\n const liStyle = { marginLeft: indentation };\n\n const dragHandler = (\n <button tabIndex={-1} className=\"tw-p-1\">\n <IconGrabHandle12 />\n </button>\n );\n\n return (\n <li\n role=\"treeitem\"\n style={liStyle}\n id={id.toString()}\n aria-label={label}\n aria-level={level + 1}\n aria-selected={isSelected}\n data-test-id=\"fondue-tree-item-overlay\"\n className={merge([\n 'tw-pointer-events-none tw-bg-white tw-flex tw-items-center tw-gap-x-1 tw-p-2 tw-no-underline tw-leading-5 tw-box-border tw-w-fit tw-drop-shadow-xl tw-rounded',\n showContentWhileDragging ? 'tw-opacity-90' : '',\n ])}\n >\n {dragHandlerPosition === 'left' && dragHandler}\n\n {hasChildren && (\n <button tabIndex={-1} data-test-id=\"tree-item-toggle\" className=\"tw-p-1\">\n <div\n className={merge([\n 'tw-transition-transform tw-w-0 tw-h-0 tw-text-black-100 tw-text-opacity-40 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong',\n isSelected && 'tw-text-box-selected-strong-inverse',\n ])}\n />\n </button>\n )}\n\n {label !== undefined && <span>{label}</span>}\n\n {contentComponent}\n\n {dragHandlerPosition === 'right' && dragHandler}\n </li>\n );\n};\n\nTreeItemOverlay.displayName = 'FondueTreeItemOverlay';\n"],"names":["TreeItemOverlay","id","label","level","children","contentComponent","isSelected","dragHandlerPosition","showContentWhileDragging","hasChildren","Children","liStyle","INDENTATION_WIDTH","dragHandler","jsx","IconGrabHandle12","jsxs","merge"],"mappings":";;;;;AAqBO,MAAMA,IAAkB,CAAC;AAAA,EAC5B,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,qBAAAC,IAAsB;AAAA,EACtB,0BAAAC,IAA2B;AAC/B,MAAe;AACX,QAAMC,IAAcC,EAAS,MAAMN,CAAQ,IAAI,GAIzCO,IAAU,EAAE,YAFER,IAAQS,KAItBC,sBACD,UAAO,EAAA,UAAU,IAAI,WAAU,UAC5B,UAAC,gBAAAC,EAAAC,GAAA,CAAiB,CAAA,EACtB,CAAA;AAIA,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,MAAK;AAAA,MACL,OAAOL;AAAA,MACP,IAAIV,EAAG,SAAS;AAAA,MAChB,cAAYC;AAAA,MACZ,cAAYC,IAAQ;AAAA,MACpB,iBAAeG;AAAA,MACf,gBAAa;AAAA,MACb,WAAWW,EAAM;AAAA,QACb;AAAA,QACAT,IAA2B,kBAAkB;AAAA,MAAA,CAChD;AAAA,MAEA,UAAA;AAAA,QAAAD,MAAwB,UAAUM;AAAA,QAElCJ,uBACI,UAAO,EAAA,UAAU,IAAI,gBAAa,oBAAmB,WAAU,UAC5D,UAAA,gBAAAK;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAWG,EAAM;AAAA,cACb;AAAA,cACAX,KAAc;AAAA,YAAA,CACjB;AAAA,UAAA;AAAA,QAAA,GAET;AAAA,QAGHJ,MAAU,UAAc,gBAAAY,EAAA,QAAA,EAAM,UAAMZ,GAAA;AAAA,QAEpCG;AAAA,QAEAE,MAAwB,WAAWM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGhD;AAEAb,EAAgB,cAAc;"}
1
+ {"version":3,"file":"TreeItemOverlay.es.js","sources":["../../../../src/components/Tree/TreeItem/TreeItemOverlay.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { Children, ReactNode } from 'react';\n\nimport { merge } from '@utilities/merge';\nimport { IconGrabHandle12 } from '@foundation/Icon';\n\nimport { INDENTATION_WIDTH } from '../helpers';\nimport { DragHandlerPosition } from '../types';\n\nexport type Overlay = {\n id: string;\n label?: string;\n level?: number;\n children: ReactNode;\n contentComponent?: ReactNode;\n isSelected?: boolean;\n dragHandlerPosition?: DragHandlerPosition;\n showContentWhileDragging: boolean;\n};\n\nexport const TreeItemOverlay = ({\n id,\n label,\n level = 0,\n children,\n contentComponent,\n isSelected,\n dragHandlerPosition = 'left',\n showContentWhileDragging = false,\n}: Overlay) => {\n const hasChildren = Children.count(children) > 0;\n\n const indentation = level * INDENTATION_WIDTH;\n\n const liStyle = { marginLeft: indentation };\n\n const dragHandler = (\n <button tabIndex={-1} className=\"tw-p-1 tw-touch-none\">\n <IconGrabHandle12 />\n </button>\n );\n\n return (\n <li\n role=\"treeitem\"\n style={liStyle}\n id={id.toString()}\n aria-label={label}\n aria-level={level + 1}\n aria-selected={isSelected}\n data-test-id=\"fondue-tree-item-overlay\"\n className={merge([\n 'tw-pointer-events-none tw-bg-white tw-flex tw-items-center tw-gap-x-1 tw-p-2 tw-no-underline tw-leading-5 tw-box-border tw-w-fit tw-drop-shadow-xl tw-rounded',\n showContentWhileDragging ? 'tw-opacity-90' : '',\n ])}\n >\n {dragHandlerPosition === 'left' && dragHandler}\n\n {hasChildren && (\n <button tabIndex={-1} data-test-id=\"tree-item-toggle\" className=\"tw-p-1\">\n <div\n className={merge([\n 'tw-transition-transform tw-w-0 tw-h-0 tw-text-black-100 tw-text-opacity-40 tw-font-normal tw-border-t-4 tw-border-t-transparent tw-border-b-4 tw-border-b-transparent tw-border-l-4 tw-border-l-x-strong',\n isSelected && 'tw-text-box-selected-strong-inverse',\n ])}\n />\n </button>\n )}\n\n {label !== undefined && <span>{label}</span>}\n\n {contentComponent}\n\n {dragHandlerPosition === 'right' && dragHandler}\n </li>\n );\n};\n\nTreeItemOverlay.displayName = 'FondueTreeItemOverlay';\n"],"names":["TreeItemOverlay","id","label","level","children","contentComponent","isSelected","dragHandlerPosition","showContentWhileDragging","hasChildren","Children","liStyle","INDENTATION_WIDTH","dragHandler","jsx","IconGrabHandle12","jsxs","merge"],"mappings":";;;;;AAqBO,MAAMA,IAAkB,CAAC;AAAA,EAC5B,IAAAC;AAAA,EACA,OAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,qBAAAC,IAAsB;AAAA,EACtB,0BAAAC,IAA2B;AAC/B,MAAe;AACX,QAAMC,IAAcC,EAAS,MAAMN,CAAQ,IAAI,GAIzCO,IAAU,EAAE,YAFER,IAAQS,KAItBC,sBACD,UAAO,EAAA,UAAU,IAAI,WAAU,wBAC5B,UAAC,gBAAAC,EAAAC,GAAA,CAAiB,CAAA,EACtB,CAAA;AAIA,SAAA,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACG,MAAK;AAAA,MACL,OAAOL;AAAA,MACP,IAAIV,EAAG,SAAS;AAAA,MAChB,cAAYC;AAAA,MACZ,cAAYC,IAAQ;AAAA,MACpB,iBAAeG;AAAA,MACf,gBAAa;AAAA,MACb,WAAWW,EAAM;AAAA,QACb;AAAA,QACAT,IAA2B,kBAAkB;AAAA,MAAA,CAChD;AAAA,MAEA,UAAA;AAAA,QAAAD,MAAwB,UAAUM;AAAA,QAElCJ,uBACI,UAAO,EAAA,UAAU,IAAI,gBAAa,oBAAmB,WAAU,UAC5D,UAAA,gBAAAK;AAAA,UAAC;AAAA,UAAA;AAAA,YACG,WAAWG,EAAM;AAAA,cACb;AAAA,cACAX,KAAc;AAAA,YAAA,CACjB;AAAA,UAAA;AAAA,QAAA,GAET;AAAA,QAGHJ,MAAU,UAAc,gBAAAY,EAAA,QAAA,EAAM,UAAMZ,GAAA;AAAA,QAEpCG;AAAA,QAEAE,MAAwB,WAAWM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGhD;AAEAb,EAAgB,cAAc;"}
@@ -1,7 +1,7 @@
1
1
  const o = ({
2
2
  dragHandlerPosition: e,
3
3
  enableDragDelay: n
4
- }) => e === "none" ? { delay: n ? 150 : 0, tolerance: 2 } : { delay: 0, tolerance: 0 };
4
+ }) => e === "none" ? { delay: n ? 150 : 0, tolerance: 5 } : { delay: 0, tolerance: 5 };
5
5
  export {
6
6
  o as sensorsActivationConstraint
7
7
  };
@@ -1 +1 @@
1
- {"version":3,"file":"sensorsActivationConstraint.es.js","sources":["../../../../src/components/Tree/helpers/sensorsActivationConstraint.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TreeProps } from '../types';\n\ntype SensorsActivationConstraintProps = {\n dragHandlerPosition: TreeProps['dragHandlerPosition'];\n enableDragDelay: TreeProps['enableDragDelay'];\n};\n\ntype SensorsActivationConstraint = {\n delay: number;\n tolerance: number;\n};\n\nexport const sensorsActivationConstraint = ({\n dragHandlerPosition,\n enableDragDelay,\n}: SensorsActivationConstraintProps): SensorsActivationConstraint => {\n const delay = enableDragDelay ? 150 : 0;\n return dragHandlerPosition === 'none' ? { delay, tolerance: 2 } : { delay: 0, tolerance: 0 };\n};\n"],"names":["sensorsActivationConstraint","dragHandlerPosition","enableDragDelay"],"mappings":"AAcO,MAAMA,IAA8B,CAAC;AAAA,EACxC,qBAAAC;AAAA,EACA,iBAAAC;AACJ,MAEWD,MAAwB,SAAS,EAAE,OAD5BC,IAAkB,MAAM,GACW,WAAW,MAAM,EAAE,OAAO,GAAG,WAAW,EAAE;"}
1
+ {"version":3,"file":"sensorsActivationConstraint.es.js","sources":["../../../../src/components/Tree/helpers/sensorsActivationConstraint.tsx"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport { TreeProps } from '../types';\n\ntype SensorsActivationConstraintProps = {\n dragHandlerPosition: TreeProps['dragHandlerPosition'];\n enableDragDelay: TreeProps['enableDragDelay'];\n};\n\ntype SensorsActivationConstraint = {\n delay: number;\n tolerance: number;\n};\n\nexport const sensorsActivationConstraint = ({\n dragHandlerPosition,\n enableDragDelay,\n}: SensorsActivationConstraintProps): SensorsActivationConstraint => {\n const delay = enableDragDelay ? 150 : 0;\n return dragHandlerPosition === 'none' ? { delay, tolerance: 5 } : { delay: 0, tolerance: 5 };\n};\n"],"names":["sensorsActivationConstraint","dragHandlerPosition","enableDragDelay"],"mappings":"AAcO,MAAMA,IAA8B,CAAC;AAAA,EACxC,qBAAAC;AAAA,EACA,iBAAAC;AACJ,MAEWD,MAAwB,SAAS,EAAE,OAD5BC,IAAkB,MAAM,GACW,WAAW,MAAM,EAAE,OAAO,GAAG,WAAW,EAAE;"}