@wix/design-system-illustrations 2.25.0 → 2.27.0
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.
- package/dist/cjs/BookingsImagePosition01.js +54 -0
- package/dist/cjs/BookingsImagePosition02.js +54 -0
- package/dist/cjs/BookingsImagePosition03.js +54 -0
- package/dist/cjs/BookingsImagePosition04.js +54 -0
- package/dist/cjs/BookingsImagePosition05.js +54 -0
- package/dist/cjs/BookingsImagePosition06.js +54 -0
- package/dist/cjs/BookingsImagePosition07.js +54 -0
- package/dist/cjs/BookingsImagePosition08.js +54 -0
- package/dist/cjs/BookingsImagePosition09.js +54 -0
- package/dist/cjs/CreateAComponent.js +54 -0
- package/dist/cjs/CreateAContext.js +54 -0
- package/dist/cjs/CreateAFunction.js +52 -0
- package/dist/cjs/ImageSizeL.js +52 -0
- package/dist/cjs/ImageSizeM.js +52 -0
- package/dist/cjs/ImageSizeS.js +52 -0
- package/dist/cjs/animated/ElementsFixedHeight.js +87 -0
- package/dist/cjs/animated/ElementsFixedMargins.js +87 -0
- package/dist/cjs/animated/ElementsScale.js +87 -0
- package/dist/cjs/animated/SectionFixedHeight.js +88 -0
- package/dist/cjs/animated/SectionScale.js +87 -0
- package/dist/cjs/animated/animated.css +857 -16
- package/dist/cjs/animated/index.js +15 -3
- package/dist/cjs/index.js +45 -0
- package/dist/esm/BookingsImagePosition01.js +20 -0
- package/dist/esm/BookingsImagePosition02.js +20 -0
- package/dist/esm/BookingsImagePosition03.js +20 -0
- package/dist/esm/BookingsImagePosition04.js +20 -0
- package/dist/esm/BookingsImagePosition05.js +20 -0
- package/dist/esm/BookingsImagePosition06.js +20 -0
- package/dist/esm/BookingsImagePosition07.js +20 -0
- package/dist/esm/BookingsImagePosition08.js +20 -0
- package/dist/esm/BookingsImagePosition09.js +20 -0
- package/dist/esm/CreateAComponent.js +20 -0
- package/dist/esm/CreateAContext.js +20 -0
- package/dist/esm/CreateAFunction.js +18 -0
- package/dist/esm/ImageSizeL.js +18 -0
- package/dist/esm/ImageSizeM.js +18 -0
- package/dist/esm/ImageSizeS.js +18 -0
- package/dist/esm/animated/ElementsFixedHeight.js +43 -0
- package/dist/esm/animated/ElementsFixedMargins.js +43 -0
- package/dist/esm/animated/ElementsScale.js +43 -0
- package/dist/esm/animated/SectionFixedHeight.js +44 -0
- package/dist/esm/animated/SectionScale.js +43 -0
- package/dist/esm/animated/animated.css +857 -16
- package/dist/esm/animated/index.js +10 -2
- package/dist/esm/index.js +30 -0
- package/dist/types/BookingsImagePosition01.d.ts +5 -0
- package/dist/types/BookingsImagePosition02.d.ts +5 -0
- package/dist/types/BookingsImagePosition03.d.ts +5 -0
- package/dist/types/BookingsImagePosition04.d.ts +5 -0
- package/dist/types/BookingsImagePosition05.d.ts +5 -0
- package/dist/types/BookingsImagePosition06.d.ts +5 -0
- package/dist/types/BookingsImagePosition07.d.ts +5 -0
- package/dist/types/BookingsImagePosition08.d.ts +5 -0
- package/dist/types/BookingsImagePosition09.d.ts +5 -0
- package/dist/types/CreateAComponent.d.ts +5 -0
- package/dist/types/CreateAContext.d.ts +5 -0
- package/dist/types/CreateAFunction.d.ts +5 -0
- package/dist/types/ImageSizeL.d.ts +5 -0
- package/dist/types/ImageSizeM.d.ts +5 -0
- package/dist/types/ImageSizeS.d.ts +5 -0
- package/dist/types/animated/ElementsFixedHeight.d.ts +7 -0
- package/dist/types/animated/ElementsFixedMargins.d.ts +7 -0
- package/dist/types/animated/ElementsScale.d.ts +7 -0
- package/dist/types/animated/SectionFixedHeight.d.ts +7 -0
- package/dist/types/animated/SectionScale.d.ts +7 -0
- package/dist/types/animated/index.d.ts +10 -2
- package/dist/types/index.d.ts +15 -0
- package/package.json +3 -3
- package/src/BookingsImagePosition01.svg +28 -0
- package/src/BookingsImagePosition02.svg +28 -0
- package/src/BookingsImagePosition03.svg +28 -0
- package/src/BookingsImagePosition04.svg +28 -0
- package/src/BookingsImagePosition05.svg +28 -0
- package/src/BookingsImagePosition06.svg +28 -0
- package/src/BookingsImagePosition07.svg +28 -0
- package/src/BookingsImagePosition08.svg +28 -0
- package/src/BookingsImagePosition09.svg +28 -0
- package/src/CreateAComponent.svg +23 -0
- package/src/CreateAContext.svg +43 -0
- package/src/CreateAFunction.svg +29 -0
- package/src/ImageSizeL.svg +10 -0
- package/src/ImageSizeM.svg +10 -0
- package/src/ImageSizeS.svg +10 -0
- package/src/animated/ElementsFixedHeight.html +261 -0
- package/src/animated/ElementsFixedMargins.html +225 -0
- package/src/animated/SectionFixedHeight.html +283 -0
- package/src/animated/SectionScale.html +381 -0
- package/dist/cjs/animated/ThumbnailScale.js +0 -87
- package/dist/esm/animated/ThumbnailScale.js +0 -43
- package/dist/types/animated/ThumbnailScale.d.ts +0 -7
- /package/src/animated/{ThumbnailScale.html → ElementsScale.html} +0 -0
|
@@ -1,87 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __create = Object.create;
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
-
var __export = (target, all) => {
|
|
9
|
-
for (var name in all)
|
|
10
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
-
};
|
|
12
|
-
var __copyProps = (to, from, except, desc) => {
|
|
13
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
-
for (let key of __getOwnPropNames(from))
|
|
15
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
-
}
|
|
18
|
-
return to;
|
|
19
|
-
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
-
mod
|
|
27
|
-
));
|
|
28
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
-
var ThumbnailScale_exports = {};
|
|
30
|
-
__export(ThumbnailScale_exports, {
|
|
31
|
-
ThumbnailScale: () => ThumbnailScale
|
|
32
|
-
});
|
|
33
|
-
module.exports = __toCommonJS(ThumbnailScale_exports);
|
|
34
|
-
var import_react = __toESM(require("react"));
|
|
35
|
-
const ThumbnailScale = (0, import_react.forwardRef)(
|
|
36
|
-
({ className, ...props }, ref) => {
|
|
37
|
-
const svgRef = (0, import_react.useRef)(null);
|
|
38
|
-
(0, import_react.useImperativeHandle)(
|
|
39
|
-
ref,
|
|
40
|
-
() => ({
|
|
41
|
-
play: () => {
|
|
42
|
-
var _a;
|
|
43
|
-
return (_a = svgRef.current) == null ? void 0 : _a.getAnimations({ subtree: true }).forEach((a) => a.play());
|
|
44
|
-
},
|
|
45
|
-
pause: () => {
|
|
46
|
-
var _a;
|
|
47
|
-
return (_a = svgRef.current) == null ? void 0 : _a.getAnimations({ subtree: true }).forEach((a) => a.pause());
|
|
48
|
-
},
|
|
49
|
-
reset: () => {
|
|
50
|
-
var _a;
|
|
51
|
-
return (_a = svgRef.current) == null ? void 0 : _a.getAnimations({ subtree: true }).forEach((a) => {
|
|
52
|
-
a.currentTime = 0;
|
|
53
|
-
a.pause();
|
|
54
|
-
});
|
|
55
|
-
}
|
|
56
|
-
}),
|
|
57
|
-
[]
|
|
58
|
-
);
|
|
59
|
-
(0, import_react.useEffect)(() => {
|
|
60
|
-
var _a;
|
|
61
|
-
(_a = svgRef.current) == null ? void 0 : _a.getAnimations({ subtree: true }).forEach((a) => {
|
|
62
|
-
a.currentTime = 0;
|
|
63
|
-
a.pause();
|
|
64
|
-
});
|
|
65
|
-
}, []);
|
|
66
|
-
return /* @__PURE__ */ import_react.default.createElement(
|
|
67
|
-
"svg",
|
|
68
|
-
{
|
|
69
|
-
ref: svgRef,
|
|
70
|
-
viewBox: "0 0 236 127",
|
|
71
|
-
fill: "none",
|
|
72
|
-
width: 236,
|
|
73
|
-
height: 127,
|
|
74
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
75
|
-
className: ["ThumbnailScale-root", className].filter(Boolean).join(" "),
|
|
76
|
-
...props
|
|
77
|
-
},
|
|
78
|
-
/* @__PURE__ */ import_react.default.createElement("defs", null, /* @__PURE__ */ import_react.default.createElement("linearGradient", { id: "ThumbnailScale-paint0_linear_4125_12361", x1: "110.482", y1: "60.3398", x2: "133.552", y2: "78.8708", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0", stopColor: "#EAEFFF" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.325264", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "1", stopColor: "#002294" })), /* @__PURE__ */ import_react.default.createElement("linearGradient", { id: "ThumbnailScale-paint0_linear_4125_12403", x1: "113.562", y1: "61.7065", x2: "126.645", y2: "72.2151", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0", stopColor: "#EAEFFF" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.325264", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "1", stopColor: "#002294" })), /* @__PURE__ */ import_react.default.createElement("linearGradient", { id: "ThumbnailScale-paint1_linear_4125_12361", x1: "95.2177", y1: "37.3346", x2: "140.84", y2: "82.5369", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0", stopColor: "#EAEFFF" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.5", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.95", stopColor: "#002294" })), /* @__PURE__ */ import_react.default.createElement("linearGradient", { id: "ThumbnailScale-paint1_linear_4125_12403", x1: "104.902", y1: "48.661", x2: "130.774", y2: "74.2946", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0", stopColor: "#EAEFFF" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.5", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.95", stopColor: "#002294" })), /* @__PURE__ */ import_react.default.createElement("linearGradient", { id: "ThumbnailScale-paint2_linear_4125_12361", x1: "113.012", y1: "41.6462", x2: "94.9412", y2: "64.7056", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.176006", stopColor: "#EAEFFF" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.576923", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.85", stopColor: "#002294" })), /* @__PURE__ */ import_react.default.createElement("linearGradient", { id: "ThumbnailScale-paint2_linear_4125_12403", x1: "114.992", y1: "51.1105", x2: "104.744", y2: "64.1871", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.176006", stopColor: "#EAEFFF" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.576923", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ import_react.default.createElement("stop", { offset: "0.85", stopColor: "#002294" })), /* @__PURE__ */ import_react.default.createElement("filter", { id: "ThumbnailScale-filter0_i_4125_12361", filterUnits: "objectBoundingBox", x: "-1", y: "-1", width: "3", height: "3", colorInterpolationFilters: "sRGB" }, /* @__PURE__ */ import_react.default.createElement("feFlood", { result: "BackgroundImageFix", floodOpacity: "0" }), /* @__PURE__ */ import_react.default.createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), /* @__PURE__ */ import_react.default.createElement("feColorMatrix", { in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }), /* @__PURE__ */ import_react.default.createElement("feOffset", { dx: "1", dy: "1" }), /* @__PURE__ */ import_react.default.createElement("feGaussianBlur", { stdDeviation: "1.5" }), /* @__PURE__ */ import_react.default.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }), /* @__PURE__ */ import_react.default.createElement("feColorMatrix", { type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.14 0" }), /* @__PURE__ */ import_react.default.createElement("feBlend", { mode: "normal", in2: "shape", result: "effect1_innerShadow_4125_12361" })), /* @__PURE__ */ import_react.default.createElement("filter", { id: "ThumbnailScale-filter1_f_4125_12361", filterUnits: "objectBoundingBox", x: "-1", y: "-1", width: "3", height: "3", colorInterpolationFilters: "sRGB" }, /* @__PURE__ */ import_react.default.createElement("feFlood", { result: "BackgroundImageFix", floodOpacity: "0" }), /* @__PURE__ */ import_react.default.createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), /* @__PURE__ */ import_react.default.createElement("feGaussianBlur", { stdDeviation: "1.01565", result: "effect1_foregroundBlur_4125_12361" })), /* @__PURE__ */ import_react.default.createElement("clipPath", { id: "ThumbnailScale-clip0_4125_12361" }, /* @__PURE__ */ import_react.default.createElement("rect", { x: "44.5", y: "23", width: "147", height: "81", rx: "6", fill: "white" })), /* @__PURE__ */ import_react.default.createElement("clipPath", { id: "ThumbnailScale-clip1_4125_12361" }, /* @__PURE__ */ import_react.default.createElement("rect", { x: "44.8125", y: "23", width: "147", height: "81", rx: "6", fill: "white" })), /* @__PURE__ */ import_react.default.createElement("clipPath", { id: "ThumbnailScale-clip2_4125_12361" }, /* @__PURE__ */ import_react.default.createElement("rect", { x: "89.6719", y: "42.668", width: "57.2851", height: "41.6619", rx: "3.9058", fill: "white" })), /* @__PURE__ */ import_react.default.createElement("clipPath", { id: "ThumbnailScale-clip3_4125_12361" }, /* @__PURE__ */ import_react.default.createElement("rect", { x: "89.6719", y: "42.668", width: "57.2851", height: "42.5019", rx: "3.69581", fill: "white" })), /* @__PURE__ */ import_react.default.createElement("clipPath", { id: "ThumbnailScale-clip4_4125_12361" }, /* @__PURE__ */ import_react.default.createElement("rect", { x: "94.8828", y: "47.875", width: "11.7174", height: "11.7174", rx: "5.8587", fill: "white" })), /* @__PURE__ */ import_react.default.createElement("filter", { id: "ThumbnailScale-filter0_i_4125_12403", filterUnits: "objectBoundingBox", x: "-1", y: "-1", width: "3", height: "3", colorInterpolationFilters: "sRGB" }, /* @__PURE__ */ import_react.default.createElement("feFlood", { result: "BackgroundImageFix", floodOpacity: "0" }), /* @__PURE__ */ import_react.default.createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), /* @__PURE__ */ import_react.default.createElement("feColorMatrix", { in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }), /* @__PURE__ */ import_react.default.createElement("feOffset", { dx: "1", dy: "1" }), /* @__PURE__ */ import_react.default.createElement("feGaussianBlur", { stdDeviation: "1.5" }), /* @__PURE__ */ import_react.default.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }), /* @__PURE__ */ import_react.default.createElement("feColorMatrix", { type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.14 0" }), /* @__PURE__ */ import_react.default.createElement("feBlend", { mode: "normal", in2: "shape", result: "effect1_innerShadow_4125_12403" })), /* @__PURE__ */ import_react.default.createElement("filter", { id: "ThumbnailScale-filter1_f_4125_12403", filterUnits: "objectBoundingBox", x: "-1", y: "-1", width: "3", height: "3", colorInterpolationFilters: "sRGB" }, /* @__PURE__ */ import_react.default.createElement("feFlood", { result: "BackgroundImageFix", floodOpacity: "0" }), /* @__PURE__ */ import_react.default.createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), /* @__PURE__ */ import_react.default.createElement("feGaussianBlur", { stdDeviation: "0.575959", result: "effect1_foregroundBlur_4125_12403" })), /* @__PURE__ */ import_react.default.createElement("clipPath", { id: "ThumbnailScale-clip0_4125_12403" }, /* @__PURE__ */ import_react.default.createElement("rect", { x: "101.758", y: "51.6875", width: "32.4856", height: "23.6259", rx: "2.21493", fill: "white" })), /* @__PURE__ */ import_react.default.createElement("clipPath", { id: "ThumbnailScale-clip1_4125_12403" }, /* @__PURE__ */ import_react.default.createElement("rect", { x: "101.758", y: "51.6875", width: "32.4856", height: "24.1022", rx: "2.09584", fill: "white" })), /* @__PURE__ */ import_react.default.createElement("clipPath", { id: "ThumbnailScale-clip2_4125_12403" }, /* @__PURE__ */ import_react.default.createElement("rect", { x: "104.711", y: "54.6406", width: "6.64478", height: "6.64478", rx: "3.32239", fill: "white" }))),
|
|
79
|
-
/* @__PURE__ */ import_react.default.createElement("g", { fill: "none", filter: "url(#ThumbnailScale-filter0_i_4125_12361)" }, /* @__PURE__ */ import_react.default.createElement("path", { d: "M0 8C0 3.58172 3.58172 0 8 0H228C232.418 0 236 3.58172 236 8V119C236 123.418 232.418 127 228 127H8C3.58172 127 0 123.418 0 119V8Z", fill: "#303030" }), /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none", clipPath: "url(#ThumbnailScale-clip0_4125_12361)" }, /* @__PURE__ */ import_react.default.createElement("rect", { x: "81.5", y: "23", width: "73", height: "81", rx: "6", fill: "var(--wds-illustration-color-background, #f8f6f6)", className: "ThumbnailScale-node-3", fillOpacity: "0.25" }), /* @__PURE__ */ import_react.default.createElement("g", { fill: "none", className: "ThumbnailScale-Frame-2147240028" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }), /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none", clipPath: "url(#ThumbnailScale-clip1_4125_12361)" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none", clipPath: "url(#ThumbnailScale-clip2_4125_12361)" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none", clipPath: "url(#ThumbnailScale-clip3_4125_12361)" }, /* @__PURE__ */ import_react.default.createElement("rect", { x: "89.6719", y: "42.668", width: "57.2851", height: "42.5019", rx: "3.69581", fill: "#eaefff" }))), /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("path", { d: "M119.091 51.7305L103.07 77.0863L131.643 72.9157L119.091 51.7305Z", fill: "url(#ThumbnailScale-paint0_linear_4125_12361)" }), /* @__PURE__ */ import_react.default.createElement("path", { d: "M147.883 60.7829C147.883 60.7829 125.917 51.9748 124.845 51.5285C123.774 51.0823 117.127 49.0176 119.092 54.9706C121.045 60.8862 122.115 63.1612 122.541 64.1714C122.966 65.1815 124.699 69.2975 120.34 70.8162C115.398 72.5369 88.75 80.7082 88.75 80.7082V85.401H147.883V60.7829Z", fill: "url(#ThumbnailScale-paint1_linear_4125_12361)" })), /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("g", { fill: "none", clipPath: "url(#ThumbnailScale-clip4_4125_12361)" }, /* @__PURE__ */ import_react.default.createElement("rect", { x: "94.8828", y: "47.875", width: "11.7174", height: "11.7174", rx: "5.8587", fill: "#002294" }), /* @__PURE__ */ import_react.default.createElement("g", { fill: "none", filter: "url(#ThumbnailScale-filter1_f_4125_12361)" }, /* @__PURE__ */ import_react.default.createElement("path", { d: "M103.526 39.9477C102.962 40.0598 102.405 40.2153 101.863 40.4142C99.6365 41.2387 97.6628 42.8081 96.3614 45.0176C93.3864 50.0622 95.042 56.5243 100.059 59.4498C105.077 62.3753 111.555 60.6539 114.53 55.6094C117.505 50.5612 115.849 44.0991 110.835 41.1772C108.543 39.8392 105.952 39.474 103.526 39.9477Z", fill: "url(#ThumbnailScale-paint2_linear_4125_12361)" })))))))))))))))), /* @__PURE__ */ import_react.default.createElement("g", { fill: "none" }, /* @__PURE__ */ import_react.default.createElement("path", { d: "M42 59H40V69H42V59Z", fill: "var(--wds-illustration-color-3, #b8c4ff)", className: "ThumbnailScale-Vector_4" }), /* @__PURE__ */ import_react.default.createElement("path", { d: "M196 59H194V69H196V59Z", fill: "var(--wds-illustration-color-3, #b8c4ff)", className: "ThumbnailScale-Vector_5" }))))
|
|
80
|
-
);
|
|
81
|
-
}
|
|
82
|
-
);
|
|
83
|
-
ThumbnailScale.displayName = "ThumbnailScale";
|
|
84
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
85
|
-
0 && (module.exports = {
|
|
86
|
-
ThumbnailScale
|
|
87
|
-
});
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
import React, { forwardRef, useEffect, useImperativeHandle, useRef } from "react";
|
|
2
|
-
const ThumbnailScale = forwardRef(
|
|
3
|
-
({ className, ...props }, ref) => {
|
|
4
|
-
const svgRef = useRef(null);
|
|
5
|
-
useImperativeHandle(
|
|
6
|
-
ref,
|
|
7
|
-
() => ({
|
|
8
|
-
play: () => svgRef.current?.getAnimations({ subtree: true }).forEach((a) => a.play()),
|
|
9
|
-
pause: () => svgRef.current?.getAnimations({ subtree: true }).forEach((a) => a.pause()),
|
|
10
|
-
reset: () => svgRef.current?.getAnimations({ subtree: true }).forEach((a) => {
|
|
11
|
-
a.currentTime = 0;
|
|
12
|
-
a.pause();
|
|
13
|
-
})
|
|
14
|
-
}),
|
|
15
|
-
[]
|
|
16
|
-
);
|
|
17
|
-
useEffect(() => {
|
|
18
|
-
svgRef.current?.getAnimations({ subtree: true }).forEach((a) => {
|
|
19
|
-
a.currentTime = 0;
|
|
20
|
-
a.pause();
|
|
21
|
-
});
|
|
22
|
-
}, []);
|
|
23
|
-
return /* @__PURE__ */ React.createElement(
|
|
24
|
-
"svg",
|
|
25
|
-
{
|
|
26
|
-
ref: svgRef,
|
|
27
|
-
viewBox: "0 0 236 127",
|
|
28
|
-
fill: "none",
|
|
29
|
-
width: 236,
|
|
30
|
-
height: 127,
|
|
31
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
32
|
-
className: ["ThumbnailScale-root", className].filter(Boolean).join(" "),
|
|
33
|
-
...props
|
|
34
|
-
},
|
|
35
|
-
/* @__PURE__ */ React.createElement("defs", null, /* @__PURE__ */ React.createElement("linearGradient", { id: "ThumbnailScale-paint0_linear_4125_12361", x1: "110.482", y1: "60.3398", x2: "133.552", y2: "78.8708", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ React.createElement("stop", { offset: "0", stopColor: "#EAEFFF" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.325264", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ React.createElement("stop", { offset: "1", stopColor: "#002294" })), /* @__PURE__ */ React.createElement("linearGradient", { id: "ThumbnailScale-paint0_linear_4125_12403", x1: "113.562", y1: "61.7065", x2: "126.645", y2: "72.2151", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ React.createElement("stop", { offset: "0", stopColor: "#EAEFFF" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.325264", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ React.createElement("stop", { offset: "1", stopColor: "#002294" })), /* @__PURE__ */ React.createElement("linearGradient", { id: "ThumbnailScale-paint1_linear_4125_12361", x1: "95.2177", y1: "37.3346", x2: "140.84", y2: "82.5369", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ React.createElement("stop", { offset: "0", stopColor: "#EAEFFF" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.5", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.95", stopColor: "#002294" })), /* @__PURE__ */ React.createElement("linearGradient", { id: "ThumbnailScale-paint1_linear_4125_12403", x1: "104.902", y1: "48.661", x2: "130.774", y2: "74.2946", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ React.createElement("stop", { offset: "0", stopColor: "#EAEFFF" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.5", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.95", stopColor: "#002294" })), /* @__PURE__ */ React.createElement("linearGradient", { id: "ThumbnailScale-paint2_linear_4125_12361", x1: "113.012", y1: "41.6462", x2: "94.9412", y2: "64.7056", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ React.createElement("stop", { offset: "0.176006", stopColor: "#EAEFFF" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.576923", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.85", stopColor: "#002294" })), /* @__PURE__ */ React.createElement("linearGradient", { id: "ThumbnailScale-paint2_linear_4125_12403", x1: "114.992", y1: "51.1105", x2: "104.744", y2: "64.1871", gradientUnits: "userSpaceOnUse" }, /* @__PURE__ */ React.createElement("stop", { offset: "0.176006", stopColor: "#EAEFFF" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.576923", stopColor: "var(--wds-illustration-color-3, #b8c4ff)" }), /* @__PURE__ */ React.createElement("stop", { offset: "0.85", stopColor: "#002294" })), /* @__PURE__ */ React.createElement("filter", { id: "ThumbnailScale-filter0_i_4125_12361", filterUnits: "objectBoundingBox", x: "-1", y: "-1", width: "3", height: "3", colorInterpolationFilters: "sRGB" }, /* @__PURE__ */ React.createElement("feFlood", { result: "BackgroundImageFix", floodOpacity: "0" }), /* @__PURE__ */ React.createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), /* @__PURE__ */ React.createElement("feColorMatrix", { in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }), /* @__PURE__ */ React.createElement("feOffset", { dx: "1", dy: "1" }), /* @__PURE__ */ React.createElement("feGaussianBlur", { stdDeviation: "1.5" }), /* @__PURE__ */ React.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }), /* @__PURE__ */ React.createElement("feColorMatrix", { type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.14 0" }), /* @__PURE__ */ React.createElement("feBlend", { mode: "normal", in2: "shape", result: "effect1_innerShadow_4125_12361" })), /* @__PURE__ */ React.createElement("filter", { id: "ThumbnailScale-filter1_f_4125_12361", filterUnits: "objectBoundingBox", x: "-1", y: "-1", width: "3", height: "3", colorInterpolationFilters: "sRGB" }, /* @__PURE__ */ React.createElement("feFlood", { result: "BackgroundImageFix", floodOpacity: "0" }), /* @__PURE__ */ React.createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), /* @__PURE__ */ React.createElement("feGaussianBlur", { stdDeviation: "1.01565", result: "effect1_foregroundBlur_4125_12361" })), /* @__PURE__ */ React.createElement("clipPath", { id: "ThumbnailScale-clip0_4125_12361" }, /* @__PURE__ */ React.createElement("rect", { x: "44.5", y: "23", width: "147", height: "81", rx: "6", fill: "white" })), /* @__PURE__ */ React.createElement("clipPath", { id: "ThumbnailScale-clip1_4125_12361" }, /* @__PURE__ */ React.createElement("rect", { x: "44.8125", y: "23", width: "147", height: "81", rx: "6", fill: "white" })), /* @__PURE__ */ React.createElement("clipPath", { id: "ThumbnailScale-clip2_4125_12361" }, /* @__PURE__ */ React.createElement("rect", { x: "89.6719", y: "42.668", width: "57.2851", height: "41.6619", rx: "3.9058", fill: "white" })), /* @__PURE__ */ React.createElement("clipPath", { id: "ThumbnailScale-clip3_4125_12361" }, /* @__PURE__ */ React.createElement("rect", { x: "89.6719", y: "42.668", width: "57.2851", height: "42.5019", rx: "3.69581", fill: "white" })), /* @__PURE__ */ React.createElement("clipPath", { id: "ThumbnailScale-clip4_4125_12361" }, /* @__PURE__ */ React.createElement("rect", { x: "94.8828", y: "47.875", width: "11.7174", height: "11.7174", rx: "5.8587", fill: "white" })), /* @__PURE__ */ React.createElement("filter", { id: "ThumbnailScale-filter0_i_4125_12403", filterUnits: "objectBoundingBox", x: "-1", y: "-1", width: "3", height: "3", colorInterpolationFilters: "sRGB" }, /* @__PURE__ */ React.createElement("feFlood", { result: "BackgroundImageFix", floodOpacity: "0" }), /* @__PURE__ */ React.createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), /* @__PURE__ */ React.createElement("feColorMatrix", { in: "SourceAlpha", type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0", result: "hardAlpha" }), /* @__PURE__ */ React.createElement("feOffset", { dx: "1", dy: "1" }), /* @__PURE__ */ React.createElement("feGaussianBlur", { stdDeviation: "1.5" }), /* @__PURE__ */ React.createElement("feComposite", { in2: "hardAlpha", operator: "arithmetic", k2: "-1", k3: "1" }), /* @__PURE__ */ React.createElement("feColorMatrix", { type: "matrix", values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.14 0" }), /* @__PURE__ */ React.createElement("feBlend", { mode: "normal", in2: "shape", result: "effect1_innerShadow_4125_12403" })), /* @__PURE__ */ React.createElement("filter", { id: "ThumbnailScale-filter1_f_4125_12403", filterUnits: "objectBoundingBox", x: "-1", y: "-1", width: "3", height: "3", colorInterpolationFilters: "sRGB" }, /* @__PURE__ */ React.createElement("feFlood", { result: "BackgroundImageFix", floodOpacity: "0" }), /* @__PURE__ */ React.createElement("feBlend", { mode: "normal", in: "SourceGraphic", in2: "BackgroundImageFix", result: "shape" }), /* @__PURE__ */ React.createElement("feGaussianBlur", { stdDeviation: "0.575959", result: "effect1_foregroundBlur_4125_12403" })), /* @__PURE__ */ React.createElement("clipPath", { id: "ThumbnailScale-clip0_4125_12403" }, /* @__PURE__ */ React.createElement("rect", { x: "101.758", y: "51.6875", width: "32.4856", height: "23.6259", rx: "2.21493", fill: "white" })), /* @__PURE__ */ React.createElement("clipPath", { id: "ThumbnailScale-clip1_4125_12403" }, /* @__PURE__ */ React.createElement("rect", { x: "101.758", y: "51.6875", width: "32.4856", height: "24.1022", rx: "2.09584", fill: "white" })), /* @__PURE__ */ React.createElement("clipPath", { id: "ThumbnailScale-clip2_4125_12403" }, /* @__PURE__ */ React.createElement("rect", { x: "104.711", y: "54.6406", width: "6.64478", height: "6.64478", rx: "3.32239", fill: "white" }))),
|
|
36
|
-
/* @__PURE__ */ React.createElement("g", { fill: "none", filter: "url(#ThumbnailScale-filter0_i_4125_12361)" }, /* @__PURE__ */ React.createElement("path", { d: "M0 8C0 3.58172 3.58172 0 8 0H228C232.418 0 236 3.58172 236 8V119C236 123.418 232.418 127 228 127H8C3.58172 127 0 123.418 0 119V8Z", fill: "#303030" }), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: "url(#ThumbnailScale-clip0_4125_12361)" }, /* @__PURE__ */ React.createElement("rect", { x: "81.5", y: "23", width: "73", height: "81", rx: "6", fill: "var(--wds-illustration-color-background, #f8f6f6)", className: "ThumbnailScale-node-3", fillOpacity: "0.25" }), /* @__PURE__ */ React.createElement("g", { fill: "none", className: "ThumbnailScale-Frame-2147240028" }, /* @__PURE__ */ React.createElement("g", { fill: "none" }), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: "url(#ThumbnailScale-clip1_4125_12361)" }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: "url(#ThumbnailScale-clip2_4125_12361)" }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: "url(#ThumbnailScale-clip3_4125_12361)" }, /* @__PURE__ */ React.createElement("rect", { x: "89.6719", y: "42.668", width: "57.2851", height: "42.5019", rx: "3.69581", fill: "#eaefff" }))), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M119.091 51.7305L103.07 77.0863L131.643 72.9157L119.091 51.7305Z", fill: "url(#ThumbnailScale-paint0_linear_4125_12361)" }), /* @__PURE__ */ React.createElement("path", { d: "M147.883 60.7829C147.883 60.7829 125.917 51.9748 124.845 51.5285C123.774 51.0823 117.127 49.0176 119.092 54.9706C121.045 60.8862 122.115 63.1612 122.541 64.1714C122.966 65.1815 124.699 69.2975 120.34 70.8162C115.398 72.5369 88.75 80.7082 88.75 80.7082V85.401H147.883V60.7829Z", fill: "url(#ThumbnailScale-paint1_linear_4125_12361)" })), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("g", { fill: "none", clipPath: "url(#ThumbnailScale-clip4_4125_12361)" }, /* @__PURE__ */ React.createElement("rect", { x: "94.8828", y: "47.875", width: "11.7174", height: "11.7174", rx: "5.8587", fill: "#002294" }), /* @__PURE__ */ React.createElement("g", { fill: "none", filter: "url(#ThumbnailScale-filter1_f_4125_12361)" }, /* @__PURE__ */ React.createElement("path", { d: "M103.526 39.9477C102.962 40.0598 102.405 40.2153 101.863 40.4142C99.6365 41.2387 97.6628 42.8081 96.3614 45.0176C93.3864 50.0622 95.042 56.5243 100.059 59.4498C105.077 62.3753 111.555 60.6539 114.53 55.6094C117.505 50.5612 115.849 44.0991 110.835 41.1772C108.543 39.8392 105.952 39.474 103.526 39.9477Z", fill: "url(#ThumbnailScale-paint2_linear_4125_12361)" })))))))))))))))), /* @__PURE__ */ React.createElement("g", { fill: "none" }, /* @__PURE__ */ React.createElement("path", { d: "M42 59H40V69H42V59Z", fill: "var(--wds-illustration-color-3, #b8c4ff)", className: "ThumbnailScale-Vector_4" }), /* @__PURE__ */ React.createElement("path", { d: "M196 59H194V69H196V59Z", fill: "var(--wds-illustration-color-3, #b8c4ff)", className: "ThumbnailScale-Vector_5" }))))
|
|
37
|
-
);
|
|
38
|
-
}
|
|
39
|
-
);
|
|
40
|
-
ThumbnailScale.displayName = "ThumbnailScale";
|
|
41
|
-
export {
|
|
42
|
-
ThumbnailScale
|
|
43
|
-
};
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
export type ThumbnailScaleHandle = {
|
|
3
|
-
play: () => void;
|
|
4
|
-
pause: () => void;
|
|
5
|
-
reset: () => void;
|
|
6
|
-
};
|
|
7
|
-
export declare const ThumbnailScale: React.ForwardRefExoticComponent<Omit<React.SVGProps<SVGSVGElement>, "ref"> & React.RefAttributes<ThumbnailScaleHandle>>;
|
|
File without changes
|