@burger-editor/blocks 4.0.0-alpha.14 → 4.0.0-alpha.16

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.
Files changed (3) hide show
  1. package/README.md +1 -1
  2. package/dist/index.js +14 -14
  3. package/package.json +6 -6
package/README.md CHANGED
@@ -85,7 +85,7 @@
85
85
 
86
86
  ##### 共通オプション
87
87
 
88
- - `immutable`: コンテナのタイプやオプションを変更できない
88
+ - `immutable`: アイテムの増減ができなくなります。また、タイプが`grid`の場合は列数の変更ができなくなります。
89
89
 
90
90
  #### コンテナフレーム
91
91
 
package/dist/index.js CHANGED
@@ -12,7 +12,7 @@ var style$a = "/* No Styling */\n";
12
12
  var template$C = "<a href=\"\" data-bgi-button-kind=\"link\" data-bge=\"link:href, target:target, kind:data-bgi-button-kind\">\n\t<div>\n\t\t<span data-bge=\"text\">ボタン</span>\n\t</div>\n</a>\n";
13
13
 
14
14
  var button = createItem({
15
- version: "4.0.0-alpha.13",
15
+ version: "4.0.0-alpha.15",
16
16
  name: "button",
17
17
  template: template$C,
18
18
  style: style$a,
@@ -26,7 +26,7 @@ var style$9 = "/* No Styling */\n";
26
26
  var template$B = "<details data-bge=\"open:open\">\n\t<summary data-bge=\"summary\">折りたたみコンテンツ</summary>\n\t<div data-bge=\"content\"><p>内容を入力してください</p></div>\n</details>\n";
27
27
 
28
28
  var details = createItem({
29
- version: "4.0.0-alpha.13",
29
+ version: "4.0.0-alpha.15",
30
30
  name: "details",
31
31
  template: template$B,
32
32
  style: style$9,
@@ -40,7 +40,7 @@ var style$8 = "[data-bgi='download-file'] {\n\t[data-bge*='size'] {\n\t\t&::befo
40
40
  var template$A = "<a href=\"./files/bgeditor/bg-sample.pdf\" target=\"_blank\" data-bge=\"path:href, download:download\">\n\t<div>\n\t\t<span data-bge=\"name\">サンプルダウンロードファイル</span>\n\t\t<span data-bge=\"formated-size, size:data-size\" data-size=\"138158\">134.92kB</span>\n\t</div>\n</a>\n";
41
41
 
42
42
  var downloadFile = createItem({
43
- version: "4.0.0-alpha.13",
43
+ version: "4.0.0-alpha.15",
44
44
  name: "download-file",
45
45
  template: template$A,
46
46
  style: style$8,
@@ -79,7 +79,7 @@ var style$7 = "[data-bgi='google-maps'] {\n\tdiv {\n\t\tinline-size: 100%;\n\t\t
79
79
  var template$z = "<div data-lat=\"35.681382\" data-lng=\"139.766084\" data-zoom=\"16\" data-bge=\"lat:data-lat, lng:data-lng, zoom:data-zoom\">\n\t<img data-bge=\"img:src\" src=\"https://maps.google.com/maps/api/staticmap?center=35.681382,139.766084&amp;zoom=16&amp;size=640x400&amp;markers=color:red|color:red|35.681382,139.766084&amp;scale=2&amp;key=%googleMapsApiKey%\" width=\"8\" height=\"5\" alt=\"Google Maps\" />\n</div>\n<a href=\"https://maps.apple.com/?q=35.681382,139.766084\" data-bge=\"url:href\" target=\"_blank\"><span>アプリで開く</span></a>\n";
80
80
 
81
81
  var googleMaps = createItem({
82
- version: "4.0.0-alpha.13",
82
+ version: "4.0.0-alpha.15",
83
83
  name: "google-maps",
84
84
  template: template$z,
85
85
  style: style$7,
@@ -214,7 +214,7 @@ var style$6 = "[data-bgi='hr'] {\n\t--inline-size: 100%;\n\t--border-color: #000
214
214
  var template$y = "<div data-bgi-hr-kind=\"primary\" data-bge=\"kind:data-bgi-hr-kind\">\n\t<hr />\n</div>\n";
215
215
 
216
216
  var hr = createItem({
217
- version: "4.0.0-alpha.13",
217
+ version: "4.0.0-alpha.15",
218
218
  name: "hr",
219
219
  template: template$y,
220
220
  style: style$6,
@@ -229,7 +229,7 @@ var template$x = "<div data-bge=\":style, :scale, :scale-type, :aspect-ratio\" d
229
229
 
230
230
  const ORIGIN = "__org";
231
231
  var image = createItem({
232
- version: "4.0.0-alpha.13",
232
+ version: "4.0.0-alpha.15",
233
233
  name: "image",
234
234
  template: template$x,
235
235
  style: style$5,
@@ -395,7 +395,7 @@ var style$4 = "/* No Styling */\n";
395
395
  var template$w = "<table>\n\t<caption data-bge=\"caption\">\n\t\tキャプションを入力してください\n\t</caption>\n\t<tbody data-bge-list>\n\t\t<tr>\n\t\t\t<th data-bge=\"th\">表組の見出し</th>\n\t\t\t<td data-bge=\"td\">表組の内容を入力してください</td>\n\t\t</tr>\n\t</tbody>\n</table>\n";
396
396
 
397
397
  var table = createItem({
398
- version: "4.0.0-alpha.13",
398
+ version: "4.0.0-alpha.15",
399
399
  name: "table",
400
400
  template: template$w,
401
401
  style: style$4,
@@ -423,7 +423,7 @@ var style$3 = "/* No Styling */\n";
423
423
  var template$v = "<h2 data-bge=\"title-h2\">見出しを入力してください</h2>\n";
424
424
 
425
425
  var titleH2 = createItem({
426
- version: "4.0.0-alpha.13",
426
+ version: "4.0.0-alpha.15",
427
427
  name: "title-h2",
428
428
  template: template$v,
429
429
  style: style$3,
@@ -437,7 +437,7 @@ var style$2 = "/* No Styling */\n";
437
437
  var template$u = "<h3 data-bge=\"title-h3\">見出しを入力してください</h3>\n";
438
438
 
439
439
  var titleH3 = createItem({
440
- version: "4.0.0-alpha.13",
440
+ version: "4.0.0-alpha.15",
441
441
  name: "title-h3",
442
442
  template: template$u,
443
443
  style: style$2,
@@ -451,7 +451,7 @@ var style$1 = "/* No Styling */\n";
451
451
  var template$t = "<div data-bge=\"wysiwyg\"><p>本文を入力してください</p></div>\n";
452
452
 
453
453
  var wysiwyg = createItem({
454
- version: "4.0.0-alpha.13",
454
+ version: "4.0.0-alpha.15",
455
455
  name: "wysiwyg",
456
456
  template: template$t,
457
457
  style: style$1,
@@ -466,7 +466,7 @@ var template$s = "<div data-id=\"3KtWfp0UopM\" data-title=\"YouTube動画\" data
466
466
 
467
467
  const FALLBACK_TITLE = "YouTube\u52D5\u753B";
468
468
  var youtube = createItem({
469
- version: "4.0.0-alpha.13",
469
+ version: "4.0.0-alpha.15",
470
470
  name: "youtube",
471
471
  template: template$s,
472
472
  style,
@@ -742,7 +742,7 @@ const blockTemplate$7 = {
742
742
 
743
743
  var icon$6 = "<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"17.85mm\" height=\"13.84mm\" viewBox=\"0 0 50.59 39.23\"><defs><linearGradient id=\"ade87fa9-ae19-4174-a9df-549149c22c3a\" x1=\"25.3\" y1=\"44.66\" x2=\"25.3\" y2=\"-18.72\" gradientUnits=\"userSpaceOnUse\"><stop offset=\"0\" stop-color=\"#fbe4ac\"/><stop offset=\"1\" stop-color=\"#f9d483\"/></linearGradient></defs><title>text-image1</title><g id=\"b5a6612f-092f-46f9-bede-5f7d0c0017e2\" data-name=\"レイヤー 2\"><g id=\"bea1505f-d2e3-463f-9f09-789633cf796a\" data-name=\"レイヤー1\"><rect y=\"1.73\" width=\"50.59\" height=\"37.5\" rx=\"5.06\" fill=\"#f8d077\"/><rect width=\"50.59\" height=\"37.5\" rx=\"5.06\" fill=\"url(#ade87fa9-ae19-4174-a9df-549149c22c3a)\"/><line x1=\"10.72\" y1=\"10.89\" x2=\"24.87\" y2=\"10.89\" fill=\"none\" stroke=\"#f5b717\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\"/><line x1=\"10.72\" y1=\"16.69\" x2=\"24.87\" y2=\"16.69\" fill=\"none\" stroke=\"#f5b717\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\"/><line x1=\"10.72\" y1=\"22.5\" x2=\"24.87\" y2=\"22.5\" fill=\"none\" stroke=\"#f5b717\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\"/><line x1=\"10.72\" y1=\"28.3\" x2=\"24.87\" y2=\"28.3\" fill=\"none\" stroke=\"#f5b717\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\"/><rect x=\"28.33\" y=\"9.83\" width=\"11.54\" height=\"10.62\" fill=\"#f49e16\"/><polygon points=\"39.87 20.44 28.33 20.44 39.87 9.83 39.87 20.44\" fill=\"#ef7c1b\"/></g></g></svg>";
744
744
 
745
- var template$6 = "<div data-bge-container=\"inline:nowrap:immutable\">\n\t<div data-bge-container-frame>\n\t\t<div data-bge-item><!-- wysiwyg --></div>\n\t\t<div data-bge-item><!-- image --></div>\n\t</div>\n</div>\n";
745
+ var template$6 = "<div data-bge-container=\"inline:nowrap:immutable\">\n\t<div data-bge-container-frame>\n\t\t<div data-bge-item><!-- wysiwyg --></div>\n\t\t<div data-bge-item><!-- image{\"scale\":50,\"cssWidth\":\"50cqi\",\"style\":\"--css-width:50cqi;--object-fit:cover;--aspect-ratio:unset\"} --></div>\n\t</div>\n</div>\n";
746
746
 
747
747
  const blockTemplate$6 = {
748
748
  name: "text-image1",
@@ -752,7 +752,7 @@ const blockTemplate$6 = {
752
752
 
753
753
  var icon$5 = "<svg xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" width=\"17.85mm\" height=\"13.84mm\" viewBox=\"0 0 50.59 39.23\"><defs><linearGradient id=\"b45c0119-d5be-43a7-860b-ff99ff6b339a\" x1=\"25.3\" y1=\"44.66\" x2=\"25.3\" y2=\"-18.72\" gradientUnits=\"userSpaceOnUse\"><stop offset=\"0\" stop-color=\"#fbe4ac\"/><stop offset=\"1\" stop-color=\"#f9d483\"/></linearGradient></defs><title>text-image2</title><g id=\"b8a07add-b6a7-443b-a099-cbae3fef9912\" data-name=\"レイヤー 2\"><g id=\"e0a06289-c432-465b-8182-049212ef7ffa\" data-name=\"レイヤー1\"><rect y=\"1.73\" width=\"50.59\" height=\"37.5\" rx=\"5.06\" fill=\"#f8d077\"/><rect width=\"50.59\" height=\"37.5\" rx=\"5.06\" fill=\"url(#b45c0119-d5be-43a7-860b-ff99ff6b339a)\"/><line x1=\"40.29\" y1=\"10.6\" x2=\"26.15\" y2=\"10.6\" fill=\"none\" stroke=\"#f5b717\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\"/><line x1=\"40.29\" y1=\"16.41\" x2=\"26.15\" y2=\"16.41\" fill=\"none\" stroke=\"#f5b717\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\"/><line x1=\"40.29\" y1=\"22.21\" x2=\"26.15\" y2=\"22.21\" fill=\"none\" stroke=\"#f5b717\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\"/><line x1=\"40.29\" y1=\"28.02\" x2=\"26.15\" y2=\"28.02\" fill=\"none\" stroke=\"#f5b717\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\"/><rect x=\"11.15\" y=\"9.83\" width=\"11.54\" height=\"10.62\" fill=\"#f49e16\"/><polygon points=\"22.69 20.44 11.15 20.44 22.69 9.83 22.69 20.44\" fill=\"#ef7c1b\"/></g></g></svg>";
754
754
 
755
- var template$5 = "<div data-bge-container=\"inline:nowrap:immutable\">\n\t<div data-bge-container-frame>\n\t\t<div data-bge-item><!-- image --></div>\n\t\t<div data-bge-item><!-- wysiwyg --></div>\n\t</div>\n</div>\n";
755
+ var template$5 = "<div data-bge-container=\"inline:nowrap:immutable\">\n\t<div data-bge-container-frame>\n\t\t<div data-bge-item><!-- image{\"scale\":50,\"cssWidth\":\"50cqi\",\"style\":\"--css-width:50cqi;--object-fit:cover;--aspect-ratio:unset\"} --></div>\n\t\t<div data-bge-item><!-- wysiwyg --></div>\n\t</div>\n</div>\n";
756
756
 
757
757
  const blockTemplate$5 = {
758
758
  name: "text-image2",
@@ -841,6 +841,6 @@ const blocks = {
841
841
  disclosure: blockTemplate$o
842
842
  };
843
843
 
844
- var general = ":root {\n\t--bge-auto-fit-base-width: 40em;\n\n\t/* Custom width */\n\t--bge-options-width--normal: calc(800 / 16 * 1rem);\n\t--bge-options-width--small: calc(400 / 16 * 1rem);\n\t--bge-options-width--medium: calc(600 / 16 * 1rem);\n\t--bge-options-width--large: calc(1200 / 16 * 1rem);\n\t--bge-options-width--full: 100dvi;\n\t--bge-options-width: var(--bge-options-width--normal);\n\n\t/* Custom margin */\n\t--bge-options-margin--normal: 3rem;\n\t--bge-options-margin--none: 0;\n\t--bge-options-margin--small: 1rem;\n\t--bge-options-margin--large: 8rem;\n\t--bge-options-margin: var(--bge-options-margin--normal);\n\n\t/* Custom background color */\n\t--bge-options-bgcolor--transparent: transparent;\n\t--bge-options-bgcolor--white: #fff;\n\t--bge-options-bgcolor--gray: #dfdfdf;\n\t--bge-options-bgcolor--blue: #eaf3f8;\n\t--bge-options-bgcolor--red: #fcc;\n\t--bge-options-bgcolor: var(--bge-options-bgcolor--transparent);\n\n\t/* Custom border style */\n\t--bge-options-border--none: none;\n\t--bge-options-border--solid: solid 1px currentColor;\n\t--bge-options-border--dashed: dashed 1px currentColor;\n\t--bge-options-border--dotted: dotted 1px currentColor;\n\t--bge-options-border--wide: solid 3px currentColor;\n\t--bge-options-border: var(--bge-options-border--none);\n\n\t/* Custom padding-block */\n\t--bge-options-padding-block--none: 0;\n\t--bge-options-padding-block--small: 1rem;\n\t--bge-options-padding-block--middle: 3rem;\n\t--bge-options-padding-block--large: 5rem;\n\t--bge-options-padding-block: var(--bge-options-padding-block--none);\n\n\t/* Custom padding-inline */\n\t--bge-options-padding-inline--default-gutter: 2rem;\n\t--bge-options-padding-inline--none: 0;\n\t--bge-options-padding-inline--small: 1rem;\n\t--bge-options-padding-inline--middle: 3rem;\n\t--bge-options-padding-inline--large: 5rem;\n\t--bge-options-padding-inline: var(--bge-options-padding-inline--default-gutter);\n\n\t/* Custom gap */\n\t--bge-options-gap--normal: 1rem;\n\t--bge-options-gap--small: 0.5rem;\n\t--bge-options-gap--large: 2rem;\n\t--bge-options-gap: var(--bge-options-gap--normal);\n}\n\n:where([data-bge-container]) {\n\t--bge-container-margin-block-end: var(--bge-options-margin);\n\tinline-size: 100%;\n\tmax-inline-size: var(--bge-options-width);\n\tmargin-block-end: var(--bge-container-margin-block-end);\n\tmargin-inline: auto;\n\tcontainer-name: bge-container;\n\tcontainer-type: inline-size;\n\n\t&:where(:last-child) {\n\t\t--bge-last-container-margin-block-end: 0;\n\t\t--bge-container-margin-block-end: var(--bge-last-container-margin-block-end);\n\t}\n}\n\n:where([data-bge-container-frame]) {\n\t--bge-container-background-color: var(--bge-options-bgcolor);\n\t--bge-container-border: var(--bge-options-border);\n\t--bge-container-padding-block: var(--bge-options-padding-block);\n\t--bge-container-padding-inline: var(--bge-options-padding-inline);\n\tinline-size: 100%;\n\tpadding-block: var(--bge-container-padding-block);\n\tpadding-inline: var(--bge-container-padding-inline);\n\tbackground-color: var(--bge-container-background-color);\n\tborder: var(--bge-container-border);\n}\n\n:where([data-bge-container='grid'], [data-bge-container^='grid:']) {\n\t&:where([data-bge-container$=':2'], [data-bge-container*=':2:'])\n\t\t:where([data-bge-container-frame]) {\n\t\t--bge-grid-col: 2;\n\t}\n\n\t&:where([data-bge-container$=':3'], [data-bge-container*=':3:'])\n\t\t:where([data-bge-container-frame]) {\n\t\t--bge-grid-col: 3;\n\t}\n\n\t&:where([data-bge-container$=':4'], [data-bge-container*=':4:'])\n\t\t:where([data-bge-container-frame]) {\n\t\t--bge-grid-col: 4;\n\t}\n\n\t&:where([data-bge-container$=':5'], [data-bge-container*=':5:'])\n\t\t:where([data-bge-container-frame]) {\n\t\t--bge-grid-col: 5;\n\t}\n\n\t:where([data-bge-container-frame]) {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: repeat(var(--bge-grid-col, 1), minmax(0, 1fr));\n\t\tgap: var(--bge-options-gap);\n\n\t\t&:is([data-bge-container*=':auto-fit:'] *) {\n\t\t\tgrid-template-columns: repeat(\n\t\t\t\tauto-fit,\n\t\t\t\tminmax(calc(var(--bge-auto-fit-base-width) / var(--bge-grid-col, 1)), 1fr)\n\t\t\t);\n\t\t}\n\t}\n\n\t:where([data-bge-group]) {\n\t\t--item-count: 1;\n\t\tdisplay: grid;\n\t\tgrid-template-rows: subgrid;\n\t\tgrid-row: span var(--item-count);\n\n\t\t/* Subgrid hack 2 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(2):last-child) {\n\t\t\t--item-count: 2;\n\t\t}\n\n\t\t/* Subgrid hack 3 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(3):last-child) {\n\t\t\t--item-count: 3;\n\t\t}\n\n\t\t/* Subgrid hack 4 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(4):last-child) {\n\t\t\t--item-count: 4;\n\t\t}\n\n\t\t/* Subgrid hack 5 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(5):last-child) {\n\t\t\t--item-count: 5;\n\t\t}\n\n\t\t/* Subgrid hack 6 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(6):last-child) {\n\t\t\t--item-count: 6;\n\t\t}\n\n\t\t/* Subgrid hack 7 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(7):last-child) {\n\t\t\t--item-count: 7;\n\t\t}\n\n\t\t/* Subgrid hack 8 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(8):last-child) {\n\t\t\t--item-count: 8;\n\t\t}\n\t}\n\n\t:where([data-bge-item]) {\n\t\talign-self: self-start;\n\t\tcontainer-name: bge-item;\n\t\tcontainer-type: inline-size;\n\t}\n}\n\n:where([data-bge-container='inline'], [data-bge-container^='inline:']) {\n\t:where([data-bge-container-frame]) {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\tgap: var(--bge-options-gap);\n\t\talign-items: stretch;\n\t\tjustify-content: center;\n\n\t\t&:where(:is([data-bge-container$=':center'], [data-bge-container*=':center:']) *) {\n\t\t\tjustify-content: center;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':start'], [data-bge-container*=':start:']) *) {\n\t\t\tjustify-content: start;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':end'], [data-bge-container*=':end:']) *) {\n\t\t\tjustify-content: end;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':between'], [data-bge-container*=':between:']) *) {\n\t\t\tjustify-content: space-between;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':around'], [data-bge-container*=':around:']) *) {\n\t\t\tjustify-content: space-around;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':evenly'], [data-bge-container*=':evenly:']) *) {\n\t\t\tjustify-content: space-evenly;\n\t\t}\n\n\t\t&:where(\n\t\t\t:is([data-bge-container$=':align-center'], [data-bge-container*=':align-center:']) *\n\t\t) {\n\t\t\talign-items: center;\n\t\t}\n\n\t\t&:where(\n\t\t\t:is([data-bge-container$=':align-start'], [data-bge-container*=':align-start:']) *\n\t\t) {\n\t\t\talign-items: start;\n\t\t}\n\n\t\t&:where(\n\t\t\t:is([data-bge-container$=':align-end'], [data-bge-container*=':align-end:']) *\n\t\t) {\n\t\t\talign-items: end;\n\t\t}\n\n\t\t&:where(\n\t\t\t:is([data-bge-container$=':align-stretch'], [data-bge-container*=':align-stretch:'])\n\t\t\t\t*\n\t\t) {\n\t\t\talign-items: stretch;\n\t\t}\n\n\t\t&:where(\n\t\t\t:is(\n\t\t\t\t\t[data-bge-container$=':align-baseline'],\n\t\t\t\t\t[data-bge-container*=':align-baseline:']\n\t\t\t\t)\n\t\t\t\t*\n\t\t) {\n\t\t\t--align: baseline;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':wrap'], [data-bge-container*=':wrap:']) *) {\n\t\t\tflex-wrap: wrap;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':nowrap'], [data-bge-container*=':nowrap:']) *) {\n\t\t\tflex-wrap: nowrap;\n\t\t}\n\t}\n\n\t&:where([data-bge-container$=':immutable'], [data-bge-container*=':immutable:'])\n\t\t:where([data-bge-container-frame]) {\n\t\t& > * {\n\t\t\tflex: 1 1 auto;\n\t\t}\n\t}\n}\n\n:where([data-bge-container='float'], [data-bge-container^='float:']) {\n\t--bge-grid-float: none;\n\t--margin-inline: 0;\n\n\t&:where([data-bge-container$=':start'], [data-bge-container*=':start:']) {\n\t\t--bge-grid-float: inline-start;\n\t\t--margin-inline: 0 var(--bge-options-gap);\n\t}\n\n\t&:where([data-bge-container$=':end'], [data-bge-container*=':end:']) {\n\t\t--bge-grid-float: inline-end;\n\t\t--margin-inline: var(--bge-options-gap) 0;\n\t}\n\n\t:where([data-bge-container-frame]) {\n\t\t&::after {\n\t\t\tclear: both;\n\t\t\tdisplay: block;\n\t\t\tcontent: '';\n\t\t}\n\n\t\t& > :where(:first-child) {\n\t\t\tfloat: var(--bge-grid-float, none);\n\t\t\tinline-size: fit-content;\n\t\t\tmargin-inline: var(--margin-inline);\n\t\t}\n\t}\n}\n";
844
+ var general = ":root {\n\t--bge-auto-fit-base-width: calc(800 / 16 * 1rem);\n\n\t/* Custom max-width */\n\t--bge-options-max-width--normal: calc(800 / 16 * 1rem);\n\t--bge-options-max-width--small: calc(400 / 16 * 1rem);\n\t--bge-options-max-width--medium: calc(600 / 16 * 1rem);\n\t--bge-options-max-width--large: calc(1200 / 16 * 1rem);\n\t--bge-options-max-width--full: 100dvi;\n\t--bge-options-max-width: var(--bge-options-max-width--normal);\n\n\t/* Custom margin */\n\t--bge-options-margin--normal: 3rem;\n\t--bge-options-margin--none: 0;\n\t--bge-options-margin--small: 1rem;\n\t--bge-options-margin--large: 8rem;\n\t--bge-options-margin: var(--bge-options-margin--normal);\n\n\t/* Custom background color */\n\t--bge-options-bg-color--transparent: transparent;\n\t--bge-options-bg-color--white: #fff;\n\t--bge-options-bg-color--gray: #dfdfdf;\n\t--bge-options-bg-color--blue: #eaf3f8;\n\t--bge-options-bg-color--red: #fcc;\n\t--bge-options-bg-color: var(--bge-options-bg-color--transparent);\n\n\t/* Custom padding-block */\n\t--bge-options-padding-block--none: 0;\n\t--bge-options-padding-block--small: 1rem;\n\t--bge-options-padding-block--middle: 3rem;\n\t--bge-options-padding-block--large: 5rem;\n\t--bge-options-padding-block: var(--bge-options-padding-block--none);\n\n\t/* Custom padding-inline */\n\t--bge-options-padding-inline--default-gutter: 2rem;\n\t--bge-options-padding-inline--none: 0;\n\t--bge-options-padding-inline--small: 1rem;\n\t--bge-options-padding-inline--middle: 3rem;\n\t--bge-options-padding-inline--large: 5rem;\n\t--bge-options-padding-inline: var(--bge-options-padding-inline--default-gutter);\n\n\t/* Custom gap */\n\t--bge-options-gap--normal: 1rem;\n\t--bge-options-gap--small: 0.5rem;\n\t--bge-options-gap--large: 2rem;\n\t--bge-options-gap: var(--bge-options-gap--normal);\n}\n\n:where([data-bge-container]) {\n\t--bge-container-margin-block-end: var(--bge-options-margin);\n\t--bge-container-background-color: var(--bge-options-bg-color);\n\t--bge-container-border: var(--bge-options-border);\n\t--bge-container-padding-block: var(--bge-options-padding-block);\n\t--bge-container-padding-inline: var(--bge-options-padding-inline);\n\tinline-size: 100%;\n\tmax-inline-size: var(--bge-options-max-width);\n\tpadding-block: var(--bge-container-padding-block);\n\tpadding-inline: var(--bge-container-padding-inline);\n\tmargin-block-end: var(--bge-container-margin-block-end);\n\tmargin-inline: auto;\n\tcontainer-name: bge-container;\n\tcontainer-type: inline-size;\n\tbackground-color: var(--bge-container-background-color);\n\tborder: var(--bge-container-border);\n\n\t&:where(:last-child) {\n\t\t--bge-last-container-margin-block-end: 0;\n\t\t--bge-container-margin-block-end: var(--bge-last-container-margin-block-end);\n\t}\n}\n\n:where([data-bge-container-frame]) {\n\tinline-size: 100%;\n}\n\n:where([data-bge-container='grid'], [data-bge-container^='grid:']) {\n\t&:where([data-bge-container$=':2'], [data-bge-container*=':2:'])\n\t\t:where([data-bge-container-frame]) {\n\t\t--bge-grid-col: 2;\n\t}\n\n\t&:where([data-bge-container$=':3'], [data-bge-container*=':3:'])\n\t\t:where([data-bge-container-frame]) {\n\t\t--bge-grid-col: 3;\n\t}\n\n\t&:where([data-bge-container$=':4'], [data-bge-container*=':4:'])\n\t\t:where([data-bge-container-frame]) {\n\t\t--bge-grid-col: 4;\n\t}\n\n\t&:where([data-bge-container$=':5'], [data-bge-container*=':5:'])\n\t\t:where([data-bge-container-frame]) {\n\t\t--bge-grid-col: 5;\n\t}\n\n\t:where([data-bge-container-frame]) {\n\t\tdisplay: grid;\n\t\tgrid-template-columns: repeat(var(--bge-grid-col, 1), minmax(0, 1fr));\n\t\tgap: var(--bge-options-gap);\n\n\t\t&:is([data-bge-container*=':auto-fit:'] *) {\n\t\t\tgrid-template-columns: repeat(\n\t\t\t\tauto-fit,\n\t\t\t\tminmax(calc(var(--bge-auto-fit-base-width) / var(--bge-grid-col, 1)), 1fr)\n\t\t\t);\n\t\t}\n\t}\n\n\t:where([data-bge-group]) {\n\t\t--item-count: 1;\n\t\tdisplay: grid;\n\t\tgrid-template-rows: subgrid;\n\t\tgrid-row: span var(--item-count);\n\n\t\t/* Subgrid hack 2 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(2):last-child) {\n\t\t\t--item-count: 2;\n\t\t}\n\n\t\t/* Subgrid hack 3 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(3):last-child) {\n\t\t\t--item-count: 3;\n\t\t}\n\n\t\t/* Subgrid hack 4 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(4):last-child) {\n\t\t\t--item-count: 4;\n\t\t}\n\n\t\t/* Subgrid hack 5 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(5):last-child) {\n\t\t\t--item-count: 5;\n\t\t}\n\n\t\t/* Subgrid hack 6 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(6):last-child) {\n\t\t\t--item-count: 6;\n\t\t}\n\n\t\t/* Subgrid hack 7 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(7):last-child) {\n\t\t\t--item-count: 7;\n\t\t}\n\n\t\t/* Subgrid hack 8 items */\n\t\t&[data-bge-group]:has([data-bge-item]:nth-child(8):last-child) {\n\t\t\t--item-count: 8;\n\t\t}\n\t}\n\n\t:where([data-bge-item]) {\n\t\talign-self: self-start;\n\t\tcontainer-name: bge-item;\n\t\tcontainer-type: inline-size;\n\t}\n}\n\n:where([data-bge-container='inline'], [data-bge-container^='inline:']) {\n\t:where([data-bge-container-frame]) {\n\t\tdisplay: flex;\n\t\tflex-wrap: wrap;\n\t\tgap: var(--bge-options-gap);\n\t\talign-items: stretch;\n\t\tjustify-content: center;\n\n\t\t&:where(:is([data-bge-container$=':center'], [data-bge-container*=':center:']) *) {\n\t\t\tjustify-content: center;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':start'], [data-bge-container*=':start:']) *) {\n\t\t\tjustify-content: start;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':end'], [data-bge-container*=':end:']) *) {\n\t\t\tjustify-content: end;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':between'], [data-bge-container*=':between:']) *) {\n\t\t\tjustify-content: space-between;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':around'], [data-bge-container*=':around:']) *) {\n\t\t\tjustify-content: space-around;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':evenly'], [data-bge-container*=':evenly:']) *) {\n\t\t\tjustify-content: space-evenly;\n\t\t}\n\n\t\t&:where(\n\t\t\t:is([data-bge-container$=':align-center'], [data-bge-container*=':align-center:']) *\n\t\t) {\n\t\t\talign-items: center;\n\t\t}\n\n\t\t&:where(\n\t\t\t:is([data-bge-container$=':align-start'], [data-bge-container*=':align-start:']) *\n\t\t) {\n\t\t\talign-items: start;\n\t\t}\n\n\t\t&:where(\n\t\t\t:is([data-bge-container$=':align-end'], [data-bge-container*=':align-end:']) *\n\t\t) {\n\t\t\talign-items: end;\n\t\t}\n\n\t\t&:where(\n\t\t\t:is([data-bge-container$=':align-stretch'], [data-bge-container*=':align-stretch:'])\n\t\t\t\t*\n\t\t) {\n\t\t\talign-items: stretch;\n\t\t}\n\n\t\t&:where(\n\t\t\t:is(\n\t\t\t\t\t[data-bge-container$=':align-baseline'],\n\t\t\t\t\t[data-bge-container*=':align-baseline:']\n\t\t\t\t)\n\t\t\t\t*\n\t\t) {\n\t\t\t--align: baseline;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':wrap'], [data-bge-container*=':wrap:']) *) {\n\t\t\tflex-wrap: wrap;\n\t\t}\n\n\t\t&:where(:is([data-bge-container$=':nowrap'], [data-bge-container*=':nowrap:']) *) {\n\t\t\tflex-wrap: nowrap;\n\t\t}\n\t}\n\n\t&:where([data-bge-container$=':immutable'], [data-bge-container*=':immutable:'])\n\t\t:where([data-bge-container-frame]) {\n\t\t& > * {\n\t\t\tflex: 1 1 auto;\n\t\t}\n\t}\n}\n\n:where([data-bge-container='float'], [data-bge-container^='float:']) {\n\t--bge-grid-float: none;\n\t--margin-inline: 0;\n\n\t&:where([data-bge-container$=':start'], [data-bge-container*=':start:']) {\n\t\t--bge-grid-float: inline-start;\n\t\t--margin-inline: 0 var(--bge-options-gap);\n\t}\n\n\t&:where([data-bge-container$=':end'], [data-bge-container*=':end:']) {\n\t\t--bge-grid-float: inline-end;\n\t\t--margin-inline: var(--bge-options-gap) 0;\n\t}\n\n\t:where([data-bge-container-frame]) {\n\t\t&::after {\n\t\t\tclear: both;\n\t\t\tdisplay: block;\n\t\t\tcontent: '';\n\t\t}\n\n\t\t& > :where(:first-child) {\n\t\t\tfloat: var(--bge-grid-float, none);\n\t\t\tinline-size: fit-content;\n\t\t\tmargin-inline: var(--margin-inline);\n\t\t}\n\t}\n}\n";
845
845
 
846
846
  export { blocks, general as generalCSS, items };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@burger-editor/blocks",
3
- "version": "4.0.0-alpha.14",
3
+ "version": "4.0.0-alpha.16",
4
4
  "description": "BurgerEditor Blocks",
5
5
  "author": "D-ZERO",
6
6
  "license": "(MIT OR Apache-2.0)",
@@ -27,15 +27,15 @@
27
27
  "dev": "rollup -c -w"
28
28
  },
29
29
  "dependencies": {
30
- "@burger-editor/core": "4.0.0-alpha.14",
31
- "@burger-editor/utils": "4.0.0-alpha.14"
30
+ "@burger-editor/core": "4.0.0-alpha.16",
31
+ "@burger-editor/utils": "4.0.0-alpha.16"
32
32
  },
33
33
  "devDependencies": {
34
- "@burger-editor/custom-element": "4.0.0-alpha.14",
34
+ "@burger-editor/custom-element": "4.0.0-alpha.16",
35
35
  "@types/google.maps": "3.58.1",
36
- "rollup": "4.46.2",
36
+ "rollup": "4.47.1",
37
37
  "rollup-plugin-esbuild": "6.2.1",
38
38
  "rollup-plugin-string": "3.0.0"
39
39
  },
40
- "gitHead": "ad1ef6a084967778564eb7969de910f14c523945"
40
+ "gitHead": "d1e588ffde9fe0d69e3af6388b9ba4e627deb064"
41
41
  }