@gravity-ui/page-constructor 8.4.1 → 8.5.0-alpha.0

package/server/models/constructor-items/blocks.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
 import { ButtonSize } from '@gravity-ui/uikit';
-import { GridColumnSize, GridColumnSizesType, IndentValue } from '../../grid/types';
+import { GridColumnSize, GridColumnSizesType, IndentValue } from '../../gravity-blocks/grid/types';
 import { ThemeSupporting } from '../../utils';
 import { DeviceSupporting } from '../../utils/breakpoint';
-import { AnalyticsEventsBase } from '../common';
+import { AnalyticsEventsBase, AnalyticsEventsProp } from '../common';
 import { AnchorProps, Animatable, BackgroundImageProps, ButtonProps, CardBorder, ContentSize, ContentTextSize, ContentTheme, FileLinkProps, GravityIconProps, HeaderBreadCrumbsProps, HeaderImageSize, HeaderOffset, HeaderWidth, ImageDeviceProps, ImageProps, Justify, LegendTableMarkerType, LinkProps, MapProps, MediaComponentImageProps, MediaComponentVideoProps, MediaDirection, MediaProps, MediaView, TextSize, TextTheme, ThemedImage, ThemedMediaProps, ThemedMediaVideoProps, TitleItemBaseProps, TitleItemProps, WithBorder, YandexFormProps } from './common';
 import { BannerCardProps, HubspotFormProps, SubBlock, SubBlockModels } from './sub-blocks';
 export declare enum BlockType {
@@ -298,6 +298,7 @@ export interface CardLayoutBlockProps extends Childable, Animatable, LoadableChi
 export type FilterTag = {
     id: string;
     label: string;
+    analyticsEvent?: AnalyticsEventsProp;
 };
 export type FilterItem = {
     tags: string[];
@@ -309,7 +310,7 @@ export interface FilterBlockProps extends Animatable {
     title?: TitleItemProps | string;
     description?: string;
     tagButtonSize?: ButtonSize;
-    allTag?: boolean | string;
+    allTag?: boolean | string | FilterTag;
     colSizes?: GridColumnSizesType;
     centered?: boolean;
 }

package/server/models/constructor.d.ts

@@ -1,16 +1,16 @@
 import * as React from 'react';
-import { Animatable, BlockDecorationProps, ConstructorItem, ThemedMediaProps } from './';
+import { Animatable, ConstructorItem } from './';
 export interface PageData {
     content: PageContent;
 }
-export interface Menu {
-    title: string;
-}
 export type ConstructorBlock = ConstructorItem | CustomBlock;
+/**
+ * Core PageContent type - minimal fields that the engine needs.
+ * Plugins can extend this with their own fields using the index signature.
+ */
 export interface PageContent extends Animatable {
     blocks: ConstructorBlock[];
-    menu?: Menu;
-    background?: ThemedMediaProps;
+    [key: string]: unknown;
 }
 export interface InitConstrucorState {
     hasMenu: boolean;
@@ -41,8 +41,5 @@ export interface CustomConfig {
     headers?: CustomItems;
     navigation?: CustomItems;
     loadable?: LoadableConfig;
-    decorators?: {
-        block?: ((props: BlockDecorationProps) => React.ReactElement)[];
-    };
 }
 export {};

package/server/models/customization.d.ts

@@ -1,7 +1,19 @@
 import * as React from 'react';
-import { BlockBaseProps, BlockType } from './constructor-items';
-export interface BlockDecorationProps extends React.PropsWithChildren, BlockBaseProps {
-    type: BlockType | string;
+import { BlockType, ConstructorItem } from './constructor-items';
+export interface BlockWrapperDataProps<T = object> {
+    type: string;
     index?: number;
+    props?: T;
+    content?: ConstructorItem & T;
+}
+/**
+ * @deprecated Use BlockWrapperDataProps instead.
+ * BlockDecorationProps will be removed in the next major version.
+ */
+export interface BlockDecorationProps extends React.PropsWithChildren, Omit<BlockWrapperDataProps, 'type'> {
+    type: BlockType | string;
 }
+/**
+ * @deprecated Use PageConstructorExtension with blockWrapper instead.
+ */
 export type BlockDecorator = (props: BlockDecorationProps) => React.ReactElement;

package/server/models/navigation.d.ts

@@ -94,8 +94,8 @@ export interface FooterData {
     underline?: FooterUnderline;
 }
 export interface NavigationData {
-    logo: ThemedNavigationLogoData;
-    header: HeaderData;
+    logo?: ThemedNavigationLogoData;
+    header?: HeaderData;
     footer?: FooterData;
     renderNavigation?: () => React.ReactNode;
 }

package/server/utils/index.d.ts

@@ -7,5 +7,6 @@ export * from './cn';
 export * from './url';
 export * from './theme';
 export * from './icons';
+export * from './navigation';
 export type { HubspotEventData, HubspotEventHandlers, HubspotEventName } from './hubspot';
 export { isHubspotEventData } from './hubspot';

package/server/utils/index.js

@@ -24,5 +24,6 @@ __exportStar(require("./cn"), exports);
 __exportStar(require("./url"), exports);
 __exportStar(require("./theme"), exports);
 __exportStar(require("./icons"), exports);
+__exportStar(require("./navigation"), exports);
 var hubspot_1 = require("./hubspot");
 Object.defineProperty(exports, "isHubspotEventData", { enumerable: true, get: function () { return hubspot_1.isHubspotEventData; } });

package/server/utils/navigation.d.ts

@@ -0,0 +1,3 @@
+import { HeaderData, ThemedNavigationLogoData } from '../models';
+export declare function isLogoSet(logo?: ThemedNavigationLogoData): logo is ThemedNavigationLogoData;
+export declare function isHeaderSet(header?: HeaderData): header is HeaderData;

package/server/utils/navigation.js

@@ -0,0 +1,15 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isLogoSet = isLogoSet;
+exports.isHeaderSet = isHeaderSet;
+const get_1 = __importDefault(require("lodash/get"));
+const isEmpty_1 = __importDefault(require("lodash/isEmpty"));
+function isLogoSet(logo) {
+    return Boolean((0, get_1.default)(logo, 'icon') || (0, get_1.default)(logo, 'light.icon'));
+}
+function isHeaderSet(header) {
+    return !(0, isEmpty_1.default)(header === null || header === void 0 ? void 0 : header.leftItems);
+}

package/styles/mixins.scss

@@ -177,12 +177,12 @@
 
 @mixin block {
     @include add-specificity(&) {
-        margin-top: $indentL;
-        padding: 0 0 $indentL;
+        //margin-top: $indentL;
+        padding: $indentL 0;
 
         &:first-child {
             // @deprecated
-            margin-top: var(--pc-first-block-indent, #{$indentXXL});
+            //margin-top: var(--pc-first-block-indent, #{$indentXXL});
         }
     }
 }
@@ -605,27 +605,27 @@ unpredictable css rules order in build */
         @include add-specificity(&) {
             &_indentTop {
                 &_0 {
-                    margin-top: 0;
+                    padding-top: 0;
                 }
 
                 &_xs {
-                    margin-top: $indentXS;
+                    padding-top: $indentXS;
                 }
 
                 &_s {
-                    margin-top: $indentSM;
+                    padding-top: $indentSM;
                 }
 
                 &_m {
-                    margin-top: $indentM;
+                    padding-top: $indentM;
                 }
 
                 &_l {
-                    margin-top: $indentL;
+                    padding-top: $indentL;
                 }
 
                 &_xl {
-                    margin-top: $indentXL;
+                    padding-top: $indentXL;
                 }
             }
 

package/styles/styles.css

@@ -1,6 +1,6 @@
 @charset "UTF-8";
 @import '~@gravity-ui/uikit/styles/styles.css';
-@import '~@diplodoc/transform/dist/css/yfm.css';
+@import '@diplodoc/transform/dist/css/yfm.css';
 /* use this for style redefinitions to awoid problems with
 unpredictable css rules order in build */
 /* use this for style redefinitions to awoid problems with
@@ -67,14 +67,15 @@ unpredictable css rules order in build */
 }
 .yfm_constructor a {
   outline: none;
-  color: var(--g-color-text-link);
-  text-decoration: none;
-  cursor: pointer;
-  border-radius: var(--g-focus-border-radius);
 }
 .utilityfocus .yfm_constructor a:focus {
   outline: 2px solid #ffdb4d;
 }
+.yfm_constructor a {
+  color: var(--g-color-text-link);
+  text-decoration: none;
+  cursor: pointer;
+}
 .yfm_constructor a:hover, .yfm_constructor a:active {
   --pc-text-header-color: var(--g-color-text-link-hover);
   color: var(--g-color-text-link-hover);
@@ -85,6 +86,9 @@ unpredictable css rules order in build */
 .yfm_constructor a:focus:not(:focus-visible) {
   box-shadow: none;
 }
+.yfm_constructor a {
+  border-radius: var(--g-focus-border-radius);
+}
 .yfm_constructor table {
   color: var(--g-color-text-primary);
   border: 1px solid var(--g-color-line-generic);
@@ -95,9 +99,6 @@ unpredictable css rules order in build */
   background-color: var(--g-color-base-generic);
 }
 
-.yfm_constructor_table {
-  /* stylelint-enable declaration-no-important */
-}
 .yfm_constructor_table table {
   border: 0;
   table-layout: fixed;
@@ -124,4 +125,7 @@ unpredictable css rules order in build */
 }
 .yfm_constructor_table th {
   text-align: left !important;
+}
+.yfm_constructor_table {
+  /* stylelint-enable declaration-no-important */
 }

package/styles/yfm.scss

@@ -1,4 +1,4 @@
-@import '~@diplodoc/transform/dist/css/yfm.css';
+@import '@diplodoc/transform/dist/css/yfm.css';
 @import './mixins.scss';
 @import './variables.scss';
 

package/widget/1130.index.js

@@ -1 +1 @@
-(self.webpackChunk_gravity_ui_page_constructor=self.webpackChunk_gravity_ui_page_constructor||[]).push([[1130],{28749:function(a,_,r){a.exports=function(a){"use strict";function _(a){return a&&"object"==typeof a&&"default"in a?a:{default:a}}var r=_(a),t={name:"az",weekdays:"Bazar_Bazar ertəsi_Çərşənbə axşamı_Çərşənbə_Cümə axşamı_Cümə_Şənbə".split("_"),weekdaysShort:"Baz_BzE_ÇAx_Çər_CAx_Cüm_Şən".split("_"),weekdaysMin:"Bz_BE_ÇA_Çə_CA_Cü_Şə".split("_"),months:"yanvar_fevral_mart_aprel_may_iyun_iyul_avqust_sentyabr_oktyabr_noyabr_dekabr".split("_"),monthsShort:"yan_fev_mar_apr_may_iyn_iyl_avq_sen_okt_noy_dek".split("_"),weekStart:1,formats:{LT:"H:mm",LTS:"H:mm:ss",L:"DD.MM.YYYY",LL:"D MMMM YYYY г.",LLL:"D MMMM YYYY г., H:mm",LLLL:"dddd, D MMMM YYYY г., H:mm"},relativeTime:{future:"%s sonra",past:"%s əvvəl",s:"bir neçə saniyə",m:"bir dəqiqə",mm:"%d dəqiqə",h:"bir saat",hh:"%d saat",d:"bir gün",dd:"%d gün",M:"bir ay",MM:"%d ay",y:"bir il",yy:"%d il"},ordinal:function(a){return a}};return r.default.locale(t,null,!0),t}(r(74353))}}]);
+(self.webpackChunk_gravity_ui_page_constructor=self.webpackChunk_gravity_ui_page_constructor||[]).push([[1130],{51130:function(a,_,r){a.exports=function(a){"use strict";function _(a){return a&&"object"==typeof a&&"default"in a?a:{default:a}}var r=_(a),t={name:"az",weekdays:"Bazar_Bazar ertəsi_Çərşənbə axşamı_Çərşənbə_Cümə axşamı_Cümə_Şənbə".split("_"),weekdaysShort:"Baz_BzE_ÇAx_Çər_CAx_Cüm_Şən".split("_"),weekdaysMin:"Bz_BE_ÇA_Çə_CA_Cü_Şə".split("_"),months:"yanvar_fevral_mart_aprel_may_iyun_iyul_avqust_sentyabr_oktyabr_noyabr_dekabr".split("_"),monthsShort:"yan_fev_mar_apr_may_iyn_iyl_avq_sen_okt_noy_dek".split("_"),weekStart:1,formats:{LT:"H:mm",LTS:"H:mm:ss",L:"DD.MM.YYYY",LL:"D MMMM YYYY г.",LLL:"D MMMM YYYY г., H:mm",LLLL:"dddd, D MMMM YYYY г., H:mm"},relativeTime:{future:"%s sonra",past:"%s əvvəl",s:"bir neçə saniyə",m:"bir dəqiqə",mm:"%d dəqiqə",h:"bir saat",hh:"%d saat",d:"bir gün",dd:"%d gün",M:"bir ay",MM:"%d ay",y:"bir il",yy:"%d il"},ordinal:function(a){return a}};return r.default.locale(t,null,!0),t}(r(74353))}}]);

package/widget/48692712e33c3bdae70f.svg

@@ -0,0 +1,12 @@
+<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.97674" fill="white"/>
+<rect x="9.11628" y="8.5" width="10" height="2" rx="0.569767" fill="black"/>
+<rect x="20.1163" y="8.5" width="10" height="2" rx="0.569767" fill="black"/>
+<rect x="31.1163" y="8.5" width="10" height="2" rx="0.569767" fill="black"/>
+<rect x="42.1163" y="8.5" width="10" height="2" rx="0.569767" fill="black"/>
+<rect x="9.11628" y="12.5" width="52" height="29" rx="3" fill="black"/>
+<rect x="63.1163" y="12.5" width="13" height="2" rx="0.569767" fill="#262626"/>
+<rect x="63.1163" y="15.5" width="23.7674" height="2" rx="0.569767" fill="#262626"/>
+<rect x="63.1163" y="18.5" width="23.7674" height="2" rx="0.569767" fill="#262626"/>
+<rect x="63.1163" y="22.5" width="7" height="2" rx="0.569767" fill="#262626"/>
+</svg>

package/widget/59e86539ac1545c64458.svg

@@ -0,0 +1,9 @@
+<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.97674" fill="white"/>
+<rect x="9.11628" y="16.9999" width="13" height="2" rx="0.569767" fill="#262626"/>
+<rect x="9.11628" y="20.9999" width="37.3256" height="2" rx="0.569767" fill="#262626"/>
+<rect x="9.11628" y="23.9999" width="37.3256" height="2" rx="0.569767" fill="#262626"/>
+<rect x="9.11628" y="26.9999" width="37.3256" height="2" rx="0.569767" fill="#262626"/>
+<rect x="9.11628" y="30.9999" width="7" height="2" rx="0.569767" fill="#262626"/>
+<rect x="51" y="5.05811" width="39.8837" height="39.8837" rx="3" fill="#222222"/>
+</svg>

package/widget/6bd40d99d7acda70c988.svg

@@ -0,0 +1,11 @@
+<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.97674" fill="white"/>
+<rect x="9.11627" y="11.9399" width="81.7674" height="26.12" rx="3" fill="black"/>
+<rect x="13.6763" y="16.5" width="24" height="2" rx="0.569767" fill="#B0BDD9"/>
+<rect x="13.6763" y="19.5" width="41" height="2" rx="0.569767" fill="#B0BDD9"/>
+<rect x="13.6763" y="22.5" width="32" height="2" rx="0.569767" fill="#B0BDD9"/>
+<rect x="13.6763" y="26.5" width="1" height="1" rx="0.5" fill="#B0BDD9"/>
+<rect x="15.6763" y="26.5" width="20" height="1" rx="0.5" fill="#B0BDD9"/>
+<rect x="15.6763" y="28.5" width="24" height="1" rx="0.5" fill="#B0BDD9"/>
+<rect x="13.6763" y="31.5" width="7" height="2" rx="0.569767" fill="#B0BDD9"/>
+</svg>

package/widget/8eee8263ebe9e3a9a5ec.svg

@@ -0,0 +1,16 @@
+<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.97674" fill="white"/>
+<rect x="9.11627" y="14.5" width="51" height="5" rx="0.569767" fill="#222222"/>
+<rect x="9.11627" y="21.5" width="4" height="4" rx="2" fill="#C0C8DB"/>
+<rect x="9.11627" y="26.5" width="21" height="3" rx="0.569767" fill="#222222"/>
+<rect x="9.11627" y="30.5" width="25.9225" height="2" rx="0.569767" fill="#222222"/>
+<rect x="9.11627" y="33.5" width="16" height="2" rx="0.569767" fill="#222222"/>
+<rect x="37.0388" y="21.5" width="4" height="4" rx="2" fill="#C0C8DB"/>
+<rect x="37.0388" y="26.5" width="14" height="3" rx="0.569767" fill="#222222"/>
+<rect x="37.0388" y="30.5" width="25.9225" height="2" rx="0.569767" fill="#222222"/>
+<rect x="37.0388" y="33.5" width="20" height="2" rx="0.569767" fill="#222222"/>
+<rect x="64.9612" y="21.5" width="4" height="4" rx="2" fill="#C0C8DB"/>
+<rect x="64.9612" y="26.5" width="25" height="3" rx="0.569767" fill="#222222"/>
+<rect x="64.9612" y="30.5" width="25.9225" height="2" rx="0.569767" fill="#222222"/>
+<rect x="64.9612" y="33.5" width="8" height="2" rx="0.569767" fill="#222222"/>
+</svg>

package/widget/b4759683d7f3c55b222d.svg

@@ -0,0 +1,15 @@
+<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.97674" fill="white"/>
+<rect x="9.11628" y="13" width="19" height="2" rx="0.569767" fill="#262626"/>
+<rect x="9.11628" y="17" width="13" height="2" rx="0.569767" fill="#262626"/>
+<rect x="36.1163" y="13" width="50" height="2" rx="0.569767" fill="#262626"/>
+<rect x="88.8837" y="13" width="2" height="2" rx="0.569767" fill="#262626"/>
+<rect x="36.1163" y="17" width="39" height="2" rx="0.569767" fill="#262626"/>
+<rect x="88.8837" y="17" width="2" height="2" rx="0.569767" fill="#262626"/>
+<rect x="36.1163" y="21" width="44" height="2" rx="0.569767" fill="#262626"/>
+<rect x="88.8837" y="21" width="2" height="2" rx="0.569767" fill="#262626"/>
+<rect x="36.1163" y="25" width="32" height="2" rx="0.569767" fill="#262626"/>
+<rect x="88.8837" y="25" width="2" height="2" rx="0.569767" fill="#262626"/>
+<rect x="36.1163" y="29" width="36" height="2" rx="0.569767" fill="#262626"/>
+<rect x="88.8837" y="29" width="2" height="2" rx="0.569767" fill="#262626"/>
+</svg>

package/widget/d0f61f0a190743ed85bf.svg

@@ -0,0 +1,7 @@
+<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.81395" fill="white"/>
+<rect x="37" y="10.2906" width="26" height="29.4186" rx="3.34884" fill="#C0C8DB"/>
+<rect x="37" y="10.2906" width="26" height="14.5116" rx="3.34884" fill="#262626"/>
+<rect x="40.3488" y="28.593" width="19.3023" height="2" rx="0.55814" fill="#262626"/>
+<rect x="40.3488" y="31.7094" width="9" height="2" rx="0.55814" fill="#262626"/>
+</svg>

package/widget/dd2cee88264c25f71647.svg

@@ -0,0 +1,14 @@
+<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.81395" fill="white"/>
+<rect x="8.93024" y="12" width="82.1395" height="26" rx="3.34884" fill="#C0C8DB"/>
+<rect x="9.20931" y="12.2791" width="81.5814" height="25.4419" rx="3.06977" fill="#222222"/>
+<rect x="9.20931" y="12.2791" width="81.5814" height="25.4419" rx="3.06977" stroke="#C0C8DB" stroke-width="0.55814"/>
+<rect x="12" y="18" width="23" height="2" rx="0.55814" fill="#C0C8DB"/>
+<rect x="12" y="22" width="7" height="2" rx="0.55814" fill="#C0C8DB"/>
+<rect x="20" y="22" width="7" height="2" rx="0.55814" fill="#C0C8DB"/>
+<rect x="48" y="18" width="27" height="2" rx="0.55814" fill="#C0C8DB"/>
+<rect x="48" y="22" width="12" height="1" rx="0.5" fill="#C0C8DB"/>
+<rect x="48" y="24" width="14" height="1" rx="0.5" fill="#C0C8DB"/>
+<rect x="48" y="26" width="15" height="1" rx="0.5" fill="#C0C8DB"/>
+<rect x="48" y="28" width="8" height="1" rx="0.5" fill="#C0C8DB"/>
+</svg>

package/widget/e0148e2f56361cf735a0.svg

@@ -0,0 +1,9 @@
+<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.97674" fill="white"/>
+<rect x="9.11627" y="10.7559" width="81.7674" height="28.4884" rx="3" fill="#262626"/>
+<rect x="13.6744" y="19" width="13" height="2" rx="0.569767" fill="#C0C8DB"/>
+<rect x="13.6744" y="22" width="31.7674" height="2" rx="0.569767" fill="#C0C8DB"/>
+<rect x="13.6744" y="25" width="31.7674" height="2" rx="0.569767" fill="#C0C8DB"/>
+<rect x="13.6744" y="29" width="7" height="2" rx="0.569767" fill="#C0C8DB"/>
+<rect x="50.6" y="11.3559" width="39.6837" height="27.2884" rx="2.8186" fill="#C0C8DB" stroke="#262626" stroke-width="1.2"/>
+</svg>

package/widget/e939f84b0589c88eda82.svg

@@ -0,0 +1,9 @@
+<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.81395" fill="white"/>
+<rect x="8.93023" y="14.3024" width="82.1395" height="21.3953" rx="3" fill="#262626"/>
+<rect x="13.4884" y="18.8605" width="20" height="2" rx="0.569767" fill="#C0C8DB"/>
+<rect x="13.4884" y="21.8605" width="28" height="2" rx="0.569767" fill="#C0C8DB"/>
+<rect x="13.4884" y="25.8605" width="7" height="2" rx="0.569767" fill="#C0C8DB"/>
+<rect x="53.2047" y="14.9024" width="37.2651" height="20.1953" rx="2.4" fill="#C0C8DB"/>
+<rect x="53.2047" y="14.9024" width="37.2651" height="20.1953" rx="2.4" stroke="#262626" stroke-width="1.2"/>
+</svg>

package/widget/f077b7db51dd159290d7.svg

@@ -0,0 +1,15 @@
+<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.81395" fill="white"/>
+<rect x="8.93024" y="10.2906" width="25.8915" height="29.4186" rx="3.34884" fill="#C0C8DB"/>
+<rect x="8.93024" y="10.2906" width="25.8915" height="14.5116" rx="3.34884" fill="#262626"/>
+<rect x="12.2791" y="28.593" width="19.1938" height="2" rx="0.55814" fill="#262626"/>
+<rect x="12.2791" y="31.7094" width="9" height="2" rx="0.55814" fill="#262626"/>
+<rect x="37.0543" y="10.2906" width="25.8915" height="29.4186" rx="3.34884" fill="#C0C8DB"/>
+<rect x="37.0543" y="10.2906" width="25.8915" height="14.5116" rx="3.34884" fill="#262626"/>
+<rect x="40.4031" y="28.593" width="19.1938" height="2" rx="0.55814" fill="#262626"/>
+<rect x="40.4031" y="31.7094" width="10" height="2" rx="0.55814" fill="#262626"/>
+<rect x="65.1783" y="10.2906" width="25.8915" height="29.4186" rx="3.34884" fill="#C0C8DB"/>
+<rect x="65.1783" y="10.2906" width="25.8915" height="14.5116" rx="3.34884" fill="#262626"/>
+<rect x="68.5271" y="28.593" width="19.1938" height="2" rx="0.55814" fill="#262626"/>
+<rect x="68.5271" y="31.7094" width="9" height="2" rx="0.55814" fill="#262626"/>
+</svg>

package/widget/f8de93d922c0adc378bb.svg

@@ -0,0 +1,51 @@
+<svg width="100" height="50" viewBox="0 0 100 50" fill="none" xmlns="http://www.w3.org/2000/svg">
+<rect width="100" height="50" rx="7.81395" fill="white"/>
+<g filter="url(#filter0_dd_2013_12945)">
+<rect x="8.93024" y="23" width="4" height="4" rx="2" fill="#B0BDD9"/>
+</g>
+<rect x="15.1628" y="10.2906" width="21.845" height="29.4186" rx="3.34884" fill="#C0C8DB"/>
+<rect x="15.1628" y="10.2906" width="21.845" height="14.5116" rx="3.34884" fill="#262626"/>
+<rect x="18.5116" y="28.593" width="15.1473" height="2" rx="0.55814" fill="#262626"/>
+<rect x="18.5116" y="31.7094" width="9" height="2" rx="0.55814" fill="#262626"/>
+<rect x="39.2403" y="10.2906" width="21.845" height="29.4186" rx="3.34884" fill="#C0C8DB"/>
+<rect x="39.2403" y="10.2906" width="21.845" height="14.5116" rx="3.34884" fill="#262626"/>
+<rect x="42.5892" y="28.593" width="15.1473" height="2" rx="0.55814" fill="#262626"/>
+<rect x="42.5892" y="31.7094" width="10" height="2" rx="0.55814" fill="#262626"/>
+<rect x="63.3178" y="10.2906" width="21.845" height="29.4186" rx="3.34884" fill="#C0C8DB"/>
+<rect x="63.3178" y="10.2906" width="21.845" height="14.5116" rx="3.34884" fill="#262626"/>
+<rect x="66.6667" y="28.593" width="15.1473" height="2" rx="0.55814" fill="#262626"/>
+<rect x="66.6667" y="31.7094" width="9" height="2" rx="0.55814" fill="#262626"/>
+<g filter="url(#filter1_dd_2013_12945)">
+<rect x="87.3954" y="23" width="4" height="4" rx="2" fill="#B0BDD9"/>
+</g>
+<defs>
+<filter id="filter0_dd_2013_12945" x="2.23256" y="17.4186" width="17.3953" height="17.3953" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<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"/>
+<feOffset dy="0.55814"/>
+<feGaussianBlur stdDeviation="1.11628"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_2013_12945"/>
+<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"/>
+<feOffset dy="1.11628"/>
+<feGaussianBlur stdDeviation="3.34884"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0"/>
+<feBlend mode="normal" in2="effect1_dropShadow_2013_12945" result="effect2_dropShadow_2013_12945"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_2013_12945" result="shape"/>
+</filter>
+<filter id="filter1_dd_2013_12945" x="80.6977" y="17.4186" width="17.3953" height="17.3953" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+<feFlood flood-opacity="0" result="BackgroundImageFix"/>
+<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"/>
+<feOffset dy="0.55814"/>
+<feGaussianBlur stdDeviation="1.11628"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0"/>
+<feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_2013_12945"/>
+<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"/>
+<feOffset dy="1.11628"/>
+<feGaussianBlur stdDeviation="3.34884"/>
+<feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.06 0"/>
+<feBlend mode="normal" in2="effect1_dropShadow_2013_12945" result="effect2_dropShadow_2013_12945"/>
+<feBlend mode="normal" in="SourceGraphic" in2="effect2_dropShadow_2013_12945" result="shape"/>
+</filter>
+</defs>
+</svg>