@automattic/charts 0.58.0 → 0.59.0

package/dist/charts/sparkline/index.js

@@ -1,18 +0,0 @@
-import {
-  Sparkline,
-  SparklineUnresponsive
-} from "../../chunk-MUNOKLLE.js";
-import "../../chunk-2ICEEQOC.js";
-import "../../chunk-KRWGSOJ2.js";
-import "../../chunk-WTQYGUNF.js";
-import "../../chunk-BPYKWMI7.js";
-import "../../chunk-YAFQVVDI.js";
-import "../../chunk-OP6PHB2U.js";
-import "../../chunk-2I67QUIV.js";
-import "../../chunk-JJIMABHT.js";
-import "../../chunk-G3PMV62Z.js";
-export {
-  Sparkline,
-  SparklineUnresponsive
-};
-//# sourceMappingURL=index.js.map

package/dist/charts/sparkline/index.js.map

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

package/dist/chunk-2A34OA5O.cjs

@@ -1,51 +0,0 @@
-"use strict";Object.defineProperty(exports, "__esModule", {value: true});// src/charts/private/radial-wipe-animation/radial-wipe-animation.tsx
-var _jsxruntime = require('react/jsx-runtime');
-function RadialWipeAnimation({
-  id,
-  radius,
-  innerRadius = 0,
-  durationMs = 1e3,
-  wipePercentage = 100,
-  direction = "clockwise",
-  startAngle = "-90deg"
-}) {
-  const strokeWidth = (radius - innerRadius) * 2 + // The stroke is centered on the circumference, so we need to double the width.
-  1;
-  const scaleY = direction === "clockwise" ? -1 : 1;
-  const isValidWipePercentage = 0 < wipePercentage && wipePercentage <= 100;
-  const animationDuration = `${// If wipePercentage is invalid, set animation duration to 0 to disable animation.
-  isValidWipePercentage ? durationMs * (100 / wipePercentage) : 0}ms`;
-  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "mask", {
-    id,
-    children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "circle", {
-      cx: 0,
-      cy: 0,
-      r: radius,
-      pathLength: "100",
-      fill: "white",
-      stroke: "black",
-      strokeWidth,
-      strokeDasharray: "100, 1000",
-      strokeDashoffset: "0",
-      style: {
-        transform: `rotate(${startAngle}) scaleY(${scaleY})`
-      },
-      children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "animate", {
-        attributeName: "stroke-dashoffset",
-        from: "0",
-        to: "100.1",
-        dur: animationDuration,
-        fill: "freeze",
-        calcMode: "spline",
-        keySplines: "0.42 0 0.58 1;0 0 1 1",
-        keyTimes: `0;${wipePercentage / 100};1`
-      })
-    })
-  });
-}
-var radial_wipe_animation_default = RadialWipeAnimation;
-
-
-
-exports.radial_wipe_animation_default = radial_wipe_animation_default;
-//# sourceMappingURL=chunk-2A34OA5O.cjs.map

package/dist/chunk-2A34OA5O.cjs.map

@@ -1 +0,0 @@
-{"version":3,"sources":["/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-2A34OA5O.cjs","../src/charts/private/radial-wipe-animation/radial-wipe-animation.tsx"],"names":[],"mappings":"AAAA;ACAA,+CAA4B;AAiC5B,SAAS,mBAAA,CAAoB;AAAA,EAC3B,EAAA;AAAA,EACA,MAAA;AAAA,EACA,YAAA,EAAc,CAAA;AAAA,EACd,WAAA,EAAa,GAAA;AAAA,EACb,eAAA,EAAiB,GAAA;AAAA,EACjB,UAAA,EAAY,WAAA;AAAA,EACZ,WAAA,EAAa;AACf,CAAA,EAAG;AACD,EAAA,MAAM,YAAA,EAAA,CAAe,OAAA,EAAS,WAAA,EAAA,EAAe,EAAA;AAAA,EAE7C,CAAA;AAEA,EAAA,MAAM,OAAA,EAAS,UAAA,IAAc,YAAA,EAAc,CAAA,EAAA,EAAK,CAAA;AAChD,EAAA,MAAM,sBAAA,EAAwB,EAAA,EAAI,eAAA,GAAkB,eAAA,GAAkB,GAAA;AACtE,EAAA,MAAM,kBAAA,EAAoB,CAAA;AAAA,EAAA;AAG1B,EAAA;AAAiC,IAAA;AAC/B,IAAA;AACsC,MAAA;AAChC,MAAA;AACA,MAAA;AACD,MAAA;AACS,MAAA;AACN,MAAA;AACE,MAAA;AAER,MAAA;AACiB,MAAA;AACC,MAAA;AACX,QAAA;AAC4C,MAAA;AACnD,MAAA;AACuC,QAAA;AACtB,QAAA;AACT,QAAA;AACF,QAAA;AACC,QAAA;AACC,QAAA;AAEI,QAAA;AAEE,QAAA;AAEuB,MAAA;AACpC,IAAA;AACF,EAAA;AAEL;AACA;ADrCA;AACA;AACA;AACA","file":"/home/runner/work/jetpack/jetpack/projects/js-packages/charts/dist/chunk-2A34OA5O.cjs","sourcesContent":[null,"import { jsx as _jsx } from \"react/jsx-runtime\";\n/**\n * This animation uses the SVG self-drawing technique (source: https://www.joshwcomeau.com/svg/friendly-introduction-to-svg/),\n * leveraging stroke-dasharray and stroke-dashoffset properties to create the effect.\n *\n * Here, we reverse the animation to \"un-draw\" the circle for the revealing / radial wipe effect:\n * - Initially, the entire circle is drawn with a white mask.\n * - The circle's border (stroke) is drawn with a black stroke, wide enough to cover the circle.\n * - The stroke is then \"un-drawn,\" creating the wipe animation.\n * - A white mask makes the area visible, while a black mask makes the area invisible.\n */\n\n/**\n * RadialWipeAnimationProps - SVG mask props that requires a radial wipe animation effect.\n *\n * @param {object}                            props                         - The properties object.\n * @param {string}                            props.id                      - The unique ID for the mask.\n * @param {number}                            props.radius                  - The outer radius of the radial wipe.\n * @param {number}                            [props.innerRadius=0]         - The inner radius of the radial wipe.\n * @param {number}                            [props.durationMs=1000]       - The duration of the animation in milliseconds.\n * @param {number}                            [props.wipePercentage=100]    - The percentage of the wipe animation to complete.\n * @param {'clockwise' | 'counter-clockwise'} [props.direction='clockwise'] - The direction of the wipe animation.\n * @param {Angle}                             [props.startAngle='-90deg']   - The starting angle of the wipe animation.\n *\n * @return {JSX.Element} The radial wipe mask element.\n */\n\n/**\n * Renders a SVG mask that creates a radial wipe animation effect.\n *\n * @param {RadialWipeAnimationProps} props - Component props\n * @return {JSX.Element} The rendered mask component\n */\nfunction RadialWipeAnimation({\n  id,\n  radius,\n  innerRadius = 0,\n  durationMs = 1000,\n  wipePercentage = 100,\n  direction = 'clockwise',\n  startAngle = '-90deg'\n}) {\n  const strokeWidth = (radius - innerRadius) * 2 +\n  // The stroke is centered on the circumference, so we need to double the width.\n  1; // Added 1 to prevent sub-pixel rendering issues.\n\n  const scaleY = direction === 'clockwise' ? -1 : 1;\n  const isValidWipePercentage = 0 < wipePercentage && wipePercentage <= 100;\n  const animationDuration = `${\n  // If wipePercentage is invalid, set animation duration to 0 to disable animation.\n  isValidWipePercentage ? durationMs * (100 / wipePercentage) : 0}ms`;\n  return /*#__PURE__*/_jsx(\"mask\", {\n    id: id,\n    children: /*#__PURE__*/_jsx(\"circle\", {\n      cx: 0,\n      cy: 0,\n      r: radius,\n      pathLength: \"100\",\n      fill: \"white\",\n      stroke: \"black\" // The stroke will be un-drawn, hence 'black' mask.\n      ,\n      strokeWidth: strokeWidth,\n      strokeDasharray: \"100, 1000\",\n      strokeDashoffset: \"0\",\n      style: {\n        transform: `rotate(${startAngle}) scaleY(${scaleY})`\n      },\n      children: /*#__PURE__*/_jsx(\"animate\", {\n        attributeName: \"stroke-dashoffset\",\n        from: \"0\",\n        to: \"100.1\",\n        dur: animationDuration,\n        fill: \"freeze\" // Same as CSS 'forwards' to retain the final state after animation.\n        ,\n        calcMode: \"spline\" // custom easing\n        ,\n        keySplines: \"0.42 0 0.58 1;0 0 1 1\" // ease-in-out ; linear (unimportant)\n        ,\n        keyTimes: `0;${wipePercentage / 100};1`\n      })\n    })\n  });\n}\nexport default RadialWipeAnimation;"]}