@widergy/energy-ui 3.172.2 → 3.172.3

package/dist/components/UTDocumentWizard/components/PageWizard/index.js

@@ -1,94 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _propTypes = require("prop-types");
-var _react = _interopRequireWildcard(require("react"));
-var _utils = require("./utils");
-var _constants = require("./constants");
-var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-const PageWizard = _ref => {
-  let {
-    canvasRef,
-    classNames,
-    clickedSection,
-    isChangingTab,
-    isMobileSize,
-    isSheetOpen,
-    onSectionChange,
-    page,
-    scaleConfig = {
-      extraSpacingLeft: _constants.DEFAULT_SPACING_LEFT,
-      extraSpacingRight: _constants.DEFAULT_SPACING_RIGHT,
-      extraSpacingTop: _constants.DEFAULT_SPACING_TOP,
-      extraSpacingBottom: _constants.DEFAULT_SPACING_BOTTOM,
-      scale: _constants.DEFAULT_SCALE
-    },
-    sectionSelected,
-    sections
-  } = _ref;
-  const sectionsBadgeCoord = {};
-  const sectionsCoord = {};
-  const animations = (0, _react.useRef)({});
-  const isPointer = false;
-  const {
-    extraSpacingLeft,
-    extraSpacingRight,
-    extraSpacingTop,
-    extraSpacingBottom,
-    scale
-  } = scaleConfig;
-  const onClick = e => (0, _utils.handleCanvasClick)(e, canvasRef, onSectionChange, sectionsBadgeCoord, sectionsCoord);
-  const onMouseMove = e => (0, _utils.handleMouseMove)(e, canvasRef, sectionsBadgeCoord, sectionsCoord, isPointer);
-  (0, _react.useEffect)(() => {
-    const canvas = canvasRef.current;
-    if (!canvas) return;
-    const ctx = canvas.getContext('2d');
-    const image = new Image();
-    image.src = page.image;
-    image.onload = () => {
-      const dpi = window.devicePixelRatio || 1;
-      const userScale = scale;
-      const padLeft = extraSpacingLeft;
-      const padRight = extraSpacingRight;
-      const padTop = extraSpacingTop;
-      const padBottom = extraSpacingBottom;
-      canvas.width = (image.width + padLeft + padRight) * dpi;
-      canvas.height = (image.height + padTop + padBottom) * dpi;
-      canvas.style.width = "".concat((image.width + padLeft + padRight) * userScale, "px");
-      canvas.style.height = "".concat((image.height + padTop + padBottom) * userScale, "px");
-      ctx.setTransform(dpi, 0, 0, dpi, padLeft, padTop);
-      ctx.clearRect(-padLeft, -padTop, canvas.width, canvas.height);
-      ctx.drawImage(image, 0, 0);
-      sections.forEach(section => (0, _utils.drawSection)(ctx, image, section, page, clickedSection, sectionsCoord, sectionsBadgeCoord, sectionSelected, animations, isSheetOpen, isMobileSize));
-    };
-  }, [page.image, sections, clickedSection, animations.current, isPointer, isSheetOpen]);
-  (0, _react.useEffect)(() => {
-    onSectionChange(null);
-  }, [page.image]);
-  return /*#__PURE__*/_react.default.createElement("canvas", {
-    ref: canvasRef,
-    tabIndex: "0",
-    className: "".concat(_stylesModule.default.container, " ").concat(classNames === null || classNames === void 0 ? void 0 : classNames.canvasContainer, " ").concat(isChangingTab ? _stylesModule.default.displayNone : _stylesModule.default.displayFlex),
-    onClick: onClick,
-    onMouseMove: onMouseMove
-  });
-};
-PageWizard.propTypes = {
-  canvasRef: _propTypes.object,
-  classNames: _propTypes.object,
-  clickedSection: _propTypes.string,
-  isChangingTab: _propTypes.bool,
-  isMobileSize: _propTypes.bool,
-  isSheetOpen: _propTypes.bool,
-  page: _propTypes.object,
-  scaleConfig: _propTypes.object,
-  sectionSelected: _propTypes.object,
-  sections: (0, _propTypes.arrayOf)({}),
-  onSectionChange: _propTypes.func
-};
-var _default = exports.default = PageWizard;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _propTypes=require("prop-types"),_react=_interopRequireWildcard(require("react")),_utils=require("./utils"),_constants=require("./constants"),_stylesModule=_interopRequireDefault(require("./styles.module.scss"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}function _interopRequireWildcard(e,t){if("function"==typeof WeakMap)var r=new WeakMap,n=new WeakMap;return(_interopRequireWildcard=function(e,t){if(!t&&e&&e.__esModule)return e;var o,i,f={__proto__:null,default:e};if(null===e||"object"!=typeof e&&"function"!=typeof e)return f;if(o=t?n:r){if(o.has(e))return o.get(e);o.set(e,f)}for(const t in e)"default"!==t&&{}.hasOwnProperty.call(e,t)&&((i=(o=Object.defineProperty)&&Object.getOwnPropertyDescriptor(e,t))&&(i.get||i.set)?o(f,t,i):f[t]=e[t]);return f})(e,t)}const PageWizard=_ref=>{let{canvasRef:canvasRef,classNames:classNames,clickedSection:clickedSection,isChangingTab:isChangingTab,isMobileSize:isMobileSize,isSheetOpen:isSheetOpen,onSectionChange:onSectionChange,page:page,scaleConfig:scaleConfig={extraSpacingLeft:_constants.DEFAULT_SPACING_LEFT,extraSpacingRight:_constants.DEFAULT_SPACING_RIGHT,extraSpacingTop:_constants.DEFAULT_SPACING_TOP,extraSpacingBottom:_constants.DEFAULT_SPACING_BOTTOM,scale:_constants.DEFAULT_SCALE},sectionSelected:sectionSelected,sections:sections}=_ref;const sectionsBadgeCoord={},sectionsCoord={},animations=(0,_react.useRef)({}),{extraSpacingLeft:extraSpacingLeft,extraSpacingRight:extraSpacingRight,extraSpacingTop:extraSpacingTop,extraSpacingBottom:extraSpacingBottom,scale:scale}=scaleConfig;return(0,_react.useEffect)(()=>{const canvas=canvasRef.current;if(!canvas)return;const ctx=canvas.getContext("2d"),image=new Image;image.src=page.image,image.onload=()=>{const dpi=window.devicePixelRatio||1,userScale=scale,padLeft=extraSpacingLeft,padRight=extraSpacingRight,padTop=extraSpacingTop,padBottom=extraSpacingBottom;canvas.width=(image.width+padLeft+padRight)*dpi,canvas.height=(image.height+padTop+padBottom)*dpi,canvas.style.width="".concat((image.width+padLeft+padRight)*userScale,"px"),canvas.style.height="".concat((image.height+padTop+padBottom)*userScale,"px"),ctx.setTransform(dpi,0,0,dpi,padLeft,padTop),ctx.clearRect(-padLeft,-padTop,canvas.width,canvas.height),ctx.drawImage(image,0,0),sections.forEach(section=>(0,_utils.drawSection)(ctx,image,section,page,clickedSection,sectionsCoord,sectionsBadgeCoord,sectionSelected,animations,isSheetOpen,isMobileSize))}},[page.image,sections,clickedSection,animations.current,false,isSheetOpen]),(0,_react.useEffect)(()=>{onSectionChange(null)},[page.image]),_react.default.createElement("canvas",{ref:canvasRef,tabIndex:"0",className:"".concat(_stylesModule.default.container," ").concat(null==classNames?void 0:classNames.canvasContainer," ").concat(isChangingTab?_stylesModule.default.displayNone:_stylesModule.default.displayFlex),onClick:e=>(0,_utils.handleCanvasClick)(e,canvasRef,onSectionChange,sectionsBadgeCoord,sectionsCoord),onMouseMove:e=>(0,_utils.handleMouseMove)(e,canvasRef,sectionsBadgeCoord,sectionsCoord,false)})};PageWizard.propTypes={canvasRef:_propTypes.object,classNames:_propTypes.object,clickedSection:_propTypes.string,isChangingTab:_propTypes.bool,isMobileSize:_propTypes.bool,isSheetOpen:_propTypes.bool,page:_propTypes.object,scaleConfig:_propTypes.object,sectionSelected:_propTypes.object,sections:(0,_propTypes.arrayOf)({}),onSectionChange:_propTypes.func};var _default=exports.default=PageWizard;

package/dist/components/UTDocumentWizard/components/PageWizard/utils.js

@@ -1,286 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.handleMouseMove = exports.handleCanvasClick = exports.drawSection = void 0;
-var _isEmpty = _interopRequireDefault(require("lodash/isEmpty"));
-var _colorUtils = require("../../../../utils/colorUtils");
-var _classesUtils = require("../../../../utils/classesUtils");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const drawRoundedStrokeRect = (ctx, x, y, width, height, radius) => {
-  ctx.save();
-  ctx.globalAlpha = 0.1;
-  ctx.fillStyle = (0, _colorUtils.getColorValue)('--identitySolidTone3', 'rgba(37, 224, 166, 1)');
-  ctx.beginPath();
-  ctx.moveTo(x + radius, y);
-  ctx.lineTo(x + width - radius, y);
-  ctx.arcTo(x + width, y, x + width, y + height, radius);
-  ctx.lineTo(x + width, y + height - radius);
-  ctx.arcTo(x + width, y + height, x + width - radius, y + height, radius);
-  ctx.lineTo(x + radius, y + height);
-  ctx.arcTo(x, y + height, x, y + height - radius, radius);
-  ctx.lineTo(x, y + radius);
-  ctx.arcTo(x, y, x + radius, y, radius);
-  ctx.closePath();
-  ctx.fill();
-  ctx.restore();
-  ctx.strokeStyle = (0, _colorUtils.getColorValue)('--identitySolidTone3', 'rgba(37, 224, 166, 1)');
-  ctx.lineWidth = 1;
-  ctx.stroke();
-};
-const resizeText = (ctx, text, maxWidth) => {
-  const fontFamily = (0, _classesUtils.resolveCssValue)('var(--fontFamily)') || 'Inter';
-  let fontSize = 14;
-  ctx.font = "600 ".concat(fontSize, "px ").concat(fontFamily);
-  while (ctx.measureText(text).width > maxWidth && fontSize > 10) {
-    fontSize -= 1;
-    ctx.font = "600 ".concat(fontSize, "px ").concat(fontFamily);
-  }
-  return fontSize;
-};
-const drawBadge = (ctx, x, y, radius, sectionLabel) => {
-  ctx.beginPath();
-  ctx.arc(x, y, radius, 0, Math.PI * 2);
-  ctx.fillStyle = (0, _colorUtils.getColorValue)('--light01', 'rgba(255, 255, 255, 1)');
-  ctx.fill();
-  ctx.lineWidth = 1;
-  ctx.strokeStyle = (0, _colorUtils.getColorValue)('--identitySolidTone3', 'rgba(37, 224, 166, 1)');
-  ctx.stroke();
-  ctx.beginPath();
-  ctx.arc(x, y, 14, 0, Math.PI * 2);
-  ctx.fillStyle = (0, _colorUtils.getColorValue)('--identitySolidTone3', 'rgba(37, 224, 166, 1)');
-  ctx.fill();
-  ctx.stroke();
-  ctx.fillStyle = (0, _colorUtils.getColorValue)('--dark05', 'rgba(9, 30, 66, 1)');
-  const fontSize = resizeText(ctx, "".concat(sectionLabel), 48);
-  ctx.textAlign = 'center';
-  ctx.textBaseline = 'middle';
-  ctx.fillText("".concat(sectionLabel), x, y + fontSize / 10);
-};
-const drawRoundedRect = (ctx, x, yProps, width, height, radius) => {
-  const PADDING_TITLE = 12;
-  const y = yProps + 18;
-  ctx.beginPath();
-  ctx.arc(x - radius + PADDING_TITLE, y + radius, radius, Math.PI, 3 * Math.PI / 2);
-  ctx.arc(x + width - radius + PADDING_TITLE + 2, y + radius, radius, -Math.PI / 2, 0);
-  ctx.arc(x + width - radius + PADDING_TITLE, y + height - radius, radius, 0, Math.PI / 2);
-  ctx.arc(x - radius + PADDING_TITLE, y + height - radius, radius, Math.PI / 2, Math.PI);
-  ctx.closePath();
-  ctx.fillStyle = 'rgb(255, 255, 255)';
-  ctx.fill();
-  ctx.lineWidth = 1;
-  ctx.strokeStyle = (0, _colorUtils.getColorValue)('--identitySolidTone3', 'rgba(37, 224, 166, 1)');
-  ctx.beginPath();
-  ctx.moveTo(x - radius + 4, y);
-  ctx.lineTo(x + PADDING_TITLE + width, y);
-  ctx.moveTo(x - radius + 4, y + height);
-  ctx.lineTo(x + width - radius + PADDING_TITLE * 2 - 4, y + height);
-  ctx.stroke();
-};
-const drawBadgeSelected = (ctx, x, y, radius, sectionLabel, sectionTitle) => {
-  const fontSize = resizeText(ctx, "".concat(sectionLabel), 48);
-  const renderTitle = "".concat(sectionTitle);
-  const textMetrics = ctx.measureText(renderTitle);
-  const textWidth = textMetrics.width;
-  const INTERNAL_CIRCLE_SIZE = 14;
-  const PADDING_TITLE = 12;
-  const newX = x - (PADDING_TITLE + textWidth / 2);
-  ctx.beginPath();
-  ctx.arc(newX + PADDING_TITLE, y, radius, 0, Math.PI * 2);
-  ctx.fillStyle = (0, _colorUtils.getColorValue)('--light01', 'rgba(255, 255, 255, 1)');
-  ctx.fill();
-  ctx.lineWidth = 1;
-  ctx.strokeStyle = (0, _colorUtils.getColorValue)('--identitySolidTone3', 'rgba(37, 224, 166, 1)');
-  ctx.stroke();
-  ctx.beginPath();
-  ctx.arc(newX + textWidth + PADDING_TITLE * 2, y, radius, 0, Math.PI * 2);
-  ctx.fillStyle = (0, _colorUtils.getColorValue)('--light01', 'rgba(255, 255, 255, 1)');
-  ctx.fill();
-  ctx.lineWidth = 1;
-  ctx.strokeStyle = (0, _colorUtils.getColorValue)('--identitySolidTone3', 'rgba(37, 224, 166, 1)');
-  ctx.stroke();
-  drawRoundedRect(ctx, newX + PADDING_TITLE, y - 40, textWidth, radius * 2, Math.PI * 2);
-  ctx.textAlign = 'right';
-  ctx.textBaseline = 'middle';
-  ctx.fillStyle = (0, _colorUtils.getColorValue)('--dark05', 'rgba(9, 30, 66, 1)');
-  ctx.fillText(renderTitle, newX + textWidth + INTERNAL_CIRCLE_SIZE + PADDING_TITLE * 2 - 4, y + fontSize / 10);
-  ctx.beginPath();
-  ctx.arc(newX + PADDING_TITLE, y, INTERNAL_CIRCLE_SIZE, 0, Math.PI * 2);
-  ctx.fillStyle = (0, _colorUtils.getColorValue)('--identitySolidTone3', 'rgba(37, 224, 166, 1)');
-  ctx.fill();
-  ctx.stroke();
-  ctx.fillStyle = (0, _colorUtils.getColorValue)('--dark05', 'rgba(9, 30, 66, 1)');
-  ctx.textAlign = 'center';
-  ctx.textBaseline = 'middle';
-  ctx.fillText("".concat(sectionLabel), newX + PADDING_TITLE, y + fontSize / 10);
-};
-const animateTransition = (ctx, image, sectionSelected, start, end, duration, onUpdate, isClickedSection, onComplete, animations, sectionId, isSheetOpen, isMobileSize) => {
-  var _animations$current;
-  if (!(0, _isEmpty.default)((_animations$current = animations.current) === null || _animations$current === void 0 ? void 0 : _animations$current[sectionId])) {
-    animations.current[sectionId].map(animationId => cancelAnimationFrame(animationId));
-    delete animations.current[sectionId];
-  }
-  let startTime;
-  const animate = timestamp => {
-    if (!startTime) startTime = timestamp;
-    const progress = Math.min((timestamp - startTime) / duration, 1);
-    const lerp = (a, b, t) => a + (b - a) * t;
-    const newPositions = {
-      x: lerp(start.x, end.x, progress),
-      y: lerp(start.y, end.y, progress),
-      radius: start.radius
-    };
-    ctx.save();
-    ctx.beginPath();
-    ctx.moveTo(newPositions.x - newPositions.radius, newPositions.y);
-    ctx.arcTo(newPositions.x + newPositions.radius, newPositions.y, newPositions.x + newPositions.radius, newPositions.y, newPositions.radius);
-    ctx.lineTo(newPositions.x + newPositions.radius + 10, newPositions.y + newPositions.radius * 2);
-    ctx.lineTo(newPositions.x - newPositions.radius - 10, newPositions.y + newPositions.radius * 2);
-    ctx.closePath();
-    ctx.clip();
-    ctx.drawImage(image, newPositions.x - newPositions.radius, newPositions.y - newPositions.radius, newPositions.radius * 2, newPositions.radius * 2 + 15, newPositions.x - newPositions.radius - 1, newPositions.y - newPositions.radius, newPositions.radius * 2 + 2, newPositions.radius * 2 + 15);
-    ctx.restore();
-    onUpdate(newPositions);
-    if (progress < 1 && !isMobileSize || progress < 1 && isSheetOpen && isMobileSize) {
-      animations.current[sectionId].push(requestAnimationFrame(animate));
-    } else {
-      if (isClickedSection) {
-        const x1Section = sectionSelected.section_coordinates[0];
-        const y1Section = sectionSelected.section_coordinates[1];
-        const x2Section = sectionSelected.section_coordinates[2];
-        const y2Section = sectionSelected.section_coordinates[3];
-        drawRoundedStrokeRect(ctx, x1Section, y1Section, x2Section - x1Section, y2Section - y1Section, 8);
-      }
-      if (onComplete) onComplete();
-    }
-  };
-  animations.current[sectionId] = [];
-  requestAnimationFrame(animate);
-};
-const drawSection = (ctx, image, section, actualPage, clickedSection, sectionsCoord, sectionsBadgeCoord, sectionSelected, animations, isSheetOpen, isMobileSize) => {
-  if (actualPage.id === section.page_id) {
-    const [x1, y1, x2, y2] = section.section_coordinates;
-    const width = x2 - x1;
-    const height = y2 - y1;
-    const isClickedSection = clickedSection === "".concat(section.id);
-    sectionsCoord[section.id] = {
-      x1,
-      y1,
-      width,
-      height,
-      radius: 8
-    };
-    const EXTERNAL_RADIUS = 22;
-    const xCircle = (x2 + x1) / 2;
-    const yCircle = isClickedSection ? y1 : (y2 + y1) / 2;
-    sectionsBadgeCoord[section.id] = {
-      x: xCircle,
-      y: yCircle,
-      radius: EXTERNAL_RADIUS
-    };
-    const initialPositions = {
-      x: xCircle,
-      y: (y2 + y1) / 2,
-      radius: EXTERNAL_RADIUS
-    };
-    const finalPositions = isClickedSection ? {
-      x: xCircle,
-      y: y1,
-      radius: EXTERNAL_RADIUS
-    } : initialPositions;
-    const timeAnimation = height < 300 ? 300 : 600;
-    animateTransition(ctx, image, sectionSelected, initialPositions, finalPositions, timeAnimation, newPositions => {
-      if (!isMobileSize || isMobileSize && isSheetOpen) drawBadge(ctx, newPositions.x, newPositions.y, newPositions.radius, section.label);
-    }, isClickedSection, () => {
-      if (isClickedSection) {
-        drawBadgeSelected(ctx, finalPositions.x, finalPositions.y, finalPositions.radius, section.label, section.title);
-      } else {
-        drawBadge(ctx, finalPositions.x, finalPositions.y, finalPositions.radius, section.label);
-      }
-    }, animations, section.id, isSheetOpen, isMobileSize);
-  }
-};
-exports.drawSection = drawSection;
-const handleCanvasClick = (e, canvasRef, onSectionChange, sectionsBadgeCoord, sectionsCoord) => {
-  const canvas = canvasRef.current;
-  const ctx = canvas.getContext('2d');
-  const rect = canvas.getBoundingClientRect();
-  const px = (e.clientX - rect.left) * (canvas.width / rect.width);
-  const py = (e.clientY - rect.top) * (canvas.height / rect.height);
-  const inv = ctx.getTransform().invertSelf();
-  const point = new DOMPoint(px, py).matrixTransform(inv);
-  const xClick = point.x;
-  const yClick = point.y;
-  const onClick = key => {
-    onSectionChange(key);
-  };
-  Object.keys(sectionsBadgeCoord).forEach(key => {
-    const {
-      x,
-      y,
-      radius
-    } = sectionsBadgeCoord[key];
-    const distance = Math.sqrt((xClick - x) ** 2 + (yClick - y) ** 2);
-    if (distance <= radius) {
-      onClick(key);
-    }
-  });
-  Object.entries(sectionsCoord).forEach(_ref => {
-    let [key, {
-      x1,
-      y1,
-      width,
-      height,
-      radius
-    }] = _ref;
-    const isInsideRect = xClick >= x1 && xClick <= x1 + width && yClick >= y1 && yClick <= y1 + height;
-    const centerX = x1 + width / 2;
-    const centerY = y1 + height / 2;
-    const distance = Math.sqrt((xClick - centerX) ** 2 + (yClick - centerY) ** 2);
-    if (isInsideRect || distance <= radius) {
-      onClick(key);
-    }
-  });
-};
-exports.handleCanvasClick = handleCanvasClick;
-const handleMouseMove = (e, canvasRef, sectionsBadgeCoord, sectionsCoord, isPointer) => {
-  const canvas = canvasRef.current;
-  const ctx = canvas.getContext('2d');
-  const rect = canvas.getBoundingClientRect();
-  const px = (e.clientX - rect.left) * (canvas.width / rect.width);
-  const py = (e.clientY - rect.top) * (canvas.height / rect.height);
-  const inv = ctx.getTransform().invertSelf();
-  const point = new DOMPoint(px, py).matrixTransform(inv);
-  const xMove = point.x;
-  const yMove = point.y;
-  Object.keys(sectionsBadgeCoord).forEach(key => {
-    const {
-      x,
-      y,
-      radius
-    } = sectionsBadgeCoord[key];
-    const distance = Math.sqrt((xMove - x) ** 2 + (yMove - y) ** 2);
-    if (distance <= radius) {
-      isPointer = true;
-    }
-  });
-  Object.entries(sectionsCoord).forEach(_ref2 => {
-    let [, {
-      x1,
-      y1,
-      width,
-      height,
-      radius
-    }] = _ref2;
-    const isInsideRect = xMove >= x1 && xMove <= x1 + width && yMove >= y1 && yMove <= y1 + height;
-    const centerX = x1 + width / 2;
-    const centerY = y1 + height / 2;
-    const distance = Math.sqrt((xMove - centerX) ** 2 + (yMove - centerY) ** 2);
-    if (isInsideRect || distance <= radius) {
-      isPointer = true;
-    }
-  });
-  canvas.style.cursor = isPointer ? 'pointer' : 'default';
-};
-exports.handleMouseMove = handleMouseMove;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.handleMouseMove=exports.handleCanvasClick=exports.drawSection=void 0;var _isEmpty=_interopRequireDefault(require("lodash/isEmpty")),_colorUtils=require("../../../../utils/colorUtils"),_classesUtils=require("../../../../utils/classesUtils");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const drawRoundedStrokeRect=(ctx,x,y,width,height,radius)=>{ctx.save(),ctx.globalAlpha=.1,ctx.fillStyle=(0,_colorUtils.getColorValue)("--identitySolidTone3","rgba(37, 224, 166, 1)"),ctx.beginPath(),ctx.moveTo(x+radius,y),ctx.lineTo(x+width-radius,y),ctx.arcTo(x+width,y,x+width,y+height,radius),ctx.lineTo(x+width,y+height-radius),ctx.arcTo(x+width,y+height,x+width-radius,y+height,radius),ctx.lineTo(x+radius,y+height),ctx.arcTo(x,y+height,x,y+height-radius,radius),ctx.lineTo(x,y+radius),ctx.arcTo(x,y,x+radius,y,radius),ctx.closePath(),ctx.fill(),ctx.restore(),ctx.strokeStyle=(0,_colorUtils.getColorValue)("--identitySolidTone3","rgba(37, 224, 166, 1)"),ctx.lineWidth=1,ctx.stroke()},resizeText=(ctx,text,maxWidth)=>{const fontFamily=(0,_classesUtils.resolveCssValue)("var(--fontFamily)")||"Inter";let fontSize=14;for(ctx.font="600 ".concat(fontSize,"px ").concat(fontFamily);ctx.measureText(text).width>maxWidth&&fontSize>10;)fontSize-=1,ctx.font="600 ".concat(fontSize,"px ").concat(fontFamily);return fontSize},drawBadge=(ctx,x,y,radius,sectionLabel)=>{ctx.beginPath(),ctx.arc(x,y,radius,0,2*Math.PI),ctx.fillStyle=(0,_colorUtils.getColorValue)("--light01","rgba(255, 255, 255, 1)"),ctx.fill(),ctx.lineWidth=1,ctx.strokeStyle=(0,_colorUtils.getColorValue)("--identitySolidTone3","rgba(37, 224, 166, 1)"),ctx.stroke(),ctx.beginPath(),ctx.arc(x,y,14,0,2*Math.PI),ctx.fillStyle=(0,_colorUtils.getColorValue)("--identitySolidTone3","rgba(37, 224, 166, 1)"),ctx.fill(),ctx.stroke(),ctx.fillStyle=(0,_colorUtils.getColorValue)("--dark05","rgba(9, 30, 66, 1)");const fontSize=resizeText(ctx,"".concat(sectionLabel),48);ctx.textAlign="center",ctx.textBaseline="middle",ctx.fillText("".concat(sectionLabel),x,y+fontSize/10)},drawRoundedRect=(ctx,x,yProps,width,height,radius)=>{const y=yProps+18;ctx.beginPath(),ctx.arc(x-radius+12,y+radius,radius,Math.PI,3*Math.PI/2),ctx.arc(x+width-radius+12+2,y+radius,radius,-Math.PI/2,0),ctx.arc(x+width-radius+12,y+height-radius,radius,0,Math.PI/2),ctx.arc(x-radius+12,y+height-radius,radius,Math.PI/2,Math.PI),ctx.closePath(),ctx.fillStyle="rgb(255, 255, 255)",ctx.fill(),ctx.lineWidth=1,ctx.strokeStyle=(0,_colorUtils.getColorValue)("--identitySolidTone3","rgba(37, 224, 166, 1)"),ctx.beginPath(),ctx.moveTo(x-radius+4,y),ctx.lineTo(x+12+width,y),ctx.moveTo(x-radius+4,y+height),ctx.lineTo(x+width-radius+24-4,y+height),ctx.stroke()},drawBadgeSelected=(ctx,x,y,radius,sectionLabel,sectionTitle)=>{const fontSize=resizeText(ctx,"".concat(sectionLabel),48),renderTitle="".concat(sectionTitle),textWidth=ctx.measureText(renderTitle).width,newX=x-(12+textWidth/2);ctx.beginPath(),ctx.arc(newX+12,y,radius,0,2*Math.PI),ctx.fillStyle=(0,_colorUtils.getColorValue)("--light01","rgba(255, 255, 255, 1)"),ctx.fill(),ctx.lineWidth=1,ctx.strokeStyle=(0,_colorUtils.getColorValue)("--identitySolidTone3","rgba(37, 224, 166, 1)"),ctx.stroke(),ctx.beginPath(),ctx.arc(newX+textWidth+24,y,radius,0,2*Math.PI),ctx.fillStyle=(0,_colorUtils.getColorValue)("--light01","rgba(255, 255, 255, 1)"),ctx.fill(),ctx.lineWidth=1,ctx.strokeStyle=(0,_colorUtils.getColorValue)("--identitySolidTone3","rgba(37, 224, 166, 1)"),ctx.stroke(),drawRoundedRect(ctx,newX+12,y-40,textWidth,2*radius,2*Math.PI),ctx.textAlign="right",ctx.textBaseline="middle",ctx.fillStyle=(0,_colorUtils.getColorValue)("--dark05","rgba(9, 30, 66, 1)"),ctx.fillText(renderTitle,newX+textWidth+14+24-4,y+fontSize/10),ctx.beginPath(),ctx.arc(newX+12,y,14,0,2*Math.PI),ctx.fillStyle=(0,_colorUtils.getColorValue)("--identitySolidTone3","rgba(37, 224, 166, 1)"),ctx.fill(),ctx.stroke(),ctx.fillStyle=(0,_colorUtils.getColorValue)("--dark05","rgba(9, 30, 66, 1)"),ctx.textAlign="center",ctx.textBaseline="middle",ctx.fillText("".concat(sectionLabel),newX+12,y+fontSize/10)},animateTransition=(ctx,image,sectionSelected,start,end,duration,onUpdate,isClickedSection,onComplete,animations,sectionId,isSheetOpen,isMobileSize)=>{var _animations$current;let startTime;(0,_isEmpty.default)(null===(_animations$current=animations.current)||void 0===_animations$current?void 0:_animations$current[sectionId])||(animations.current[sectionId].map(animationId=>cancelAnimationFrame(animationId)),delete animations.current[sectionId]);const animate=timestamp=>{startTime||(startTime=timestamp);const progress=Math.min((timestamp-startTime)/duration,1),lerp=(a,b,t)=>a+(b-a)*t,newPositions={x:lerp(start.x,end.x,progress),y:lerp(start.y,end.y,progress),radius:start.radius};if(ctx.save(),ctx.beginPath(),ctx.moveTo(newPositions.x-newPositions.radius,newPositions.y),ctx.arcTo(newPositions.x+newPositions.radius,newPositions.y,newPositions.x+newPositions.radius,newPositions.y,newPositions.radius),ctx.lineTo(newPositions.x+newPositions.radius+10,newPositions.y+2*newPositions.radius),ctx.lineTo(newPositions.x-newPositions.radius-10,newPositions.y+2*newPositions.radius),ctx.closePath(),ctx.clip(),ctx.drawImage(image,newPositions.x-newPositions.radius,newPositions.y-newPositions.radius,2*newPositions.radius,2*newPositions.radius+15,newPositions.x-newPositions.radius-1,newPositions.y-newPositions.radius,2*newPositions.radius+2,2*newPositions.radius+15),ctx.restore(),onUpdate(newPositions),progress<1&&!isMobileSize||progress<1&&isSheetOpen&&isMobileSize)animations.current[sectionId].push(requestAnimationFrame(animate));else{if(isClickedSection){const x1Section=sectionSelected.section_coordinates[0],y1Section=sectionSelected.section_coordinates[1],x2Section=sectionSelected.section_coordinates[2],y2Section=sectionSelected.section_coordinates[3];drawRoundedStrokeRect(ctx,x1Section,y1Section,x2Section-x1Section,y2Section-y1Section,8)}onComplete&&onComplete()}};animations.current[sectionId]=[],requestAnimationFrame(animate)},drawSection=(ctx,image,section,actualPage,clickedSection,sectionsCoord,sectionsBadgeCoord,sectionSelected,animations,isSheetOpen,isMobileSize)=>{if(actualPage.id===section.page_id){const[x1,y1,x2,y2]=section.section_coordinates,width=x2-x1,height=y2-y1,isClickedSection=clickedSection==="".concat(section.id);sectionsCoord[section.id]={x1:x1,y1:y1,width:width,height:height,radius:8};const EXTERNAL_RADIUS=22,xCircle=(x2+x1)/2,yCircle=isClickedSection?y1:(y2+y1)/2;sectionsBadgeCoord[section.id]={x:xCircle,y:yCircle,radius:EXTERNAL_RADIUS};const initialPositions={x:xCircle,y:(y2+y1)/2,radius:EXTERNAL_RADIUS},finalPositions=isClickedSection?{x:xCircle,y:y1,radius:EXTERNAL_RADIUS}:initialPositions;animateTransition(ctx,image,sectionSelected,initialPositions,finalPositions,height<300?300:600,newPositions=>{(!isMobileSize||isMobileSize&&isSheetOpen)&&drawBadge(ctx,newPositions.x,newPositions.y,newPositions.radius,section.label)},isClickedSection,()=>{isClickedSection?drawBadgeSelected(ctx,finalPositions.x,finalPositions.y,finalPositions.radius,section.label,section.title):drawBadge(ctx,finalPositions.x,finalPositions.y,finalPositions.radius,section.label)},animations,section.id,isSheetOpen,isMobileSize)}};exports.drawSection=drawSection;const handleCanvasClick=(e,canvasRef,onSectionChange,sectionsBadgeCoord,sectionsCoord)=>{const canvas=canvasRef.current,ctx=canvas.getContext("2d"),rect=canvas.getBoundingClientRect(),px=(e.clientX-rect.left)*(canvas.width/rect.width),py=(e.clientY-rect.top)*(canvas.height/rect.height),inv=ctx.getTransform().invertSelf(),point=new DOMPoint(px,py).matrixTransform(inv),xClick=point.x,yClick=point.y,onClick=key=>{onSectionChange(key)};Object.keys(sectionsBadgeCoord).forEach(key=>{const{x:x,y:y,radius:radius}=sectionsBadgeCoord[key];Math.sqrt((xClick-x)**2+(yClick-y)**2)<=radius&&onClick(key)}),Object.entries(sectionsCoord).forEach(_ref=>{let[key,{x1:x1,y1:y1,width:width,height:height,radius:radius}]=_ref;const isInsideRect=xClick>=x1&&xClick<=x1+width&&yClick>=y1&&yClick<=y1+height,centerX=x1+width/2,centerY=y1+height/2,distance=Math.sqrt((xClick-centerX)**2+(yClick-centerY)**2);(isInsideRect||distance<=radius)&&onClick(key)})};exports.handleCanvasClick=handleCanvasClick;const handleMouseMove=(e,canvasRef,sectionsBadgeCoord,sectionsCoord,isPointer)=>{const canvas=canvasRef.current,ctx=canvas.getContext("2d"),rect=canvas.getBoundingClientRect(),px=(e.clientX-rect.left)*(canvas.width/rect.width),py=(e.clientY-rect.top)*(canvas.height/rect.height),inv=ctx.getTransform().invertSelf(),point=new DOMPoint(px,py).matrixTransform(inv),xMove=point.x,yMove=point.y;Object.keys(sectionsBadgeCoord).forEach(key=>{const{x:x,y:y,radius:radius}=sectionsBadgeCoord[key];Math.sqrt((xMove-x)**2+(yMove-y)**2)<=radius&&(isPointer=!0)}),Object.entries(sectionsCoord).forEach(_ref2=>{let[,{x1:x1,y1:y1,width:width,height:height,radius:radius}]=_ref2;const isInsideRect=xMove>=x1&&xMove<=x1+width&&yMove>=y1&&yMove<=y1+height,centerX=x1+width/2,centerY=y1+height/2,distance=Math.sqrt((xMove-centerX)**2+(yMove-centerY)**2);(isInsideRect||distance<=radius)&&(isPointer=!0)}),canvas.style.cursor=isPointer?"pointer":"default"};exports.handleMouseMove=handleMouseMove;

package/dist/components/UTDocumentWizard/components/SectionDetails/index.js

@@ -1,55 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _propTypes = require("prop-types");
-var _UTLabel = _interopRequireDefault(require("../../../UTLabel"));
-var _UTIcon = _interopRequireDefault(require("../../../UTIcon"));
-var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const SectionDetails = _ref => {
-  let {
-    sectionSelected,
-    titleDefault,
-    descriptionDefault
-  } = _ref;
-  if (!sectionSelected) return /*#__PURE__*/_react.default.createElement("div", {
-    className: _stylesModule.default.containerDefault
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: _stylesModule.default.iconContainer
-  }, /*#__PURE__*/_react.default.createElement(_UTIcon.default, {
-    area: true,
-    colorTheme: "accent",
-    size: 32,
-    name: "IconClick"
-  })), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    className: _stylesModule.default.titleDefault,
-    variant: "title3"
-  }, titleDefault), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    colorTheme: "gray",
-    variant: "body",
-    className: _stylesModule.default.details
-  }, descriptionDefault));
-  const {
-    title,
-    description
-  } = sectionSelected;
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: _stylesModule.default.container
-  }, /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    className: _stylesModule.default.title,
-    variant: "title3"
-  }, title), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    variant: "body",
-    withMarkdown: true
-  }, description));
-};
-SectionDetails.propTypes = {
-  descriptionDefault: _propTypes.string,
-  sectionSelected: _propTypes.object,
-  titleDefault: _propTypes.string
-};
-var _default = exports.default = SectionDetails;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _react=_interopRequireDefault(require("react")),_propTypes=require("prop-types"),_UTLabel=_interopRequireDefault(require("../../../UTLabel")),_UTIcon=_interopRequireDefault(require("../../../UTIcon")),_stylesModule=_interopRequireDefault(require("./styles.module.scss"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const SectionDetails=_ref=>{let{sectionSelected:sectionSelected,titleDefault:titleDefault,descriptionDefault:descriptionDefault}=_ref;if(!sectionSelected)return _react.default.createElement("div",{className:_stylesModule.default.containerDefault},_react.default.createElement("div",{className:_stylesModule.default.iconContainer},_react.default.createElement(_UTIcon.default,{area:!0,colorTheme:"accent",size:32,name:"IconClick"})),_react.default.createElement(_UTLabel.default,{className:_stylesModule.default.titleDefault,variant:"title3"},titleDefault),_react.default.createElement(_UTLabel.default,{colorTheme:"gray",variant:"body",className:_stylesModule.default.details},descriptionDefault));const{title:title,description:description}=sectionSelected;return _react.default.createElement("div",{className:_stylesModule.default.container},_react.default.createElement(_UTLabel.default,{className:_stylesModule.default.title,variant:"title3"},title),_react.default.createElement(_UTLabel.default,{variant:"body",withMarkdown:!0},description))};SectionDetails.propTypes={descriptionDefault:_propTypes.string,sectionSelected:_propTypes.object,titleDefault:_propTypes.string};var _default=exports.default=SectionDetails;

package/dist/components/UTDocumentWizard/components/Sheet/index.js

@@ -1,38 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _propTypes = require("prop-types");
-var _react = _interopRequireDefault(require("react"));
-var _UTLabel = _interopRequireDefault(require("../../../UTLabel"));
-var _stylesModule = _interopRequireDefault(require("./styles.module.scss"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-const Sheet = _ref => {
-  let {
-    sectionSelected
-  } = _ref;
-  const {
-    title,
-    description
-  } = sectionSelected;
-  return /*#__PURE__*/_react.default.createElement("div", {
-    className: _stylesModule.default.container
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: _stylesModule.default.swipeContainer
-  }, /*#__PURE__*/_react.default.createElement("div", {
-    className: _stylesModule.default.swipe
-  })), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    className: _stylesModule.default.title,
-    variant: "title3"
-  }, title), /*#__PURE__*/_react.default.createElement(_UTLabel.default, {
-    colorTheme: "gray",
-    variant: "body",
-    withMarkdown: true
-  }, description));
-};
-Sheet.propTypes = {
-  sectionSelected: _propTypes.object
-};
-var _default = exports.default = Sheet;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _propTypes=require("prop-types"),_react=_interopRequireDefault(require("react")),_UTLabel=_interopRequireDefault(require("../../../UTLabel")),_stylesModule=_interopRequireDefault(require("./styles.module.scss"));function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}const Sheet=_ref=>{let{sectionSelected:sectionSelected}=_ref;const{title:title,description:description}=sectionSelected;return _react.default.createElement("div",{className:_stylesModule.default.container},_react.default.createElement("div",{className:_stylesModule.default.swipeContainer},_react.default.createElement("div",{className:_stylesModule.default.swipe})),_react.default.createElement(_UTLabel.default,{className:_stylesModule.default.title,variant:"title3"},title),_react.default.createElement(_UTLabel.default,{colorTheme:"gray",variant:"body",withMarkdown:!0},description))};Sheet.propTypes={sectionSelected:_propTypes.object};var _default=exports.default=Sheet;

package/dist/components/UTDocumentWizard/constants.js

@@ -1,19 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.SLIDE_PROPS = exports.PREV = exports.NEXT = exports.LAST_OPTION_PROPS = void 0;
-const SLIDE_PROPS = exports.SLIDE_PROPS = {
-  style: {
-    borderTopLeftRadius: '16px',
-    borderTopRightRadius: '16px'
-  }
-};
-const LAST_OPTION_PROPS = exports.LAST_OPTION_PROPS = {
-  style: {
-    marginRight: '4px'
-  }
-};
-const NEXT = exports.NEXT = 'next';
-const PREV = exports.PREV = 'prev';
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.SLIDE_PROPS=exports.PREV=exports.NEXT=exports.LAST_OPTION_PROPS=void 0;const SLIDE_PROPS=exports.SLIDE_PROPS={style:{borderTopLeftRadius:"16px",borderTopRightRadius:"16px"}},LAST_OPTION_PROPS=exports.LAST_OPTION_PROPS={style:{marginRight:"4px"}},NEXT=exports.NEXT="next",PREV=exports.PREV="prev";