Browse Source

deploy docs

gh-pages
Artur Arseniev 5 years ago
parent
commit
92d05542b9
  1. 8
      docs/404.html
  2. 6
      docs/Home.html
  3. 13
      docs/api/assets.html
  4. 48
      docs/api/block.html
  5. 20
      docs/api/block_manager.html
  6. 52
      docs/api/canvas.html
  7. 12
      docs/api/commands.html
  8. 10
      docs/api/component.html
  9. 8
      docs/api/components.html
  10. 12
      docs/api/css_composer.html
  11. 66
      docs/api/css_rule.html
  12. 48
      docs/api/device.html
  13. 46
      docs/api/device_manager.html
  14. 31
      docs/api/editor.html
  15. 8
      docs/api/i18n.html
  16. 8
      docs/api/index.html
  17. 8
      docs/api/keymaps.html
  18. 12
      docs/api/modal_dialog.html
  19. 8
      docs/api/page.html
  20. 20
      docs/api/pages.html
  21. 8
      docs/api/panels.html
  22. 62
      docs/api/parser.html
  23. 8
      docs/api/rich_text_editor.html
  24. 12
      docs/api/selector_manager.html
  25. 8
      docs/api/storage_manager.html
  26. 8
      docs/api/style_manager.html
  27. 14
      docs/api/undo_manager.html
  28. 2
      docs/assets/js/10.5820b83e.js
  29. 2
      docs/assets/js/11.b63b354b.js
  30. 2
      docs/assets/js/12.0c4d869b.js
  31. 2
      docs/assets/js/14.5f22df6b.js
  32. 2
      docs/assets/js/15.4abef4d7.js
  33. 2
      docs/assets/js/16.86ce4521.js
  34. 2
      docs/assets/js/17.f46590a7.js
  35. 2
      docs/assets/js/18.7cde108a.js
  36. 2
      docs/assets/js/19.c63f93b9.js
  37. 2
      docs/assets/js/20.20d84c7c.js
  38. 2
      docs/assets/js/21.2bcebecd.js
  39. 2
      docs/assets/js/22.9198d9a9.js
  40. 1
      docs/assets/js/23.173c6f11.js
  41. 1
      docs/assets/js/23.24b1a9f0.js
  42. 1
      docs/assets/js/24.0b14d393.js
  43. 1
      docs/assets/js/24.5f532ac1.js
  44. 1
      docs/assets/js/25.4b4e28f3.js
  45. 1
      docs/assets/js/26.5a4f24ff.js
  46. 2
      docs/assets/js/26.a2eb9e5a.js
  47. 1
      docs/assets/js/27.a94bbf50.js
  48. 2
      docs/assets/js/28.53799e93.js
  49. 1
      docs/assets/js/29.0534d4fc.js
  50. 2
      docs/assets/js/29.d4b56a92.js
  51. 2
      docs/assets/js/3.e2d18c88.js
  52. 1
      docs/assets/js/30.91585127.js
  53. 1
      docs/assets/js/30.bcd6c9ba.js
  54. 1
      docs/assets/js/31.351ea798.js
  55. 1
      docs/assets/js/32.405cce15.js
  56. 1
      docs/assets/js/33.0061376c.js
  57. 2
      docs/assets/js/34.9fc51478.js
  58. 2
      docs/assets/js/35.1358dcad.js
  59. 1
      docs/assets/js/35.ee386620.js
  60. 2
      docs/assets/js/36.4efd224f.js
  61. 2
      docs/assets/js/37.bb7369c2.js
  62. 1
      docs/assets/js/38.b6076463.js
  63. 2
      docs/assets/js/39.a5db70a9.js
  64. 2
      docs/assets/js/4.f5f74e88.js
  65. 1
      docs/assets/js/40.b08cabb1.js
  66. 2
      docs/assets/js/41.85377700.js
  67. 2
      docs/assets/js/42.be31a4a9.js
  68. 2
      docs/assets/js/43.5e16fa84.js
  69. 1
      docs/assets/js/43.a4256f15.js
  70. 2
      docs/assets/js/44.5ab27d40.js
  71. 2
      docs/assets/js/45.ba1f8509.js
  72. 2
      docs/assets/js/46.d147024c.js
  73. 1
      docs/assets/js/47.e0d1eca1.js
  74. 2
      docs/assets/js/48.e7d820a6.js
  75. 2
      docs/assets/js/49.f98ef45a.js
  76. 2
      docs/assets/js/5.08e37066.js
  77. 2
      docs/assets/js/50.d45266e9.js
  78. 2
      docs/assets/js/51.e5e038d0.js
  79. 2
      docs/assets/js/52.6dcd0cb9.js
  80. 2
      docs/assets/js/53.66298f37.js
  81. 2
      docs/assets/js/54.e070b389.js
  82. 2
      docs/assets/js/55.bdd09571.js
  83. 2
      docs/assets/js/56.ca1aa9c3.js
  84. 2
      docs/assets/js/57.5ab02891.js
  85. 2
      docs/assets/js/58.8854dd6f.js
  86. 2
      docs/assets/js/59.7fed6525.js
  87. 2
      docs/assets/js/6.703956f1.js
  88. 2
      docs/assets/js/7.42f8bf76.js
  89. 2
      docs/assets/js/8.01db2cd4.js
  90. 2
      docs/assets/js/9.22dace02.js
  91. 8
      docs/assets/js/app.36495a81.js
  92. 8
      docs/assets/js/app.69ef2787.js
  93. 6
      docs/faq.html
  94. 10
      docs/getting-started.html
  95. 6
      docs/guides/Custom-CSS-parser.html
  96. 6
      docs/guides/Replace-Rich-Text-Editor.html
  97. 6
      docs/index.html
  98. 8
      docs/modules/Assets.html
  99. 6
      docs/modules/Blocks.html
  100. 6
      docs/modules/Commands.html

8
docs/404.html

@ -9,14 +9,14 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/18.2b682096.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/11.e4a5286f.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/2.15028157.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/18.7cde108a.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/11.b63b354b.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/2.15028157.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
<div id="app" data-server-rendered="true"><div class="theme-container"><div class="theme-default-content"><h1>404</h1> <blockquote>Looks like we've got some broken links.</blockquote> <a href="/docs/" class="router-link-active"> <div id="app" data-server-rendered="true"><div class="theme-container"><div class="theme-default-content"><h1>404</h1> <blockquote>There's nothing here.</blockquote> <a href="/docs/" class="router-link-active">
Take me home. Take me home.
</a></div></div><div class="global-ui"></div></div> </a></div></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/18.2b682096.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/18.7cde108a.js" defer></script>
</body> </body>
</html> </html>

6
docs/Home.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/19.c8bf26af.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/19.c63f93b9.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -337,6 +337,6 @@ The default one is the localStorage which is pretty simple and all the data are
<span class="token punctuation">}</span> <span class="token punctuation">}</span>
<span class="token operator">...</span> <span class="token operator">...</span>
</code></pre></div><blockquote><p>Check <a href="API-Storage-Manager">Storage Manager API Reference</a></p></blockquote></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/Home.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">7/13/2018, 12:12:35 AM</span></div></footer> <!----> </main></div><div class="global-ui"></div></div> </code></pre></div><blockquote><p>Check <a href="API-Storage-Manager">Storage Manager API Reference</a></p></blockquote></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/Home.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">7/13/2018, 12:12:35 AM</span></div></footer> <!----> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/19.c8bf26af.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/19.c63f93b9.js" defer></script>
</body> </body>
</html> </html>

13
docs/api/assets.html

File diff suppressed because one or more lines are too long

48
docs/api/block.html

File diff suppressed because one or more lines are too long

20
docs/api/block_manager.html

File diff suppressed because one or more lines are too long

52
docs/api/canvas.html

File diff suppressed because one or more lines are too long

12
docs/api/commands.html

File diff suppressed because one or more lines are too long

10
docs/api/component.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/26.5a4f24ff.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/27.a94bbf50.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,7 +34,7 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" aria-current="page" class="active sidebar-link"> ‍ ‍ ‍ Component</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/component.html#component" class="sidebar-link">Component</a></li></ul></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="component"><a href="#component" class="header-anchor">#</a> Component</h2> <p>The Component object represents a single node of our template structure, so when you update its properties the changes are <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" aria-current="page" class="active sidebar-link"> ‍ ‍ ‍ Component</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/component.html#component" class="sidebar-link">Component</a></li></ul></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="component"><a href="#component" class="header-anchor">#</a> Component</h2> <p><strong>Extends Model.extend(Styleable)</strong></p> <p>The Component object represents a single node of our template structure, so when you update its properties the changes are
immediately reflected on the canvas and in the code to export (indeed, when you ask to export the code we just go through all immediately reflected on the canvas and in the code to export (indeed, when you ask to export the code we just go through all
the tree of nodes). the tree of nodes).
An example on how to update properties:</p> <div class="language-js extra-class"><pre class="language-js"><code>component<span class="token punctuation">.</span><span class="token function">set</span><span class="token punctuation">(</span><span class="token punctuation">{</span> An example on how to update properties:</p> <div class="language-js extra-class"><pre class="language-js"><code>component<span class="token punctuation">.</span><span class="token function">set</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
@ -160,7 +160,7 @@ editor<span class="token punctuation">.</span><span class="token function">getSe
Initially, the list, was set statically on the Component object but it was Initially, the list, was set statically on the Component object but it was
not ok, as it was shared between multiple editor instances</p> <h4 id="parameters-36"><a href="#parameters-36" class="header-anchor">#</a> Parameters</h4> <ul><li><code>model</code></li></ul> <h3 id="checkid"><a href="#checkid" class="header-anchor">#</a> checkId</h3> <p>This method checks, for each parsed component and style object not ok, as it was shared between multiple editor instances</p> <h4 id="parameters-36"><a href="#parameters-36" class="header-anchor">#</a> Parameters</h4> <ul><li><code>model</code></li></ul> <h3 id="checkid"><a href="#checkid" class="header-anchor">#</a> checkId</h3> <p>This method checks, for each parsed component and style object
(are not Components/CSSRules yet), for duplicated id and fixes them (are not Components/CSSRules yet), for duplicated id and fixes them
This method is used in Components.js just after the parsing</p> <h4 id="parameters-37"><a href="#parameters-37" class="header-anchor">#</a> Parameters</h4> <ul><li><code>components</code></li> <li><code>styles</code> (optional, default <code>[]</code>)</li> <li><code>list</code> (optional, default <code>{}</code>)</li> <li><code>opts</code> (optional, default <code>{}</code>)</li></ul></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/api/component.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">7/21/2021, 12:49:29 AM</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev"> This method is used in Components.js just after the parsing</p> <h4 id="parameters-37"><a href="#parameters-37" class="header-anchor">#</a> Parameters</h4> <ul><li><code>components</code></li> <li><code>styles</code> (optional, default <code>[]</code>)</li> <li><code>list</code> (optional, default <code>{}</code>)</li> <li><code>opts</code> (optional, default <code>{}</code>)</li></ul></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/api/component.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">8/10/2021, 6:36:36 PM</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev">
← ←
<a href="/docs/api/components.html" class="prev"> <a href="/docs/api/components.html" class="prev">
DOM Components DOM Components
@ -169,6 +169,6 @@ This method is used in Components.js just after the parsing</p> <h4 id="paramete
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/26.5a4f24ff.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/27.a94bbf50.js" defer></script>
</body> </body>
</html> </html>

8
docs/api/components.html

File diff suppressed because one or more lines are too long

12
docs/api/css_composer.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/28.f3e302a2.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/29.d4b56a92.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,7 +34,7 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" aria-current="page" class="active sidebar-link">CSS Composer</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#csscomposer" class="sidebar-link">CssComposer</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#load" class="sidebar-link">load</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#store" class="sidebar-link">store</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#get" class="sidebar-link">get</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#getall" class="sidebar-link">getAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#clear" class="sidebar-link">clear</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#setrule" class="sidebar-link">setRule</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#getrule" class="sidebar-link">getRule</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#getrules" class="sidebar-link">getRules</a></li></ul></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="csscomposer"><a href="#csscomposer" class="header-anchor">#</a> CssComposer</h2> <p>This module contains and manage CSS rules for the template inside the canvas. <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" aria-current="page" class="active sidebar-link">CSS Composer</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#csscomposer" class="sidebar-link">CssComposer</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#load" class="sidebar-link">load</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#store" class="sidebar-link">store</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#get" class="sidebar-link">get</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#getall" class="sidebar-link">getAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#clear" class="sidebar-link">clear</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#setrule" class="sidebar-link">setRule</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#getrule" class="sidebar-link">getRule</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_composer.html#getrules" class="sidebar-link">getRules</a></li></ul></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="csscomposer"><a href="#csscomposer" class="header-anchor">#</a> CssComposer</h2> <p>This module contains and manage CSS rules for the template inside the canvas.
You can customize the initial state of the module from the editor initialization, by passing the following <a href="https://github.com/artf/grapesjs/blob/master/src/css_composer/config/config.js" target="_blank" rel="noopener noreferrer">Configuration Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span> You can customize the initial state of the module from the editor initialization, by passing the following <a href="https://github.com/artf/grapesjs/blob/master/src/css_composer/config/config.js" target="_blank" rel="noopener noreferrer">Configuration Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
cssComposer<span class="token operator">:</span> <span class="token punctuation">{</span> cssComposer<span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token comment">// options</span> <span class="token comment">// options</span>
@ -86,11 +86,11 @@ console<span class="token punctuation">.</span><span class="token function">log<
← ←
<a href="/docs/api/selector_manager.html" class="prev"> <a href="/docs/api/selector_manager.html" class="prev">
Selector Manager Selector Manager
</a></span> <span class="next"><a href="/docs/api/modal_dialog.html"> </a></span> <span class="next"><a href="/docs/api/css_rule.html">
Modal ‍ ‍ ‍ CssRule
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/28.f3e302a2.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/29.d4b56a92.js" defer></script>
</body> </body>
</html> </html>

66
docs/api/css_rule.html

@ -0,0 +1,66 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>GrapesJS</title>
<meta name="generator" content="VuePress 1.8.2">
<link rel="icon" href="/docs/logo-icon.png">
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/30.bcd6c9ba.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head>
<body>
<div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/docs/" class="home-link router-link-active"><img src="/docs/logo.png" alt="GrapesJS" class="logo"> <span class="site-name can-hide">GrapesJS</span></a> <div class="links"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <nav class="nav-links can-hide"><div class="nav-item"><a href="/docs/" class="nav-link">
Docs
</a></div><div class="nav-item"><a href="/docs/api/" class="nav-link router-link-active">
API Reference
</a></div><div class="nav-item"><a href="https://opencollective.com/grapesjs" target="_blank" rel="noopener noreferrer" class="nav-link external">
Support Us
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div><div class="nav-item"><a href="https://twitter.com/grapesjs" target="_blank" rel="noopener noreferrer" class="nav-link external">
Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav></div></header> <div class="sidebar-mask"></div> <aside class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/docs/" class="nav-link">
Docs
</a></div><div class="nav-item"><a href="/docs/api/" class="nav-link router-link-active">
API Reference
</a></div><div class="nav-item"><a href="https://opencollective.com/grapesjs" target="_blank" rel="noopener noreferrer" class="nav-link external">
Support Us
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div><div class="nav-item"><a href="https://twitter.com/grapesjs" target="_blank" rel="noopener noreferrer" class="nav-link external">
Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" aria-current="page" class="active sidebar-link"> ‍ ‍ ‍ CssRule</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/css_rule.html#getatrule" class="sidebar-link">getAtRule</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_rule.html#selectorstostring" class="sidebar-link">selectorsToString</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_rule.html#getdeclaration" class="sidebar-link">getDeclaration</a></li><li class="sidebar-sub-header"><a href="/docs/api/css_rule.html#tocss" class="sidebar-link">toCSS</a></li></ul></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="getatrule"><a href="#getatrule" class="header-anchor">#</a> getAtRule</h2> <p>Return the at-rule statement when exists, eg. '@media (...)', '@keyframes'</p> <h3 id="examples"><a href="#examples" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> cssRule <span class="token operator">=</span> editor<span class="token punctuation">.</span>Css<span class="token punctuation">.</span><span class="token function">setRule</span><span class="token punctuation">(</span><span class="token string">'.class1'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> color<span class="token operator">:</span> <span class="token string">'red'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
atRuleType<span class="token operator">:</span> <span class="token string">'media'</span><span class="token punctuation">,</span>
atRuleParams<span class="token operator">:</span> <span class="token string">'(min-width: 500px)'</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
cssRule<span class="token punctuation">.</span><span class="token function">getAtRule</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// &quot;@media (min-width: 500px)&quot;</span>
</code></pre></div><p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong></p> <h2 id="selectorstostring"><a href="#selectorstostring" class="header-anchor">#</a> selectorsToString</h2> <p>Return selectors of the rule as a string</p> <h3 id="parameters"><a href="#parameters" class="header-anchor">#</a> Parameters</h3> <ul><li><p><code>opts</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object" target="_blank" rel="noopener noreferrer">Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>?</strong> Options (optional, default <code>{}</code>)</p> <ul><li><code>opts.skipState</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean" target="_blank" rel="noopener noreferrer">Boolean<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>?</strong> Skip state from the result</li></ul></li></ul> <h3 id="examples-2"><a href="#examples-2" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> cssRule <span class="token operator">=</span> editor<span class="token punctuation">.</span>Css<span class="token punctuation">.</span><span class="token function">setRule</span><span class="token punctuation">(</span><span class="token string">'.class1:hover'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> color<span class="token operator">:</span> <span class="token string">'red'</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
cssRule<span class="token punctuation">.</span><span class="token function">selectorsToString</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// &quot;.class1:hover&quot;</span>
cssRule<span class="token punctuation">.</span><span class="token function">selectorsToString</span><span class="token punctuation">(</span><span class="token punctuation">{</span> skipState<span class="token operator">:</span> <span class="token boolean">true</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token comment">// &quot;.class1&quot;</span>
</code></pre></div><p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong></p> <h2 id="getdeclaration"><a href="#getdeclaration" class="header-anchor">#</a> getDeclaration</h2> <p>Get declaration block (without the at-rule statement)</p> <h3 id="parameters-2"><a href="#parameters-2" class="header-anchor">#</a> Parameters</h3> <ul><li><code>opts</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object" target="_blank" rel="noopener noreferrer">Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> Options (same as in <code>selectorsToString</code>) (optional, default <code>{}</code>)</li></ul> <h3 id="examples-3"><a href="#examples-3" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> cssRule <span class="token operator">=</span> editor<span class="token punctuation">.</span>Css<span class="token punctuation">.</span><span class="token function">setRule</span><span class="token punctuation">(</span><span class="token string">'.class1'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> color<span class="token operator">:</span> <span class="token string">'red'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
atRuleType<span class="token operator">:</span> <span class="token string">'media'</span><span class="token punctuation">,</span>
atRuleParams<span class="token operator">:</span> <span class="token string">'(min-width: 500px)'</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
cssRule<span class="token punctuation">.</span><span class="token function">getDeclaration</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token comment">// &quot;.class1{color:red;}&quot;</span>
</code></pre></div><p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong></p> <h2 id="tocss"><a href="#tocss" class="header-anchor">#</a> toCSS</h2> <p>Return the CSS string of the rule</p> <h3 id="parameters-3"><a href="#parameters-3" class="header-anchor">#</a> Parameters</h3> <ul><li><code>opts</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object" target="_blank" rel="noopener noreferrer">Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> Options (same as in <code>getDeclaration</code>) (optional, default <code>{}</code>)</li></ul> <h3 id="examples-4"><a href="#examples-4" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> cssRule <span class="token operator">=</span> editor<span class="token punctuation">.</span>Css<span class="token punctuation">.</span><span class="token function">setRule</span><span class="token punctuation">(</span><span class="token string">'.class1'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> color<span class="token operator">:</span> <span class="token string">'red'</span> <span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
atRuleType<span class="token operator">:</span> <span class="token string">'media'</span><span class="token punctuation">,</span>
atRuleParams<span class="token operator">:</span> <span class="token string">'(min-width: 500px)'</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
cssRule<span class="token punctuation">.</span><span class="token function">toCSS</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token comment">// &quot;@media (min-width: 500px){.class1{color:red;}}&quot;</span>
</code></pre></div><p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> CSS string</p></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/api/css_rule.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">8/10/2021, 7:02:19 PM</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev">
←
<a href="/docs/api/css_composer.html" class="prev">
CSS Composer
</a></span> <span class="next"><a href="/docs/api/modal_dialog.html">
Modal
</a>
→
</span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/30.bcd6c9ba.js" defer></script>
</body>
</html>

48
docs/api/device.html

File diff suppressed because one or more lines are too long

46
docs/api/device_manager.html

File diff suppressed because one or more lines are too long

31
docs/api/editor.html

File diff suppressed because one or more lines are too long

8
docs/api/i18n.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/31.58e6a8d0.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/34.9fc51478.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,7 +34,7 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" aria-current="page" class="active sidebar-link">I18n</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#i18n" class="sidebar-link">I18n</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#getconfig" class="sidebar-link">getConfig</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#setlocale" class="sidebar-link">setLocale</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#getlocale" class="sidebar-link">getLocale</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#getmessages" class="sidebar-link">getMessages</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#setmessages" class="sidebar-link">setMessages</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#addmessages" class="sidebar-link">addMessages</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#t" class="sidebar-link">t</a></li></ul></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="i18n"><a href="#i18n" class="header-anchor">#</a> I18n</h2> <p>You can customize the initial state of the module from the editor initialization, by passing the following <a href="https://github.com/artf/grapesjs/blob/master/src/i18n/config.js" target="_blank" rel="noopener noreferrer">Configuration Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" aria-current="page" class="active sidebar-link">I18n</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#i18n" class="sidebar-link">I18n</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#getconfig" class="sidebar-link">getConfig</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#setlocale" class="sidebar-link">setLocale</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#getlocale" class="sidebar-link">getLocale</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#getmessages" class="sidebar-link">getMessages</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#setmessages" class="sidebar-link">setMessages</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#addmessages" class="sidebar-link">addMessages</a></li><li class="sidebar-sub-header"><a href="/docs/api/i18n.html#t" class="sidebar-link">t</a></li></ul></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="i18n"><a href="#i18n" class="header-anchor">#</a> I18n</h2> <p>You can customize the initial state of the module from the editor initialization, by passing the following <a href="https://github.com/artf/grapesjs/blob/master/src/i18n/config.js" target="_blank" rel="noopener noreferrer">Configuration Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
i18n<span class="token operator">:</span> <span class="token punctuation">{</span> i18n<span class="token operator">:</span> <span class="token punctuation">{</span>
locale<span class="token operator">:</span> <span class="token string">'en'</span><span class="token punctuation">,</span> locale<span class="token operator">:</span> <span class="token string">'en'</span><span class="token punctuation">,</span>
localeFallback<span class="token operator">:</span> <span class="token string">'en'</span><span class="token punctuation">,</span> localeFallback<span class="token operator">:</span> <span class="token string">'en'</span><span class="token punctuation">,</span>
@ -81,6 +81,6 @@ obj<span class="token punctuation">.</span><span class="token function">t</span>
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/31.58e6a8d0.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/34.9fc51478.js" defer></script>
</body> </body>
</html> </html>

8
docs/api/index.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/21.80a868df.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/21.2bcebecd.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,11 +34,11 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="active sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="api-reference"><a href="#api-reference" class="header-anchor">#</a> API Reference</h1> <p>Here you can find the documentation about GrapesJS' APIs. Mainly, you would use them for your editor to extend the basic functionality of the framework or you could also <a href="/docs/modules/Plugins.html">create a plugin</a> and make those extensions reusable and available to others.</p></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/api/README.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">7/9/2018, 1:03:59 AM</span></div></footer> <div class="page-nav"><p class="inner"><!----> <span class="next"><a href="/docs/api/editor.html"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="active sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="api-reference"><a href="#api-reference" class="header-anchor">#</a> API Reference</h1> <p>Here you can find the documentation about GrapesJS' APIs. Mainly, you would use them for your editor to extend the basic functionality of the framework or you could also <a href="/docs/modules/Plugins.html">create a plugin</a> and make those extensions reusable and available to others.</p></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/api/README.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">7/9/2018, 1:03:59 AM</span></div></footer> <div class="page-nav"><p class="inner"><!----> <span class="next"><a href="/docs/api/editor.html">
Editor Editor
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/21.80a868df.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/21.2bcebecd.js" defer></script>
</body> </body>
</html> </html>

8
docs/api/keymaps.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/32.9ea68a19.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/35.1358dcad.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,7 +34,7 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" aria-current="page" class="active sidebar-link">Keymaps</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#keymaps" class="sidebar-link">Keymaps</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#getconfig" class="sidebar-link">getConfig</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#get" class="sidebar-link">get</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#getall" class="sidebar-link">getAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#remove" class="sidebar-link">remove</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#removeall" class="sidebar-link">removeAll</a></li></ul></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="keymaps"><a href="#keymaps" class="header-anchor">#</a> Keymaps</h2> <p>You can customize the initial state of the module from the editor initialization</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" aria-current="page" class="active sidebar-link">Keymaps</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#keymaps" class="sidebar-link">Keymaps</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#getconfig" class="sidebar-link">getConfig</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#get" class="sidebar-link">get</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#getall" class="sidebar-link">getAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#remove" class="sidebar-link">remove</a></li><li class="sidebar-sub-header"><a href="/docs/api/keymaps.html#removeall" class="sidebar-link">removeAll</a></li></ul></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="keymaps"><a href="#keymaps" class="header-anchor">#</a> Keymaps</h2> <p>You can customize the initial state of the module from the editor initialization</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
keymaps<span class="token operator">:</span> <span class="token punctuation">{</span> keymaps<span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token comment">// Object of keymaps</span> <span class="token comment">// Object of keymaps</span>
defaults<span class="token operator">:</span> <span class="token punctuation">{</span> defaults<span class="token operator">:</span> <span class="token punctuation">{</span>
@ -74,6 +74,6 @@ or just a command id as a string</p> <h2 id="get"><a href="#get" class="header-a
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/32.9ea68a19.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/35.1358dcad.js" defer></script>
</body> </body>
</html> </html>

12
docs/api/modal_dialog.html

File diff suppressed because one or more lines are too long

8
docs/api/page.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/34.5195e151.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/37.bb7369c2.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,7 +34,7 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" aria-current="page" class="active sidebar-link"> ‍ ‍ ‍ Page</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/page.html#getallframes" class="sidebar-link">getAllFrames</a></li><li class="sidebar-sub-header"><a href="/docs/api/page.html#getmainframe" class="sidebar-link">getMainFrame</a></li><li class="sidebar-sub-header"><a href="/docs/api/page.html#getmaincomponent" class="sidebar-link">getMainComponent</a></li></ul></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="getallframes"><a href="#getallframes" class="header-anchor">#</a> getAllFrames</h2> <p>Get all frames</p> <h3 id="examples"><a href="#examples" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> arrayOfFrames <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">getAllFrames</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" aria-current="page" class="active sidebar-link"> ‍ ‍ ‍ Page</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/page.html#getallframes" class="sidebar-link">getAllFrames</a></li><li class="sidebar-sub-header"><a href="/docs/api/page.html#getmainframe" class="sidebar-link">getMainFrame</a></li><li class="sidebar-sub-header"><a href="/docs/api/page.html#getmaincomponent" class="sidebar-link">getMainComponent</a></li></ul></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="getallframes"><a href="#getallframes" class="header-anchor">#</a> getAllFrames</h2> <p>Get all frames</p> <h3 id="examples"><a href="#examples" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> arrayOfFrames <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">getAllFrames</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array" target="_blank" rel="noopener noreferrer">Array<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>&lt;Frame&gt;</strong></p> <h2 id="getmainframe"><a href="#getmainframe" class="header-anchor">#</a> getMainFrame</h2> <p>Get the first frame of the page (identified always as the main one)</p> <h3 id="examples-2"><a href="#examples-2" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> mainFrame <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">getMainFrame</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre></div><p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array" target="_blank" rel="noopener noreferrer">Array<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>&lt;Frame&gt;</strong></p> <h2 id="getmainframe"><a href="#getmainframe" class="header-anchor">#</a> getMainFrame</h2> <p>Get the first frame of the page (identified always as the main one)</p> <h3 id="examples-2"><a href="#examples-2" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> mainFrame <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">getMainFrame</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Returns <strong>Frame</strong></p> <h2 id="getmaincomponent"><a href="#getmaincomponent" class="header-anchor">#</a> getMainComponent</h2> <p>Get the root component (usually is the <code>wrapper</code> component) from the main frame</p> <h3 id="examples-3"><a href="#examples-3" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> rootComponent <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">getMainComponent</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre></div><p>Returns <strong>Frame</strong></p> <h2 id="getmaincomponent"><a href="#getmaincomponent" class="header-anchor">#</a> getMainComponent</h2> <p>Get the root component (usually is the <code>wrapper</code> component) from the main frame</p> <h3 id="examples-3"><a href="#examples-3" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> rootComponent <span class="token operator">=</span> page<span class="token punctuation">.</span><span class="token function">getMainComponent</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>rootComponent<span class="token punctuation">.</span><span class="token function">toHTML</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>rootComponent<span class="token punctuation">.</span><span class="token function">toHTML</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
@ -47,6 +47,6 @@ console<span class="token punctuation">.</span><span class="token function">log<
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/34.5195e151.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/37.bb7369c2.js" defer></script>
</body> </body>
</html> </html>

20
docs/api/pages.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/35.ee386620.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/38.b6076463.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,7 +34,7 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" aria-current="page" class="active sidebar-link">Pages</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/pages.html#pages" class="sidebar-link">Pages</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#available-events" class="sidebar-link">Available Events</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#methods" class="sidebar-link">Methods</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#remove" class="sidebar-link">remove</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#get" class="sidebar-link">get</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#getmain" class="sidebar-link">getMain</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#getall" class="sidebar-link">getAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#select" class="sidebar-link">select</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#getselected" class="sidebar-link">getSelected</a></li></ul></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="pages"><a href="#pages" class="header-anchor">#</a> Pages</h2> <p>You can customize the initial state of the module from the editor initialization</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" aria-current="page" class="active sidebar-link">Pages</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/pages.html#pages" class="sidebar-link">Pages</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#available-events" class="sidebar-link">Available Events</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#methods" class="sidebar-link">Methods</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#remove" class="sidebar-link">remove</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#get" class="sidebar-link">get</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#getmain" class="sidebar-link">getMain</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#getall" class="sidebar-link">getAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#select" class="sidebar-link">select</a></li><li class="sidebar-sub-header"><a href="/docs/api/pages.html#getselected" class="sidebar-link">getSelected</a></li></ul></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="pages"><a href="#pages" class="header-anchor">#</a> Pages</h2> <p>You can customize the initial state of the module from the editor initialization</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
<span class="token operator">...</span><span class="token punctuation">.</span> <span class="token operator">...</span><span class="token punctuation">.</span>
pageManager<span class="token operator">:</span> <span class="token punctuation">{</span> pageManager<span class="token operator">:</span> <span class="token punctuation">{</span>
pages<span class="token operator">:</span> <span class="token punctuation">[</span> pages<span class="token operator">:</span> <span class="token punctuation">[</span>
@ -52,19 +52,19 @@
styles<span class="token operator">:</span> <span class="token template-string"><span class="token template-punctuation string">`</span><span class="token string">.my-class { color: red }</span><span class="token template-punctuation string">`</span></span><span class="token punctuation">,</span> <span class="token comment">// or a JSON of styles</span> styles<span class="token operator">:</span> <span class="token template-string"><span class="token template-punctuation string">`</span><span class="token string">.my-class { color: red }</span><span class="token template-punctuation string">`</span></span><span class="token punctuation">,</span> <span class="token comment">// or a JSON of styles</span>
component<span class="token operator">:</span> <span class="token string">'&lt;div class=&quot;my-class&quot;&gt;My element&lt;/div&gt;'</span><span class="token punctuation">,</span> <span class="token comment">// or a JSON of components</span> component<span class="token operator">:</span> <span class="token string">'&lt;div class=&quot;my-class&quot;&gt;My element&lt;/div&gt;'</span><span class="token punctuation">,</span> <span class="token comment">// or a JSON of components</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Returns <strong>Page</strong></p> <h2 id="remove"><a href="#remove" class="header-anchor">#</a> remove</h2> <p>Remove page</p> <h3 id="parameters-2"><a href="#parameters-2" class="header-anchor">#</a> Parameters</h3> <ul><li><code>page</code> <strong>(<a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a> | Page)</strong> Page or page id</li> <li><code>opts</code> (optional, default <code>{}</code>)</li></ul> <h3 id="examples-2"><a href="#examples-2" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> removedPage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">remove</span><span class="token punctuation">(</span><span class="token string">'page-id'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre></div><p>Returns <strong><a href="/docs/api/page.html">Page</a></strong></p> <h2 id="remove"><a href="#remove" class="header-anchor">#</a> remove</h2> <p>Remove page</p> <h3 id="parameters-2"><a href="#parameters-2" class="header-anchor">#</a> Parameters</h3> <ul><li><code>page</code> <strong>(<a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a> | <a href="/docs/api/page.html">Page</a>)</strong> Page or page id</li> <li><code>opts</code> (optional, default <code>{}</code>)</li></ul> <h3 id="examples-2"><a href="#examples-2" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> removedPage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">remove</span><span class="token punctuation">(</span><span class="token string">'page-id'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// or by passing the page</span> <span class="token comment">// or by passing the page</span>
<span class="token keyword">const</span> somePage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token string">'page-id'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">const</span> somePage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token string">'page-id'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
pageManager<span class="token punctuation">.</span><span class="token function">remove</span><span class="token punctuation">(</span>somePage<span class="token punctuation">)</span><span class="token punctuation">;</span> pageManager<span class="token punctuation">.</span><span class="token function">remove</span><span class="token punctuation">(</span>somePage<span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Returns <strong>Page</strong></p> <h2 id="get"><a href="#get" class="header-anchor">#</a> get</h2> <p>Get page by id</p> <h3 id="parameters-3"><a href="#parameters-3" class="header-anchor">#</a> Parameters</h3> <ul><li><code>id</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> Page id</li></ul> <h3 id="examples-3"><a href="#examples-3" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> somePage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token string">'page-id'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre></div><p>Returns <strong><a href="/docs/api/page.html">Page</a></strong></p> <h2 id="get"><a href="#get" class="header-anchor">#</a> get</h2> <p>Get page by id</p> <h3 id="parameters-3"><a href="#parameters-3" class="header-anchor">#</a> Parameters</h3> <ul><li><code>id</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> Page id</li></ul> <h3 id="examples-3"><a href="#examples-3" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> somePage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token string">'page-id'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Returns <strong>Page</strong></p> <h2 id="getmain"><a href="#getmain" class="header-anchor">#</a> getMain</h2> <p>Get main page (the first one available)</p> <h3 id="examples-4"><a href="#examples-4" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> mainPage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">getMain</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre></div><p>Returns <strong><a href="/docs/api/page.html">Page</a></strong></p> <h2 id="getmain"><a href="#getmain" class="header-anchor">#</a> getMain</h2> <p>Get main page (the first one available)</p> <h3 id="examples-4"><a href="#examples-4" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> mainPage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">getMain</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Returns <strong>Page</strong></p> <h2 id="getall"><a href="#getall" class="header-anchor">#</a> getAll</h2> <p>Get all pages</p> <h3 id="examples-5"><a href="#examples-5" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> arrayOfPages <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">getAll</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre></div><p>Returns <strong><a href="/docs/api/page.html">Page</a></strong></p> <h2 id="getall"><a href="#getall" class="header-anchor">#</a> getAll</h2> <p>Get all pages</p> <h3 id="examples-5"><a href="#examples-5" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> arrayOfPages <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">getAll</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array" target="_blank" rel="noopener noreferrer">Array<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>&lt;Page&gt;</strong></p> <h2 id="select"><a href="#select" class="header-anchor">#</a> select</h2> <p>Change the selected page. This will switch the page rendered in canvas</p> <h3 id="parameters-4"><a href="#parameters-4" class="header-anchor">#</a> Parameters</h3> <ul><li><code>page</code> <strong>(<a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a> | Page)</strong> Page or page id</li> <li><code>opts</code> (optional, default <code>{}</code>)</li></ul> <h3 id="examples-6"><a href="#examples-6" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code>pageManager<span class="token punctuation">.</span><span class="token function">select</span><span class="token punctuation">(</span><span class="token string">'page-id'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre></div><p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array" target="_blank" rel="noopener noreferrer">Array<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>&lt;<a href="/docs/api/page.html">Page</a>&gt;</strong></p> <h2 id="select"><a href="#select" class="header-anchor">#</a> select</h2> <p>Change the selected page. This will switch the page rendered in canvas</p> <h3 id="parameters-4"><a href="#parameters-4" class="header-anchor">#</a> Parameters</h3> <ul><li><code>page</code> <strong>(<a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a> | <a href="/docs/api/page.html">Page</a>)</strong> Page or page id</li> <li><code>opts</code> (optional, default <code>{}</code>)</li></ul> <h3 id="examples-6"><a href="#examples-6" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code>pageManager<span class="token punctuation">.</span><span class="token function">select</span><span class="token punctuation">(</span><span class="token string">'page-id'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// or by passing the page</span> <span class="token comment">// or by passing the page</span>
<span class="token keyword">const</span> somePage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token string">'page-id'</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">const</span> somePage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token string">'page-id'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
pageManager<span class="token punctuation">.</span><span class="token function">select</span><span class="token punctuation">(</span>somePage<span class="token punctuation">)</span><span class="token punctuation">;</span> pageManager<span class="token punctuation">.</span><span class="token function">select</span><span class="token punctuation">(</span>somePage<span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Returns <strong>this</strong></p> <h2 id="getselected"><a href="#getselected" class="header-anchor">#</a> getSelected</h2> <p>Get the selected page</p> <h3 id="examples-7"><a href="#examples-7" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> selectedPage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">getSelected</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre></div><p>Returns <strong>this</strong></p> <h2 id="getselected"><a href="#getselected" class="header-anchor">#</a> getSelected</h2> <p>Get the selected page</p> <h3 id="examples-7"><a href="#examples-7" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> selectedPage <span class="token operator">=</span> pageManager<span class="token punctuation">.</span><span class="token function">getSelected</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Returns <strong>Page</strong></p></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/api/pages.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">6/18/2021, 7:20:54 PM</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev"> </code></pre></div><p>Returns <strong><a href="/docs/api/page.html">Page</a></strong></p></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/api/pages.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">8/12/2021, 4:15:22 PM</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev">
← ←
<a href="/docs/api/panels.html" class="prev"> <a href="/docs/api/panels.html" class="prev">
Panels Panels
@ -73,6 +73,6 @@ pageManager<span class="token punctuation">.</span><span class="token function">
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/35.ee386620.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/38.b6076463.js" defer></script>
</body> </body>
</html> </html>

8
docs/api/panels.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/36.3c04f1d9.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/39.a5db70a9.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,7 +34,7 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" aria-current="page" class="active sidebar-link">Panels</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/panels.html#panels" class="sidebar-link">Panels</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#getpanels" class="sidebar-link">getPanels</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#getpanelsel" class="sidebar-link">getPanelsEl</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#addpanel" class="sidebar-link">addPanel</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#removepanel" class="sidebar-link">removePanel</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#getpanel" class="sidebar-link">getPanel</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#addbutton" class="sidebar-link">addButton</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#removebutton" class="sidebar-link">removeButton</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#getbutton" class="sidebar-link">getButton</a></li></ul></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="panels"><a href="#panels" class="header-anchor">#</a> Panels</h2> <p>You can customize the initial state of the module from the editor initialization, by passing the following <a href="https://github.com/artf/grapesjs/blob/master/src/panels/config/config.js" target="_blank" rel="noopener noreferrer">Configuration Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" aria-current="page" class="active sidebar-link">Panels</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/panels.html#panels" class="sidebar-link">Panels</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#getpanels" class="sidebar-link">getPanels</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#getpanelsel" class="sidebar-link">getPanelsEl</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#addpanel" class="sidebar-link">addPanel</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#removepanel" class="sidebar-link">removePanel</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#getpanel" class="sidebar-link">getPanel</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#addbutton" class="sidebar-link">addButton</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#removebutton" class="sidebar-link">removeButton</a></li><li class="sidebar-sub-header"><a href="/docs/api/panels.html#getbutton" class="sidebar-link">getButton</a></li></ul></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="panels"><a href="#panels" class="header-anchor">#</a> Panels</h2> <p>You can customize the initial state of the module from the editor initialization, by passing the following <a href="https://github.com/artf/grapesjs/blob/master/src/panels/config/config.js" target="_blank" rel="noopener noreferrer">Configuration Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
panels<span class="token operator">:</span> <span class="token punctuation">{</span> panels<span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token comment">// options</span> <span class="token comment">// options</span>
<span class="token punctuation">}</span> <span class="token punctuation">}</span>
@ -95,6 +95,6 @@ command<span class="token operator">:</span> <span class="token punctuation">{</
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/36.3c04f1d9.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/39.a5db70a9.js" defer></script>
</body> </body>
</html> </html>

62
docs/api/parser.html

@ -0,0 +1,62 @@
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>GrapesJS</title>
<meta name="generator" content="VuePress 1.8.2">
<link rel="icon" href="/docs/logo-icon.png">
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/40.b08cabb1.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head>
<body>
<div id="app" data-server-rendered="true"><div class="theme-container"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div> <a href="/docs/" class="home-link router-link-active"><img src="/docs/logo.png" alt="GrapesJS" class="logo"> <span class="site-name can-hide">GrapesJS</span></a> <div class="links"><div class="search-box"><input aria-label="Search" autocomplete="off" spellcheck="false" value=""> <!----></div> <nav class="nav-links can-hide"><div class="nav-item"><a href="/docs/" class="nav-link">
Docs
</a></div><div class="nav-item"><a href="/docs/api/" class="nav-link router-link-active">
API Reference
</a></div><div class="nav-item"><a href="https://opencollective.com/grapesjs" target="_blank" rel="noopener noreferrer" class="nav-link external">
Support Us
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div><div class="nav-item"><a href="https://twitter.com/grapesjs" target="_blank" rel="noopener noreferrer" class="nav-link external">
Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav></div></header> <div class="sidebar-mask"></div> <aside class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/docs/" class="nav-link">
Docs
</a></div><div class="nav-item"><a href="/docs/api/" class="nav-link router-link-active">
API Reference
</a></div><div class="nav-item"><a href="https://opencollective.com/grapesjs" target="_blank" rel="noopener noreferrer" class="nav-link external">
Support Us
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div><div class="nav-item"><a href="https://twitter.com/grapesjs" target="_blank" rel="noopener noreferrer" class="nav-link external">
Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" aria-current="page" class="active sidebar-link">Parser</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/parser.html#parser" class="sidebar-link">Parser</a></li><li class="sidebar-sub-header"><a href="/docs/api/parser.html#available-events" class="sidebar-link">Available Events</a></li><li class="sidebar-sub-header"><a href="/docs/api/parser.html#methods" class="sidebar-link">Methods</a></li><li class="sidebar-sub-header"><a href="/docs/api/parser.html#getconfig" class="sidebar-link">getConfig</a></li><li class="sidebar-sub-header"><a href="/docs/api/parser.html#parsehtml" class="sidebar-link">parseHtml</a></li><li class="sidebar-sub-header"><a href="/docs/api/parser.html#parsecss" class="sidebar-link">parseCss</a></li></ul></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="parser"><a href="#parser" class="header-anchor">#</a> Parser</h2> <p>You can customize the initial state of the module from the editor initialization, by passing the following <a href="https://github.com/artf/grapesjs/blob/master/src/parser/config/config.js" target="_blank" rel="noopener noreferrer">Configuration Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
parser<span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token comment">// options</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span>
</code></pre></div><p>Once the editor is instantiated you can use its API. Before using these methods you should get the module from the instance</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> <span class="token punctuation">{</span> Parser <span class="token punctuation">}</span> <span class="token operator">=</span> editor<span class="token punctuation">;</span>
</code></pre></div><h2 id="available-events"><a href="#available-events" class="header-anchor">#</a> Available Events</h2> <ul><li><code>parse:html</code> - On HTML parse, an object containing the input and the output of the parser is passed as an argument</li> <li><code>parse:css</code> - On CSS parse, an object containing the input and the output of the parser is passed as an argument</li></ul> <h2 id="methods"><a href="#methods" class="header-anchor">#</a> Methods</h2> <ul><li><a href="#getconfig">getConfig</a></li> <li><a href="#parsehtml">parseHtml</a></li> <li><a href="#parsecss">parseCss</a></li></ul> <h2 id="getconfig"><a href="#getconfig" class="header-anchor">#</a> getConfig</h2> <p>Get the configuration object</p> <h3 id="examples"><a href="#examples" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code>console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>Parser<span class="token punctuation">.</span><span class="token function">getConfig</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span>
</code></pre></div><p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object" target="_blank" rel="noopener noreferrer">Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> Configuration object</p> <h2 id="parsehtml"><a href="#parsehtml" class="header-anchor">#</a> parseHtml</h2> <p>Parse HTML string and return the object containing the Component Definition</p> <h3 id="parameters"><a href="#parameters" class="header-anchor">#</a> Parameters</h3> <ul><li><p><code>input</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> HTML string to parse</p></li> <li><p><code>options</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object" target="_blank" rel="noopener noreferrer">Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>?</strong> Options (optional, default <code>{}</code>)</p> <ul><li><code>options.htmlType</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>?</strong> <a href="https://developer.mozilla.org/en-US/docs/Web/API/DOMParser/parseFromString#Argument02" target="_blank" rel="noopener noreferrer">HTML mime type<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a> to parse</li></ul></li></ul> <h3 id="examples-2"><a href="#examples-2" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> resHtml <span class="token operator">=</span> Parser<span class="token punctuation">.</span><span class="token function">parseHtml</span><span class="token punctuation">(</span><span class="token template-string"><span class="token template-punctuation string">`</span><span class="token string">&lt;table&gt;&lt;div&gt;Hi&lt;/div&gt;&lt;/table&gt;</span><span class="token template-punctuation string">`</span></span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
htmlType<span class="token operator">:</span> <span class="token string">'text/html'</span><span class="token punctuation">,</span> <span class="token comment">// default</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// By using the `text/html`, this will fix automatically all the HTML syntax issues</span>
<span class="token comment">// Indeed the final representation, in this case, will be `&lt;div&gt;Hi&lt;/div&gt;&lt;table&gt;&lt;/table&gt;`</span>
<span class="token keyword">const</span> resXml <span class="token operator">=</span> Parser<span class="token punctuation">.</span><span class="token function">parseHtml</span><span class="token punctuation">(</span><span class="token template-string"><span class="token template-punctuation string">`</span><span class="token string">&lt;table&gt;&lt;div&gt;Hi&lt;/div&gt;&lt;/table&gt;</span><span class="token template-punctuation string">`</span></span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
htmlType<span class="token operator">:</span> <span class="token string">'application/xml'</span><span class="token punctuation">,</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// This will preserve the original format as, from the XML point of view, is a valid format</span>
</code></pre></div><p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object" target="_blank" rel="noopener noreferrer">Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> Object containing the result <code>{ html: ..., css: ... }</code></p> <h2 id="parsecss"><a href="#parsecss" class="header-anchor">#</a> parseCss</h2> <p>Parse CSS string and return an array of valid definition objects for CSSRules</p> <h3 id="parameters-2"><a href="#parameters-2" class="header-anchor">#</a> Parameters</h3> <ul><li><code>input</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> CSS string to parse</li></ul> <h3 id="examples-3"><a href="#examples-3" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> res <span class="token operator">=</span> Parser<span class="token punctuation">.</span><span class="token function">parseCss</span><span class="token punctuation">(</span><span class="token string">'.cls { color: red }'</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// [{ ... }]</span>
</code></pre></div><p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array" target="_blank" rel="noopener noreferrer">Array<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>&lt;<a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object" target="_blank" rel="noopener noreferrer">Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>&gt;</strong> Array containing the result</p></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/api/parser.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">8/10/2021, 7:02:19 PM</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev">
←
<a href="/docs/api/undo_manager.html" class="prev">
Undo Manager
</a></span> <!----></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/40.b08cabb1.js" defer></script>
</body>
</html>

8
docs/api/rich_text_editor.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/37.29e16f9c.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/41.85377700.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,7 +34,7 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" aria-current="page" class="active sidebar-link">Rich Text Editor</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#richtexteditor" class="sidebar-link">RichTextEditor</a></li><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#get" class="sidebar-link">get</a></li><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#getall" class="sidebar-link">getAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#remove" class="sidebar-link">remove</a></li><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#gettoolbarel" class="sidebar-link">getToolbarEl</a></li></ul></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="richtexteditor"><a href="#richtexteditor" class="header-anchor">#</a> RichTextEditor</h2> <p>This module allows to customize the built-in toolbar of the Rich Text Editor and use commands from the <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand" target="_blank" rel="noopener noreferrer">HTML Editing APIs<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>. <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" aria-current="page" class="active sidebar-link">Rich Text Editor</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#richtexteditor" class="sidebar-link">RichTextEditor</a></li><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#get" class="sidebar-link">get</a></li><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#getall" class="sidebar-link">getAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#remove" class="sidebar-link">remove</a></li><li class="sidebar-sub-header"><a href="/docs/api/rich_text_editor.html#gettoolbarel" class="sidebar-link">getToolbarEl</a></li></ul></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="richtexteditor"><a href="#richtexteditor" class="header-anchor">#</a> RichTextEditor</h2> <p>This module allows to customize the built-in toolbar of the Rich Text Editor and use commands from the <a href="https://developer.mozilla.org/en-US/docs/Web/API/Document/execCommand" target="_blank" rel="noopener noreferrer">HTML Editing APIs<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>.
It's highly recommended to keep this toolbar as small as possible, especially from styling commands (eg. 'fontSize') and leave this task to the Style Manager</p> <p>You can customize the initial state of the module from the editor initialization, by passing the following <a href="https://github.com/artf/grapesjs/blob/master/src/rich_text_editor/config/config.js" target="_blank" rel="noopener noreferrer">Configuration Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span> It's highly recommended to keep this toolbar as small as possible, especially from styling commands (eg. 'fontSize') and leave this task to the Style Manager</p> <p>You can customize the initial state of the module from the editor initialization, by passing the following <a href="https://github.com/artf/grapesjs/blob/master/src/rich_text_editor/config/config.js" target="_blank" rel="noopener noreferrer">Configuration Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
richTextEditor<span class="token operator">:</span> <span class="token punctuation">{</span> richTextEditor<span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token comment">// options</span> <span class="token comment">// options</span>
@ -109,6 +109,6 @@ rte<span class="token punctuation">.</span><span class="token function">add</spa
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/37.29e16f9c.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/41.85377700.js" defer></script>
</body> </body>
</html> </html>

12
docs/api/selector_manager.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/38.5d32b029.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/42.be31a4a9.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,7 +34,7 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" aria-current="page" class="active sidebar-link">Selector Manager</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#selectormanager" class="sidebar-link">SelectorManager</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#getconfig" class="sidebar-link">getConfig</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#setstate" class="sidebar-link">setState</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#getstate" class="sidebar-link">getState</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#addclass" class="sidebar-link">addClass</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#get" class="sidebar-link">get</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#getall" class="sidebar-link">getAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#escapename" class="sidebar-link">escapeName</a></li></ul></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="selectormanager"><a href="#selectormanager" class="header-anchor">#</a> SelectorManager</h2> <p>Selectors in GrapesJS are used in CSS Composer inside Rules and in Components as classes. To illustrate this concept let's take <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" aria-current="page" class="active sidebar-link">Selector Manager</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#selectormanager" class="sidebar-link">SelectorManager</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#getconfig" class="sidebar-link">getConfig</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#setstate" class="sidebar-link">setState</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#getstate" class="sidebar-link">getState</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#addclass" class="sidebar-link">addClass</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#get" class="sidebar-link">get</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#getall" class="sidebar-link">getAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/selector_manager.html#escapename" class="sidebar-link">escapeName</a></li></ul></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="selectormanager"><a href="#selectormanager" class="header-anchor">#</a> SelectorManager</h2> <p>Selectors in GrapesJS are used in CSS Composer inside Rules and in Components as classes. To illustrate this concept let's take
a look at this code:</p> <div class="language-css extra-class"><pre class="language-css"><code><span class="token selector">span &gt; #send-btn.btn</span><span class="token punctuation">{</span> a look at this code:</p> <div class="language-css extra-class"><pre class="language-css"><code><span class="token selector">span &gt; #send-btn.btn</span><span class="token punctuation">{</span>
... ...
<span class="token punctuation">}</span> <span class="token punctuation">}</span>
@ -65,13 +65,13 @@ sm<span class="token punctuation">.</span><span class="token function">addClass<
<span class="token keyword">const</span> selectors <span class="token operator">=</span> selectorManager<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string">'class1'</span><span class="token punctuation">,</span> <span class="token string">'class2'</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token keyword">const</span> selectors <span class="token operator">=</span> selectorManager<span class="token punctuation">.</span><span class="token function">get</span><span class="token punctuation">(</span><span class="token punctuation">[</span><span class="token string">'class1'</span><span class="token punctuation">,</span> <span class="token string">'class2'</span><span class="token punctuation">]</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Returns <strong>(Model | <a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array" target="_blank" rel="noopener noreferrer">Array<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>)</strong></p> <h2 id="getall"><a href="#getall" class="header-anchor">#</a> getAll</h2> <p>Get all selectors</p> <p>Returns <strong>Collection</strong></p> <h2 id="escapename"><a href="#escapename" class="header-anchor">#</a> escapeName</h2> <p>Return escaped selector name</p> <h3 id="parameters-5"><a href="#parameters-5" class="header-anchor">#</a> Parameters</h3> <ul><li><code>name</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> Selector name to escape</li></ul> <p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> Escaped name</p></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/api/selector_manager.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">6/18/2021, 7:20:54 PM</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev"> </code></pre></div><p>Returns <strong>(Model | <a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array" target="_blank" rel="noopener noreferrer">Array<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a>)</strong></p> <h2 id="getall"><a href="#getall" class="header-anchor">#</a> getAll</h2> <p>Get all selectors</p> <p>Returns <strong>Collection</strong></p> <h2 id="escapename"><a href="#escapename" class="header-anchor">#</a> escapeName</h2> <p>Return escaped selector name</p> <h3 id="parameters-5"><a href="#parameters-5" class="header-anchor">#</a> Parameters</h3> <ul><li><code>name</code> <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> Selector name to escape</li></ul> <p>Returns <strong><a href="https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String" target="_blank" rel="noopener noreferrer">String<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></strong> Escaped name</p></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/api/selector_manager.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">6/18/2021, 7:20:54 PM</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev">
← ←
<a href="/docs/api/device_manager.html" class="prev"> <a href="/docs/api/device.html" class="prev">
Device Manager ‍ ‍ ‍ Device
</a></span> <span class="next"><a href="/docs/api/css_composer.html"> </a></span> <span class="next"><a href="/docs/api/css_composer.html">
CSS Composer CSS Composer
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/38.5d32b029.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/42.be31a4a9.js" defer></script>
</body> </body>
</html> </html>

8
docs/api/storage_manager.html

File diff suppressed because one or more lines are too long

8
docs/api/style_manager.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/40.8e6d589e.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/44.5ab27d40.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,7 +34,7 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" aria-current="page" class="active sidebar-link">Style Manager</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#stylemanager" class="sidebar-link">StyleManager</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getconfig" class="sidebar-link">getConfig</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#addsector" class="sidebar-link">addSector</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getsector" class="sidebar-link">getSector</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#removesector" class="sidebar-link">removeSector</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getsectors" class="sidebar-link">getSectors</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#addproperty" class="sidebar-link">addProperty</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getproperty" class="sidebar-link">getProperty</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#removeproperty" class="sidebar-link">removeProperty</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getproperties" class="sidebar-link">getProperties</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getmodeltostyle" class="sidebar-link">getModelToStyle</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#addtype" class="sidebar-link">addType</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#gettype" class="sidebar-link">getType</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#gettypes" class="sidebar-link">getTypes</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#createtype" class="sidebar-link">createType</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#settarget" class="sidebar-link">setTarget</a></li></ul></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="stylemanager"><a href="#stylemanager" class="header-anchor">#</a> StyleManager</h2> <p>With Style Manager you build categories (called sectors) of CSS properties which could be used to customize the style of components. <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" aria-current="page" class="active sidebar-link">Style Manager</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#stylemanager" class="sidebar-link">StyleManager</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getconfig" class="sidebar-link">getConfig</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#addsector" class="sidebar-link">addSector</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getsector" class="sidebar-link">getSector</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#removesector" class="sidebar-link">removeSector</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getsectors" class="sidebar-link">getSectors</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#addproperty" class="sidebar-link">addProperty</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getproperty" class="sidebar-link">getProperty</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#removeproperty" class="sidebar-link">removeProperty</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getproperties" class="sidebar-link">getProperties</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#getmodeltostyle" class="sidebar-link">getModelToStyle</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#addtype" class="sidebar-link">addType</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#gettype" class="sidebar-link">getType</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#gettypes" class="sidebar-link">getTypes</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#createtype" class="sidebar-link">createType</a></li><li class="sidebar-sub-header"><a href="/docs/api/style_manager.html#settarget" class="sidebar-link">setTarget</a></li></ul></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" class="sidebar-link">Undo Manager</a></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="stylemanager"><a href="#stylemanager" class="header-anchor">#</a> StyleManager</h2> <p>With Style Manager you build categories (called sectors) of CSS properties which could be used to customize the style of components.
You can customize the initial state of the module from the editor initialization, by passing the following <a href="https://github.com/artf/grapesjs/blob/master/src/style_manager/config/config.js" target="_blank" rel="noopener noreferrer">Configuration Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span> You can customize the initial state of the module from the editor initialization, by passing the following <a href="https://github.com/artf/grapesjs/blob/master/src/style_manager/config/config.js" target="_blank" rel="noopener noreferrer">Configuration Object<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> editor <span class="token operator">=</span> grapesjs<span class="token punctuation">.</span><span class="token function">init</span><span class="token punctuation">(</span><span class="token punctuation">{</span>
styleManager<span class="token operator">:</span> <span class="token punctuation">{</span> styleManager<span class="token operator">:</span> <span class="token punctuation">{</span>
<span class="token comment">// options</span> <span class="token comment">// options</span>
@ -112,6 +112,6 @@ It could be a Component, CSSRule, or a string of any CSS selector</p> <h3 id="pa
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/40.8e6d589e.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/44.5ab27d40.js" defer></script>
</body> </body>
</html> </html>

14
docs/api/undo_manager.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/41.3352d1b5.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/45.ba1f8509.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -34,7 +34,7 @@
Twitter Twitter
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" aria-current="page" class="active sidebar-link">Undo Manager</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#undomanager" class="sidebar-link">UndoManager</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#getconfig" class="sidebar-link">getConfig</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#remove" class="sidebar-link">remove</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#removeall" class="sidebar-link">removeAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#start" class="sidebar-link">start</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#stop" class="sidebar-link">stop</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#undo" class="sidebar-link">undo</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#undoall" class="sidebar-link">undoAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#redo" class="sidebar-link">redo</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#redoall" class="sidebar-link">redoAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#hasundo" class="sidebar-link">hasUndo</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#hasredo" class="sidebar-link">hasRedo</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#isregistered" class="sidebar-link">isRegistered</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#getstack" class="sidebar-link">getStack</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#getstackgroup" class="sidebar-link">getStackGroup</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#clear" class="sidebar-link">clear</a></li></ul></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="undomanager"><a href="#undomanager" class="header-anchor">#</a> UndoManager</h2> <p>This module allows to manage the stack of changes applied in canvas. <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/api/" aria-current="page" class="sidebar-link">API Reference</a></li><li><a href="/docs/api/editor.html" class="sidebar-link">Editor</a></li><li><a href="/docs/api/i18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/api/canvas.html" class="sidebar-link">Canvas</a></li><li><a href="/docs/api/assets.html" class="sidebar-link">Asset Manager</a></li><li><a href="/docs/api/block_manager.html" class="sidebar-link">Block Manager</a></li><li><a href="/docs/api/block.html" class="sidebar-link"> ‍ ‍ ‍ Block</a></li><li><a href="/docs/api/commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/api/components.html" class="sidebar-link">DOM Components</a></li><li><a href="/docs/api/component.html" class="sidebar-link"> ‍ ‍ ‍ Component</a></li><li><a href="/docs/api/panels.html" class="sidebar-link">Panels</a></li><li><a href="/docs/api/pages.html" class="sidebar-link">Pages</a></li><li><a href="/docs/api/page.html" class="sidebar-link"> ‍ ‍ ‍ Page</a></li><li><a href="/docs/api/style_manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/api/storage_manager.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/api/device_manager.html" class="sidebar-link">Device Manager</a></li><li><a href="/docs/api/device.html" class="sidebar-link"> ‍ ‍ ‍ Device</a></li><li><a href="/docs/api/selector_manager.html" class="sidebar-link">Selector Manager</a></li><li><a href="/docs/api/css_composer.html" class="sidebar-link">CSS Composer</a></li><li><a href="/docs/api/css_rule.html" class="sidebar-link"> ‍ ‍ ‍ CssRule</a></li><li><a href="/docs/api/modal_dialog.html" class="sidebar-link">Modal</a></li><li><a href="/docs/api/rich_text_editor.html" class="sidebar-link">Rich Text Editor</a></li><li><a href="/docs/api/keymaps.html" class="sidebar-link">Keymaps</a></li><li><a href="/docs/api/undo_manager.html" aria-current="page" class="active sidebar-link">Undo Manager</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#undomanager" class="sidebar-link">UndoManager</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#getconfig" class="sidebar-link">getConfig</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#add" class="sidebar-link">add</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#remove" class="sidebar-link">remove</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#removeall" class="sidebar-link">removeAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#start" class="sidebar-link">start</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#stop" class="sidebar-link">stop</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#undo" class="sidebar-link">undo</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#undoall" class="sidebar-link">undoAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#redo" class="sidebar-link">redo</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#redoall" class="sidebar-link">redoAll</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#hasundo" class="sidebar-link">hasUndo</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#hasredo" class="sidebar-link">hasRedo</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#isregistered" class="sidebar-link">isRegistered</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#getstack" class="sidebar-link">getStack</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#getstackgroup" class="sidebar-link">getStackGroup</a></li><li class="sidebar-sub-header"><a href="/docs/api/undo_manager.html#clear" class="sidebar-link">clear</a></li></ul></li><li><a href="/docs/api/parser.html" class="sidebar-link">Parser</a></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h2 id="undomanager"><a href="#undomanager" class="header-anchor">#</a> UndoManager</h2> <p>This module allows to manage the stack of changes applied in canvas.
Once the editor is instantiated you can use its API. Before using these methods you should get the module from the instance</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> um <span class="token operator">=</span> editor<span class="token punctuation">.</span>UndoManager<span class="token punctuation">;</span> Once the editor is instantiated you can use its API. Before using these methods you should get the module from the instance</p> <div class="language-js extra-class"><pre class="language-js"><code><span class="token keyword">const</span> um <span class="token operator">=</span> editor<span class="token punctuation">.</span>UndoManager<span class="token punctuation">;</span>
</code></pre></div><ul><li><a href="#getconfig">getConfig</a></li> <li><a href="#add">add</a></li> <li><a href="#remove">remove</a></li> <li><a href="#removeall">removeAll</a></li> <li><a href="#start">start</a></li> <li><a href="#stop">stop</a></li> <li><a href="#undo">undo</a></li> <li><a href="#undoall">undoAll</a></li> <li><a href="#redo">redo</a></li> <li><a href="#redoall">redoAll</a></li> <li><a href="#hasundo">hasUndo</a></li> <li><a href="#hasredo">hasRedo</a></li> <li><a href="#getstack">getStack</a></li> <li><a href="#clear">clear</a></li></ul> <h2 id="getconfig"><a href="#getconfig" class="header-anchor">#</a> getConfig</h2> <p>Get module configurations</p> <h3 id="examples"><a href="#examples" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> config <span class="token operator">=</span> um<span class="token punctuation">.</span><span class="token function">getConfig</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span> </code></pre></div><ul><li><a href="#getconfig">getConfig</a></li> <li><a href="#add">add</a></li> <li><a href="#remove">remove</a></li> <li><a href="#removeall">removeAll</a></li> <li><a href="#start">start</a></li> <li><a href="#stop">stop</a></li> <li><a href="#undo">undo</a></li> <li><a href="#undoall">undoAll</a></li> <li><a href="#redo">redo</a></li> <li><a href="#redoall">redoAll</a></li> <li><a href="#hasundo">hasUndo</a></li> <li><a href="#hasredo">hasRedo</a></li> <li><a href="#getstack">getStack</a></li> <li><a href="#clear">clear</a></li></ul> <h2 id="getconfig"><a href="#getconfig" class="header-anchor">#</a> getConfig</h2> <p>Get module configurations</p> <h3 id="examples"><a href="#examples" class="header-anchor">#</a> Examples</h3> <div class="language-javascript extra-class"><pre class="language-javascript"><code><span class="token keyword">const</span> config <span class="token operator">=</span> um<span class="token punctuation">.</span><span class="token function">getConfig</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token comment">// { ... }</span> <span class="token comment">// { ... }</span>
@ -63,7 +63,11 @@ inserted component will be returned in the list) by returning an array length of
← ←
<a href="/docs/api/keymaps.html" class="prev"> <a href="/docs/api/keymaps.html" class="prev">
Keymaps Keymaps
</a></span> <!----></p></div> </main></div><div class="global-ui"></div></div> </a></span> <span class="next"><a href="/docs/api/parser.html">
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/41.3352d1b5.js" defer></script> Parser
</a>
→
</span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/45.ba1f8509.js" defer></script>
</body> </body>
</html> </html>

2
docs/assets/js/10.bc8d26ba.js → docs/assets/js/10.5820b83e.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/11.e4a5286f.js → docs/assets/js/11.b63b354b.js

@ -1 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[11,13],{310:function(t,n,e){},313:function(t,n,e){"use strict";e(310)},347:function(t,n,e){"use strict";e.r(n);var a={render:function(t){return t("div",{class:"carbon-ads",attrs:{id:"native-carbon"}})},mounted:function(){window.BSANativeCallback=function(t){if(!t.ads.length){var n=document.createElement("script");n.src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=grapesjscom",n.setAttribute("id","_carbonads_js");var e=document.getElementById("native-carbon");e&&e.appendChild(n)}},this.load()},watch:{$route:function(t,n){t.path!==n.path&&this.$el.querySelector("#carbonads")&&(this.$el.innerHTML="",this.load())}},methods:{initCarbon:function(){var t=window._bsa;void 0!==t&&t&&t.init("default","CK7I62QJ","placement:grapesjscomdocs",{target:"#native-carbon"})},load:function(){var t=this,n=document.createElement("script");n.src="//m.servedby-buysellads.com/monetization.js",n.onload=function(){return t.initCarbon()},this.$el.appendChild(n)}}},o=(e(313),e(44)),i=Object(o.a)(a,void 0,void 0,!1,null,null,null);n.default=i.exports},428:function(t,n,e){"use strict";e.r(n);var a=e(383),o=e(347),i={components:{Layout:a.a,CarbonAds:o.default}},r=e(44),s=Object(r.a)(i,(function(){var t=this.$createElement,n=this._self._c||t;return n("Layout",[n("CarbonAds",{attrs:{slot:"sidebar-top"},slot:"sidebar-top"})],1)}),[],!1,null,null,null);n.default=s.exports}}]); (window.webpackJsonp=window.webpackJsonp||[]).push([[11,13],{310:function(t,n,e){},313:function(t,n,e){"use strict";e(310)},347:function(t,n,e){"use strict";e.r(n);var a={render:function(t){return t("div",{class:"carbon-ads",attrs:{id:"native-carbon"}})},mounted:function(){window.BSANativeCallback=function(t){if(!t.ads.length){var n=document.createElement("script");n.src="//cdn.carbonads.com/carbon.js?zoneid=1673&serve=C6AILKT&placement=grapesjscom",n.setAttribute("id","_carbonads_js");var e=document.getElementById("native-carbon");e&&e.appendChild(n)}},this.load()},watch:{$route:function(t,n){t.path!==n.path&&this.$el.querySelector("#carbonads")&&(this.$el.innerHTML="",this.load())}},methods:{initCarbon:function(){var t=window._bsa;void 0!==t&&t&&t.init("default","CK7I62QJ","placement:grapesjscomdocs",{target:"#native-carbon"})},load:function(){var t=this,n=document.createElement("script");n.src="//m.servedby-buysellads.com/monetization.js",n.onload=function(){return t.initCarbon()},this.$el.appendChild(n)}}},o=(e(313),e(44)),i=Object(o.a)(a,void 0,void 0,!1,null,null,null);n.default=i.exports},432:function(t,n,e){"use strict";e.r(n);var a=e(383),o=e(347),i={components:{Layout:a.a,CarbonAds:o.default}},r=e(44),s=Object(r.a)(i,(function(){var t=this.$createElement,n=this._self._c||t;return n("Layout",[n("CarbonAds",{attrs:{slot:"sidebar-top"},slot:"sidebar-top"})],1)}),[],!1,null,null,null);n.default=s.exports}}]);

2
docs/assets/js/12.05f31234.js → docs/assets/js/12.0c4d869b.js

@ -1 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[12],{333:function(t,n,e){},371:function(t,n,e){"use strict";e(333)},435:function(t,n,e){"use strict";e.r(n);e(371);var s=e(44),i=Object(s.a)({},(function(){var t=this.$createElement;return(this._self._c||t)("div",{staticClass:"demo-container"},[this._t("default")],2)}),[],!1,null,"b3715568",null);n.default=i.exports}}]); (window.webpackJsonp=window.webpackJsonp||[]).push([[12],{333:function(t,n,e){},371:function(t,n,e){"use strict";e(333)},439:function(t,n,e){"use strict";e.r(n);e(371);var s=e(44),i=Object(s.a)({},(function(){var t=this.$createElement;return(this._self._c||t)("div",{staticClass:"demo-container"},[this._t("default")],2)}),[],!1,null,"b3715568",null);n.default=i.exports}}]);

2
docs/assets/js/14.21fd784c.js → docs/assets/js/14.5f22df6b.js

@ -1 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[14],{342:function(t,e,n){},380:function(t,e,n){"use strict";n(342)},436:function(t,e,n){"use strict";n.r(e);var i={functional:!0,props:{type:{type:String,default:"tip"},text:String,vertical:{type:String,default:"top"}},render:function(t,e){var n=e.props,i=e.slots;return t("span",{class:["badge",n.type],style:{verticalAlign:n.vertical}},n.text||i().default)}},r=(n(380),n(44)),p=Object(r.a)(i,void 0,void 0,!1,null,"15b7b770",null);e.default=p.exports}}]); (window.webpackJsonp=window.webpackJsonp||[]).push([[14],{342:function(t,e,n){},380:function(t,e,n){"use strict";n(342)},440:function(t,e,n){"use strict";n.r(e);var i={functional:!0,props:{type:{type:String,default:"tip"},text:String,vertical:{type:String,default:"top"}},render:function(t,e){var n=e.props,i=e.slots;return t("span",{class:["badge",n.type],style:{verticalAlign:n.vertical}},n.text||i().default)}},r=(n(380),n(44)),p=Object(r.a)(i,void 0,void 0,!1,null,"15b7b770",null);e.default=p.exports}}]);

2
docs/assets/js/15.8026aa70.js → docs/assets/js/15.4abef4d7.js

@ -1 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[15],{343:function(t,e,a){},381:function(t,e,a){"use strict";a(343)},422:function(t,e,a){"use strict";a.r(e);var n={name:"CodeBlock",props:{title:{type:String,required:!0},active:{type:Boolean,default:!1}},mounted:function(){this.$parent&&this.$parent.loadTabs&&this.$parent.loadTabs()}},i=(a(381),a(44)),s=Object(i.a)(n,(function(){var t=this.$createElement;return(this._self._c||t)("div",{staticClass:"theme-code-block",class:{"theme-code-block__active":this.active}},[this._t("default")],2)}),[],!1,null,"759a7d02",null);e.default=s.exports}}]); (window.webpackJsonp=window.webpackJsonp||[]).push([[15],{343:function(t,e,a){},381:function(t,e,a){"use strict";a(343)},426:function(t,e,a){"use strict";a.r(e);var n={name:"CodeBlock",props:{title:{type:String,required:!0},active:{type:Boolean,default:!1}},mounted:function(){this.$parent&&this.$parent.loadTabs&&this.$parent.loadTabs()}},i=(a(381),a(44)),s=Object(i.a)(n,(function(){var t=this.$createElement;return(this._self._c||t)("div",{staticClass:"theme-code-block",class:{"theme-code-block__active":this.active}},[this._t("default")],2)}),[],!1,null,"759a7d02",null);e.default=s.exports}}]);

2
docs/assets/js/16.5365d48a.js → docs/assets/js/16.86ce4521.js

@ -1 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[16],{344:function(e,t,a){},382:function(e,t,a){"use strict";a(344)},423:function(e,t,a){"use strict";a.r(t);a(66),a(27),a(95),a(96);var o={name:"CodeGroup",data:function(){return{codeTabs:[],activeCodeTabIndex:-1}},watch:{activeCodeTabIndex:function(e){this.activateCodeTab(e)}},mounted:function(){this.loadTabs()},methods:{changeCodeTab:function(e){this.activeCodeTabIndex=e},loadTabs:function(){var e=this;this.codeTabs=(this.$slots.default||[]).filter((function(e){return Boolean(e.componentOptions)})).map((function(t,a){return""===t.componentOptions.propsData.active&&(e.activeCodeTabIndex=a),{title:t.componentOptions.propsData.title,elm:t.elm}})),-1===this.activeCodeTabIndex&&this.codeTabs.length>0&&(this.activeCodeTabIndex=0),this.activateCodeTab(0)},activateCodeTab:function(e){this.codeTabs.forEach((function(e){e.elm&&e.elm.classList.remove("theme-code-block__active")})),this.codeTabs[e].elm&&this.codeTabs[e].elm.classList.add("theme-code-block__active")}}},n=(a(382),a(44)),c=Object(n.a)(o,(function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("ClientOnly",[a("div",{staticClass:"theme-code-group"},[a("div",{staticClass:"theme-code-group__nav"},[a("ul",{staticClass:"theme-code-group__ul"},e._l(e.codeTabs,(function(t,o){return a("li",{key:t.title,staticClass:"theme-code-group__li"},[a("button",{staticClass:"theme-code-group__nav-tab",class:{"theme-code-group__nav-tab-active":o===e.activeCodeTabIndex},on:{click:function(t){return e.changeCodeTab(o)}}},[e._v("\n "+e._s(t.title)+"\n ")])])})),0)]),e._v(" "),e._t("default"),e._v(" "),e.codeTabs.length<1?a("pre",{staticClass:"pre-blank"},[e._v("// Make sure to add code blocks to your code group")]):e._e()],2)])}),[],!1,null,"deefee04",null);t.default=c.exports}}]); (window.webpackJsonp=window.webpackJsonp||[]).push([[16],{344:function(e,t,a){},382:function(e,t,a){"use strict";a(344)},427:function(e,t,a){"use strict";a.r(t);a(66),a(27),a(95),a(96);var o={name:"CodeGroup",data:function(){return{codeTabs:[],activeCodeTabIndex:-1}},watch:{activeCodeTabIndex:function(e){this.activateCodeTab(e)}},mounted:function(){this.loadTabs()},methods:{changeCodeTab:function(e){this.activeCodeTabIndex=e},loadTabs:function(){var e=this;this.codeTabs=(this.$slots.default||[]).filter((function(e){return Boolean(e.componentOptions)})).map((function(t,a){return""===t.componentOptions.propsData.active&&(e.activeCodeTabIndex=a),{title:t.componentOptions.propsData.title,elm:t.elm}})),-1===this.activeCodeTabIndex&&this.codeTabs.length>0&&(this.activeCodeTabIndex=0),this.activateCodeTab(0)},activateCodeTab:function(e){this.codeTabs.forEach((function(e){e.elm&&e.elm.classList.remove("theme-code-block__active")})),this.codeTabs[e].elm&&this.codeTabs[e].elm.classList.add("theme-code-block__active")}}},n=(a(382),a(44)),c=Object(n.a)(o,(function(){var e=this,t=e.$createElement,a=e._self._c||t;return a("ClientOnly",[a("div",{staticClass:"theme-code-group"},[a("div",{staticClass:"theme-code-group__nav"},[a("ul",{staticClass:"theme-code-group__ul"},e._l(e.codeTabs,(function(t,o){return a("li",{key:t.title,staticClass:"theme-code-group__li"},[a("button",{staticClass:"theme-code-group__nav-tab",class:{"theme-code-group__nav-tab-active":o===e.activeCodeTabIndex},on:{click:function(t){return e.changeCodeTab(o)}}},[e._v("\n "+e._s(t.title)+"\n ")])])})),0)]),e._v(" "),e._t("default"),e._v(" "),e.codeTabs.length<1?a("pre",{staticClass:"pre-blank"},[e._v("// Make sure to add code blocks to your code group")]):e._e()],2)])}),[],!1,null,"deefee04",null);t.default=c.exports}}]);

2
docs/assets/js/17.16a899b7.js → docs/assets/js/17.f46590a7.js

@ -1 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[17],{424:function(e,t,r){"use strict";r.r(t);r(173);var s={name:"DemoViewer",props:{value:{type:String,default:""},user:{type:String,default:"artur_arseniev"},width:{type:String,default:"100%"},height:{type:String,default:"300"}},computed:{src:function(){var e=this.value,t=this.user;return"//jsfiddle.net/".concat(t,"/").concat(e,"/embedded/js,html,css,result")}}},i=r(44),n=Object(i.a)(s,(function(){var e=this.$createElement;return(this._self._c||e)("iframe",{attrs:{width:this.width,height:this.height,src:this.src,allowfullscreen:"allowfullscreen",frameborder:"0"}})}),[],!1,null,null,null);t.default=n.exports}}]); (window.webpackJsonp=window.webpackJsonp||[]).push([[17],{428:function(e,t,r){"use strict";r.r(t);r(173);var s={name:"DemoViewer",props:{value:{type:String,default:""},user:{type:String,default:"artur_arseniev"},width:{type:String,default:"100%"},height:{type:String,default:"300"}},computed:{src:function(){var e=this.value,t=this.user;return"//jsfiddle.net/".concat(t,"/").concat(e,"/embedded/js,html,css,result")}}},i=r(44),n=Object(i.a)(s,(function(){var e=this.$createElement;return(this._self._c||e)("iframe",{attrs:{width:this.width,height:this.height,src:this.src,allowfullscreen:"allowfullscreen",frameborder:"0"}})}),[],!1,null,null,null);t.default=n.exports}}]);

2
docs/assets/js/18.2b682096.js → docs/assets/js/18.7cde108a.js

@ -1 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[18],{431:function(t,e,s){"use strict";s.r(e);var n=["There's nothing here.","How did we get here?","That's a Four-Oh-Four.","Looks like we've got some broken links."],o={methods:{getMsg:function(){return n[Math.floor(Math.random()*n.length)]}}},i=s(44),h=Object(i.a)(o,(function(){var t=this.$createElement,e=this._self._c||t;return e("div",{staticClass:"theme-container"},[e("div",{staticClass:"theme-default-content"},[e("h1",[this._v("404")]),this._v(" "),e("blockquote",[this._v(this._s(this.getMsg()))]),this._v(" "),e("RouterLink",{attrs:{to:"/"}},[this._v("\n Take me home.\n ")])],1)])}),[],!1,null,null,null);e.default=h.exports}}]); (window.webpackJsonp=window.webpackJsonp||[]).push([[18],{435:function(t,e,s){"use strict";s.r(e);var n=["There's nothing here.","How did we get here?","That's a Four-Oh-Four.","Looks like we've got some broken links."],o={methods:{getMsg:function(){return n[Math.floor(Math.random()*n.length)]}}},i=s(44),h=Object(i.a)(o,(function(){var t=this.$createElement,e=this._self._c||t;return e("div",{staticClass:"theme-container"},[e("div",{staticClass:"theme-default-content"},[e("h1",[this._v("404")]),this._v(" "),e("blockquote",[this._v(this._s(this.getMsg()))]),this._v(" "),e("RouterLink",{attrs:{to:"/"}},[this._v("\n Take me home.\n ")])],1)])}),[],!1,null,null,null);e.default=h.exports}}]);

2
docs/assets/js/19.c8bf26af.js → docs/assets/js/19.c63f93b9.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/20.7ee8a470.js → docs/assets/js/20.20d84c7c.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/21.80a868df.js → docs/assets/js/21.2bcebecd.js

@ -1 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[21],{447:function(t,e,s){"use strict";s.r(e);var a=s(44),o=Object(a.a)({},(function(){var t=this.$createElement,e=this._self._c||t;return e("ContentSlotsDistributor",{attrs:{"slot-key":this.$parent.slotKey}},[e("h1",{attrs:{id:"api-reference"}},[e("a",{staticClass:"header-anchor",attrs:{href:"#api-reference"}},[this._v("#")]),this._v(" API Reference")]),this._v(" "),e("p",[this._v("Here you can find the documentation about GrapesJS' APIs. Mainly, you would use them for your editor to extend the basic functionality of the framework or you could also "),e("RouterLink",{attrs:{to:"/modules/Plugins.html"}},[this._v("create a plugin")]),this._v(" and make those extensions reusable and available to others.")],1)])}),[],!1,null,null,null);e.default=o.exports}}]); (window.webpackJsonp=window.webpackJsonp||[]).push([[21],{455:function(t,e,s){"use strict";s.r(e);var a=s(44),o=Object(a.a)({},(function(){var t=this.$createElement,e=this._self._c||t;return e("ContentSlotsDistributor",{attrs:{"slot-key":this.$parent.slotKey}},[e("h1",{attrs:{id:"api-reference"}},[e("a",{staticClass:"header-anchor",attrs:{href:"#api-reference"}},[this._v("#")]),this._v(" API Reference")]),this._v(" "),e("p",[this._v("Here you can find the documentation about GrapesJS' APIs. Mainly, you would use them for your editor to extend the basic functionality of the framework or you could also "),e("RouterLink",{attrs:{to:"/modules/Plugins.html"}},[this._v("create a plugin")]),this._v(" and make those extensions reusable and available to others.")],1)])}),[],!1,null,null,null);e.default=o.exports}}]);

2
docs/assets/js/22.b1817aaa.js → docs/assets/js/22.9198d9a9.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/23.173c6f11.js

@ -0,0 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[23],{460:function(e,t,r){"use strict";r.r(t);var o=r(44),n=Object(o.a)({},(function(){var e=this,t=e.$createElement,r=e._self._c||t;return r("ContentSlotsDistributor",{attrs:{"slot-key":e.$parent.slotKey}},[r("h2",{attrs:{id:"block"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#block"}},[e._v("#")]),e._v(" Block")]),e._v(" "),r("h3",{attrs:{id:"properties"}},[r("a",{staticClass:"header-anchor",attrs:{href:"#properties"}},[e._v("#")]),e._v(" Properties")]),e._v(" "),r("ul",[r("li",[r("code",[e._v("label")]),e._v(" "),r("strong",[r("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String",target:"_blank",rel:"noopener noreferrer"}},[e._v("String"),r("OutboundLink")],1)]),e._v(" Block label, eg. "),r("code",[e._v("My block")])]),e._v(" "),r("li",[r("code",[e._v("content")]),e._v(" "),r("strong",[e._v("("),r("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String",target:"_blank",rel:"noopener noreferrer"}},[e._v("String"),r("OutboundLink")],1),e._v(" | "),r("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object",target:"_blank",rel:"noopener noreferrer"}},[e._v("Object"),r("OutboundLink")],1),e._v(")")]),e._v(" The content of the block. Might be an HTML string or a "),r("RouterLink",{attrs:{to:"/modules/Components.html#component-definition"}},[e._v("Component Defintion")])],1),e._v(" "),r("li",[r("code",[e._v("media")]),e._v(" "),r("strong",[r("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String",target:"_blank",rel:"noopener noreferrer"}},[e._v("String"),r("OutboundLink")],1),e._v("?")]),e._v(" HTML string for the media/icon of the block, eg. "),r("code",[e._v("<svg ...")]),e._v(", "),r("code",[e._v("<img ...")]),e._v(", etc.")]),e._v(" "),r("li",[r("code",[e._v("category")]),e._v(" "),r("strong",[r("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String",target:"_blank",rel:"noopener noreferrer"}},[e._v("String"),r("OutboundLink")],1),e._v("?")]),e._v(" Block category")]),e._v(" "),r("li",[r("code",[e._v("activate")]),e._v(" "),r("strong",[r("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean",target:"_blank",rel:"noopener noreferrer"}},[e._v("Boolean"),r("OutboundLink")],1),e._v("?")]),e._v(" If true, triggers an the "),r("code",[e._v("active")]),e._v(" event on dropped component")]),e._v(" "),r("li",[r("code",[e._v("select")]),e._v(" "),r("strong",[r("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean",target:"_blank",rel:"noopener noreferrer"}},[e._v("Boolean"),r("OutboundLink")],1),e._v("?")]),e._v(" If true, the dropped component will be selected")]),e._v(" "),r("li",[r("code",[e._v("resetId")]),e._v(" "),r("strong",[r("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean",target:"_blank",rel:"noopener noreferrer"}},[e._v("Boolean"),r("OutboundLink")],1),e._v("?")]),e._v(" If true, all IDs of dropped components and their styles will be changed")]),e._v(" "),r("li",[r("code",[e._v("disable")]),e._v(" "),r("strong",[r("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean",target:"_blank",rel:"noopener noreferrer"}},[e._v("Boolean"),r("OutboundLink")],1),e._v("?")]),e._v(" Disable the block from being interacted")]),e._v(" "),r("li",[r("code",[e._v("onClick")]),e._v(" "),r("strong",[r("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Statements/function",target:"_blank",rel:"noopener noreferrer"}},[e._v("Function"),r("OutboundLink")],1),e._v("?")]),e._v(" Custom behavior on click, eg. "),r("code",[e._v("(block, editor) => editor.getWrapper().append(block.get('content'))")])]),e._v(" "),r("li",[r("code",[e._v("attributes")]),e._v(" "),r("strong",[r("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object",target:"_blank",rel:"noopener noreferrer"}},[e._v("Object"),r("OutboundLink")],1),e._v("?")]),e._v(" Block attributes to apply in the view element")])])])}),[],!1,null,null,null);t.default=n.exports}}]);

1
docs/assets/js/23.24b1a9f0.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/24.0b14d393.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/24.5f532ac1.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/25.4b4e28f3.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/26.5a4f24ff.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/25.a736d8ee.js → docs/assets/js/26.a2eb9e5a.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/27.a94bbf50.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/27.f3b530ab.js → docs/assets/js/28.53799e93.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/29.0534d4fc.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/28.f3e302a2.js → docs/assets/js/29.d4b56a92.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/3.9c33fa00.js → docs/assets/js/3.e2d18c88.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/30.91585127.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/30.bcd6c9ba.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/31.351ea798.js

@ -0,0 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[31],{481:function(e,r,t){"use strict";t.r(r);var o=t(44),i=Object(o.a)({},(function(){var e=this,r=e.$createElement,t=e._self._c||r;return t("ContentSlotsDistributor",{attrs:{"slot-key":e.$parent.slotKey}},[t("h2",{attrs:{id:"device"}},[t("a",{staticClass:"header-anchor",attrs:{href:"#device"}},[e._v("#")]),e._v(" Device")]),e._v(" "),t("h3",{attrs:{id:"properties"}},[t("a",{staticClass:"header-anchor",attrs:{href:"#properties"}},[e._v("#")]),e._v(" Properties")]),e._v(" "),t("ul",[t("li",[t("code",[e._v("name")]),e._v(" "),t("strong",[t("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String",target:"_blank",rel:"noopener noreferrer"}},[e._v("String"),t("OutboundLink")],1),e._v("?")]),e._v(" Device type, eg. "),t("code",[e._v("Mobile")])]),e._v(" "),t("li",[t("code",[e._v("width")]),e._v(" "),t("strong",[t("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String",target:"_blank",rel:"noopener noreferrer"}},[e._v("String"),t("OutboundLink")],1),e._v("?")]),e._v(" Width to set for the editor iframe, eg. '900px'")]),e._v(" "),t("li",[t("code",[e._v("height")]),e._v(" "),t("strong",[t("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String",target:"_blank",rel:"noopener noreferrer"}},[e._v("String"),t("OutboundLink")],1),e._v("?")]),e._v(" Height to set for the editor iframe, eg. '600px'")]),e._v(" "),t("li",[t("code",[e._v("widthMedia")]),e._v(" "),t("strong",[t("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String",target:"_blank",rel:"noopener noreferrer"}},[e._v("String"),t("OutboundLink")],1),e._v("?")]),e._v(" The width which will be used in media queries, If empty the width will be used")]),e._v(" "),t("li",[t("code",[e._v("priority")]),e._v(" "),t("strong",[t("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number",target:"_blank",rel:"noopener noreferrer"}},[e._v("Number"),t("OutboundLink")],1),e._v("?")]),e._v(" Setup the order of media queries")])])])}),[],!1,null,null,null);r.default=i.exports}}]);

1
docs/assets/js/32.405cce15.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/33.0061376c.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/31.58e6a8d0.js → docs/assets/js/34.9fc51478.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/32.9ea68a19.js → docs/assets/js/35.1358dcad.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/35.ee386620.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/33.83a74dc0.js → docs/assets/js/36.4efd224f.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/34.5195e151.js → docs/assets/js/37.bb7369c2.js

@ -1 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[34],{439:function(t,a,s){"use strict";s.r(a);var e=s(44),n=Object(e.a)({},(function(){var t=this,a=t.$createElement,s=t._self._c||a;return s("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[s("h2",{attrs:{id:"getallframes"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#getallframes"}},[t._v("#")]),t._v(" getAllFrames")]),t._v(" "),s("p",[t._v("Get all frames")]),t._v(" "),s("h3",{attrs:{id:"examples"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#examples"}},[t._v("#")]),t._v(" Examples")]),t._v(" "),s("div",{staticClass:"language-javascript extra-class"},[s("pre",{pre:!0,attrs:{class:"language-javascript"}},[s("code",[s("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" arrayOfFrames "),s("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" page"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),s("span",{pre:!0,attrs:{class:"token function"}},[t._v("getAllFrames")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),s("p",[t._v("Returns "),s("strong",[s("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array",target:"_blank",rel:"noopener noreferrer"}},[t._v("Array"),s("OutboundLink")],1),t._v("<Frame>")])]),t._v(" "),s("h2",{attrs:{id:"getmainframe"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#getmainframe"}},[t._v("#")]),t._v(" getMainFrame")]),t._v(" "),s("p",[t._v("Get the first frame of the page (identified always as the main one)")]),t._v(" "),s("h3",{attrs:{id:"examples-2"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#examples-2"}},[t._v("#")]),t._v(" Examples")]),t._v(" "),s("div",{staticClass:"language-javascript extra-class"},[s("pre",{pre:!0,attrs:{class:"language-javascript"}},[s("code",[s("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" mainFrame "),s("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" page"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),s("span",{pre:!0,attrs:{class:"token function"}},[t._v("getMainFrame")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),s("p",[t._v("Returns "),s("strong",[t._v("Frame")])]),t._v(" "),s("h2",{attrs:{id:"getmaincomponent"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#getmaincomponent"}},[t._v("#")]),t._v(" getMainComponent")]),t._v(" "),s("p",[t._v("Get the root component (usually is the "),s("code",[t._v("wrapper")]),t._v(" component) from the main frame")]),t._v(" "),s("h3",{attrs:{id:"examples-3"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#examples-3"}},[t._v("#")]),t._v(" Examples")]),t._v(" "),s("div",{staticClass:"language-javascript extra-class"},[s("pre",{pre:!0,attrs:{class:"language-javascript"}},[s("code",[s("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" rootComponent "),s("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" page"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),s("span",{pre:!0,attrs:{class:"token function"}},[t._v("getMainComponent")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\nconsole"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),s("span",{pre:!0,attrs:{class:"token function"}},[t._v("log")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("rootComponent"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),s("span",{pre:!0,attrs:{class:"token function"}},[t._v("toHTML")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),s("p",[t._v("Returns "),s("strong",[t._v("Component")])])])}),[],!1,null,null,null);a.default=n.exports}}]); (window.webpackJsonp=window.webpackJsonp||[]).push([[37],{445:function(t,a,s){"use strict";s.r(a);var e=s(44),n=Object(e.a)({},(function(){var t=this,a=t.$createElement,s=t._self._c||a;return s("ContentSlotsDistributor",{attrs:{"slot-key":t.$parent.slotKey}},[s("h2",{attrs:{id:"getallframes"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#getallframes"}},[t._v("#")]),t._v(" getAllFrames")]),t._v(" "),s("p",[t._v("Get all frames")]),t._v(" "),s("h3",{attrs:{id:"examples"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#examples"}},[t._v("#")]),t._v(" Examples")]),t._v(" "),s("div",{staticClass:"language-javascript extra-class"},[s("pre",{pre:!0,attrs:{class:"language-javascript"}},[s("code",[s("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" arrayOfFrames "),s("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" page"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),s("span",{pre:!0,attrs:{class:"token function"}},[t._v("getAllFrames")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),s("p",[t._v("Returns "),s("strong",[s("a",{attrs:{href:"https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array",target:"_blank",rel:"noopener noreferrer"}},[t._v("Array"),s("OutboundLink")],1),t._v("<Frame>")])]),t._v(" "),s("h2",{attrs:{id:"getmainframe"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#getmainframe"}},[t._v("#")]),t._v(" getMainFrame")]),t._v(" "),s("p",[t._v("Get the first frame of the page (identified always as the main one)")]),t._v(" "),s("h3",{attrs:{id:"examples-2"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#examples-2"}},[t._v("#")]),t._v(" Examples")]),t._v(" "),s("div",{staticClass:"language-javascript extra-class"},[s("pre",{pre:!0,attrs:{class:"language-javascript"}},[s("code",[s("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" mainFrame "),s("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" page"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),s("span",{pre:!0,attrs:{class:"token function"}},[t._v("getMainFrame")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),s("p",[t._v("Returns "),s("strong",[t._v("Frame")])]),t._v(" "),s("h2",{attrs:{id:"getmaincomponent"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#getmaincomponent"}},[t._v("#")]),t._v(" getMainComponent")]),t._v(" "),s("p",[t._v("Get the root component (usually is the "),s("code",[t._v("wrapper")]),t._v(" component) from the main frame")]),t._v(" "),s("h3",{attrs:{id:"examples-3"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#examples-3"}},[t._v("#")]),t._v(" Examples")]),t._v(" "),s("div",{staticClass:"language-javascript extra-class"},[s("pre",{pre:!0,attrs:{class:"language-javascript"}},[s("code",[s("span",{pre:!0,attrs:{class:"token keyword"}},[t._v("const")]),t._v(" rootComponent "),s("span",{pre:!0,attrs:{class:"token operator"}},[t._v("=")]),t._v(" page"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),s("span",{pre:!0,attrs:{class:"token function"}},[t._v("getMainComponent")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\nconsole"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),s("span",{pre:!0,attrs:{class:"token function"}},[t._v("log")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),t._v("rootComponent"),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(".")]),s("span",{pre:!0,attrs:{class:"token function"}},[t._v("toHTML")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v("(")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(")")]),s("span",{pre:!0,attrs:{class:"token punctuation"}},[t._v(";")]),t._v("\n")])])]),s("p",[t._v("Returns "),s("strong",[t._v("Component")])])])}),[],!1,null,null,null);a.default=n.exports}}]);

1
docs/assets/js/38.b6076463.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/36.3c04f1d9.js → docs/assets/js/39.a5db70a9.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/4.f31d6c5b.js → docs/assets/js/4.f5f74e88.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/40.b08cabb1.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/37.29e16f9c.js → docs/assets/js/41.85377700.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/38.5d32b029.js → docs/assets/js/42.be31a4a9.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/39.9a58de40.js → docs/assets/js/43.5e16fa84.js

File diff suppressed because one or more lines are too long

1
docs/assets/js/43.a4256f15.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/40.8e6d589e.js → docs/assets/js/44.5ab27d40.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/41.3352d1b5.js → docs/assets/js/45.ba1f8509.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/42.57cce0c6.js → docs/assets/js/46.d147024c.js

@ -1 +1 @@
(window.webpackJsonp=window.webpackJsonp||[]).push([[42],{462:function(t,s,e){"use strict";e.r(s);var n=e(44),a=Object(n.a)({},(function(){var t=this.$createElement,s=this._self._c||t;return s("ContentSlotsDistributor",{attrs:{"slot-key":this.$parent.slotKey}},[s("h1",{attrs:{id:"faq"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#faq"}},[this._v("#")]),this._v(" FAQ")]),this._v(" "),s("p",[this._v("Coming soon")])])}),[],!1,null,null,null);s.default=a.exports}}]); (window.webpackJsonp=window.webpackJsonp||[]).push([[46],{468:function(t,s,e){"use strict";e.r(s);var n=e(44),a=Object(n.a)({},(function(){var t=this.$createElement,s=this._self._c||t;return s("ContentSlotsDistributor",{attrs:{"slot-key":this.$parent.slotKey}},[s("h1",{attrs:{id:"faq"}},[s("a",{staticClass:"header-anchor",attrs:{href:"#faq"}},[this._v("#")]),this._v(" FAQ")]),this._v(" "),s("p",[this._v("Coming soon")])])}),[],!1,null,null,null);s.default=a.exports}}]);

1
docs/assets/js/47.e0d1eca1.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/44.c05e59f9.js → docs/assets/js/48.e7d820a6.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/45.3e7d2ba2.js → docs/assets/js/49.f98ef45a.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/5.a0dda975.js → docs/assets/js/5.08e37066.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/46.c362554c.js → docs/assets/js/50.d45266e9.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/47.a5e549f1.js → docs/assets/js/51.e5e038d0.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/48.2e375343.js → docs/assets/js/52.6dcd0cb9.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/49.88dd7cce.js → docs/assets/js/53.66298f37.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/50.c459c2cb.js → docs/assets/js/54.e070b389.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/51.47c12f8d.js → docs/assets/js/55.bdd09571.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/52.334fdb25.js → docs/assets/js/56.ca1aa9c3.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/53.ec424eac.js → docs/assets/js/57.5ab02891.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/54.91803c3a.js → docs/assets/js/58.8854dd6f.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/55.266c6160.js → docs/assets/js/59.7fed6525.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/6.f7435f21.js → docs/assets/js/6.703956f1.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/7.cf6e89f4.js → docs/assets/js/7.42f8bf76.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/8.904f276f.js → docs/assets/js/8.01db2cd4.js

File diff suppressed because one or more lines are too long

2
docs/assets/js/9.acf071b7.js → docs/assets/js/9.22dace02.js

File diff suppressed because one or more lines are too long

8
docs/assets/js/app.36495a81.js

File diff suppressed because one or more lines are too long

8
docs/assets/js/app.69ef2787.js

File diff suppressed because one or more lines are too long

6
docs/faq.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/42.57cce0c6.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/46.d147024c.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -35,6 +35,6 @@
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link"> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></div> <a href="https://github.com/artf/grapesjs" target="_blank" rel="noopener noreferrer" class="repo-link">
GitHub GitHub
<span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/" aria-current="page" class="sidebar-link">Introduction</a></li><li><a href="/docs/getting-started.html" class="sidebar-link">Getting Started</a></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>Modules</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/docs/modules/Assets.html" class="sidebar-link">Assets</a></li><li><a href="/docs/modules/Blocks.html" class="sidebar-link">Blocks</a></li><li><a href="/docs/modules/Commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/modules/Components.html" class="sidebar-link">Components</a></li><li><a href="/docs/modules/Components-js.html" class="sidebar-link">Components &amp; JS</a></li><li><a href="/docs/modules/I18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/modules/Traits.html" class="sidebar-link">Traits</a></li><li><a href="/docs/modules/Style-manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/modules/Storage.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/modules/Plugins.html" class="sidebar-link">Plugins</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>Guides</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/docs/guides/Replace-Rich-Text-Editor.html" class="sidebar-link">Replace Rich Text Editor</a></li><li><a href="/docs/guides/Custom-CSS-parser.html" class="sidebar-link">Use Custom CSS Parser</a></li></ul></section></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="faq"><a href="#faq" class="header-anchor">#</a> FAQ</h1> <p>Coming soon</p></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/faq.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">7/9/2018, 12:48:25 AM</span></div></footer> <!----> </main></div><div class="global-ui"></div></div> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></a></nav> <div id="native-carbon" class="carbon-ads"></div> <ul class="sidebar-links"><li><a href="/docs/" aria-current="page" class="sidebar-link">Introduction</a></li><li><a href="/docs/getting-started.html" class="sidebar-link">Getting Started</a></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>Modules</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/docs/modules/Assets.html" class="sidebar-link">Assets</a></li><li><a href="/docs/modules/Blocks.html" class="sidebar-link">Blocks</a></li><li><a href="/docs/modules/Commands.html" class="sidebar-link">Commands</a></li><li><a href="/docs/modules/Components.html" class="sidebar-link">Components</a></li><li><a href="/docs/modules/Components-js.html" class="sidebar-link">Components &amp; JS</a></li><li><a href="/docs/modules/I18n.html" class="sidebar-link">I18n</a></li><li><a href="/docs/modules/Traits.html" class="sidebar-link">Traits</a></li><li><a href="/docs/modules/Style-manager.html" class="sidebar-link">Style Manager</a></li><li><a href="/docs/modules/Storage.html" class="sidebar-link">Storage Manager</a></li><li><a href="/docs/modules/Plugins.html" class="sidebar-link">Plugins</a></li></ul></section></li><li><section class="sidebar-group depth-0"><p class="sidebar-heading"><span>Guides</span> <!----></p> <ul class="sidebar-links sidebar-group-items"><li><a href="/docs/guides/Replace-Rich-Text-Editor.html" class="sidebar-link">Replace Rich Text Editor</a></li><li><a href="/docs/guides/Custom-CSS-parser.html" class="sidebar-link">Use Custom CSS Parser</a></li></ul></section></li></ul> </aside> <main class="page"> <div class="theme-default-content content__default"><h1 id="faq"><a href="#faq" class="header-anchor">#</a> FAQ</h1> <p>Coming soon</p></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/faq.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">7/9/2018, 12:48:25 AM</span></div></footer> <!----> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/42.57cce0c6.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/46.d147024c.js" defer></script>
</body> </body>
</html> </html>

10
docs/getting-started.html

@ -10,8 +10,8 @@
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<meta name="keywords" content="grapesjs getting started"> <meta name="keywords" content="grapesjs getting started">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/43.a4256f15.js" as="script"><link rel="preload" href="/docs/assets/js/12.05f31234.js" as="script"><link rel="preload" href="/docs/assets/js/4.f31d6c5b.js" as="script"><link rel="preload" href="/docs/assets/js/3.9c33fa00.js" as="script"><link rel="preload" href="/docs/assets/js/5.a0dda975.js" as="script"><link rel="preload" href="/docs/assets/js/7.cf6e89f4.js" as="script"><link rel="preload" href="/docs/assets/js/8.904f276f.js" as="script"><link rel="preload" href="/docs/assets/js/10.bc8d26ba.js" as="script"><link rel="preload" href="/docs/assets/js/6.f7435f21.js" as="script"><link rel="preload" href="/docs/assets/js/9.acf071b7.js" as="script"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/47.e0d1eca1.js" as="script"><link rel="preload" href="/docs/assets/js/12.0c4d869b.js" as="script"><link rel="preload" href="/docs/assets/js/4.f5f74e88.js" as="script"><link rel="preload" href="/docs/assets/js/3.e2d18c88.js" as="script"><link rel="preload" href="/docs/assets/js/5.08e37066.js" as="script"><link rel="preload" href="/docs/assets/js/7.42f8bf76.js" as="script"><link rel="preload" href="/docs/assets/js/8.01db2cd4.js" as="script"><link rel="preload" href="/docs/assets/js/10.5820b83e.js" as="script"><link rel="preload" href="/docs/assets/js/6.703956f1.js" as="script"><link rel="preload" href="/docs/assets/js/9.22dace02.js" as="script"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -121,7 +121,7 @@ The main part of the GrapesJS editor is the canvas, this is where you create the
<span class="token comment">// ...</span> <span class="token comment">// ...</span>
<span class="token punctuation">}</span><span class="token punctuation">)</span> <span class="token punctuation">}</span><span class="token punctuation">)</span>
</code></pre></div><div class="custom-block tip"><p class="custom-block-title">TIP</p> <p>If you want to learn more about blocks we suggest to read its dedicated article: <a href="/docs/modules/Blocks.html">Block Manager Module</a></p></div> <h2 id="define-components"><a href="#define-components" class="header-anchor">#</a> Define Components</h2> <p>Technically, once you drop your HTML block inside the canvas each element of the content is transformed into a GrapesJS Component. A GrapesJS Component is an object containing information about how the element is rendered in the canvas (managed in the View) and how it might look its final code (created by the properties in the Model). Generally, all Model properties are reflected in the View. Therefore, if you add a new attribute to the model, it will be available in the export code (which we will learn more about later), and the element you see in the canvas will be updated with new attributes. </code></pre></div><div class="custom-block tip"><p class="custom-block-title">TIP</p> <p>If you want to learn more about blocks we suggest to read its dedicated article: <a href="/docs/modules/Blocks.html">Block Manager Module</a></p></div> <h2 id="define-components"><a href="#define-components" class="header-anchor">#</a> Define Components</h2> <p>Technically, once you drop your HTML block inside the canvas each element of the content is transformed into a GrapesJS Component. A GrapesJS Component is an object containing information about how the element is rendered in the canvas (managed in the View) and how it might look its final code (created by the properties in the Model). Generally, all Model properties are reflected in the View. Therefore, if you add a new attribute to the model, it will be available in the export code (which we will learn more about later), and the element you see in the canvas will be updated with new attributes.
This isn't totally out of the ordinary, but the unique thing about Components that you can create a totally decoupled View. This means you can show the user whatever you desire regardless of what is in the Model. For example, by dragging a placeholder text you can fetch and show instead a dynamic content. If you want to learn more about Custom Components, you should check out <a href="/docs/modules/Components.html">Component Manager Module</a>.</p> <p>GrapesJS comes with a few <a href="/docs/modules/Components.html#built-in-components">built-in Components</a> that enable different features once rendered in the canvas. For example, by double clicking on an image component you will see the default <a href="/docs/modules/Assets.html">Asset Manager</a>, which you can customize or integrate you own. By double clicking on the text component you're able to edit it via the built-in Rich Text Editor, which is also customization and <a href="/docs/guides/Replace-Rich-Text-Editor.html">replaceable</a>.</p> <p>As we have seen before you can create Blocks directly as Components</p> <div class="language-js extra-class"><pre class="language-js"><code>editor<span class="token punctuation">.</span>BlockManager<span class="token punctuation">.</span><span class="token function">add</span><span class="token punctuation">(</span><span class="token string">'my-block-id'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span> This isn't totally out of the ordinary, but the unique thing about Components that you can create a totally decoupled View. This means you can show the user whatever you desire regardless of what is in the Model. For example, by dragging a placeholder text you can fetch and show instead a dynamic content. If you want to learn more about Custom Components, you should check out <a href="/docs/modules/Components.html">Component Manager Module</a>.</p> <p>GrapesJS comes with a few <a href="/docs/modules/Components.html#built-in-component-types">built-in Components</a> that enable different features once rendered in the canvas. For example, by double clicking on an image component you will see the default <a href="/docs/modules/Assets.html">Asset Manager</a>, which you can customize or integrate you own. By double clicking on the text component you're able to edit it via the built-in Rich Text Editor, which is also customization and <a href="/docs/guides/Replace-Rich-Text-Editor.html">replaceable</a>.</p> <p>As we have seen before you can create Blocks directly as Components</p> <div class="language-js extra-class"><pre class="language-js"><code>editor<span class="token punctuation">.</span>BlockManager<span class="token punctuation">.</span><span class="token function">add</span><span class="token punctuation">(</span><span class="token string">'my-block-id'</span><span class="token punctuation">,</span> <span class="token punctuation">{</span>
<span class="token comment">// ...</span> <span class="token comment">// ...</span>
content<span class="token operator">:</span> <span class="token punctuation">{</span> content<span class="token operator">:</span> <span class="token punctuation">{</span>
tagName<span class="token operator">:</span> <span class="token string">'div'</span><span class="token punctuation">,</span> tagName<span class="token operator">:</span> <span class="token string">'div'</span><span class="token punctuation">,</span>
@ -580,7 +580,7 @@ To complete our builder let's customize its color palette and to make it more vi
.gjs-four-color-h:hover</span> <span class="token punctuation">{</span> .gjs-four-color-h:hover</span> <span class="token punctuation">{</span>
<span class="token property">color</span><span class="token punctuation">:</span> #ec5896<span class="token punctuation">;</span> <span class="token property">color</span><span class="token punctuation">:</span> #ec5896<span class="token punctuation">;</span>
<span class="token punctuation">}</span> <span class="token punctuation">}</span>
</code></pre></div><p>and here is our final result</p> <div id="final-result" class="demo-container" data-v-b3715568><div class="gjs__themed"><div id="panel__top8" class="panel__top"><div id="panel__basic-actions8" class="panel__basic-actions"></div> <div id="panel__devices8" class="panel__devices"></div> <div id="panel__switcher8" class="panel__switcher"></div></div> <div class="editor-row"><div class="editor-canvas"><div id="gjs8" class="gjs"><h1>Hello World Component!</h1></div></div> <div id="panel__right8" class="panel__right"><div id="layers-container8" class="layers-container"></div> <div id="styles-container8" class="styles-container"></div> <div id="traits-container8" class="traits-container"></div></div></div> <div id="blocks8"></div></div></div></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/getting-started.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">9/11/2019, 8:38:39 AM</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev"> </code></pre></div><p>and here is our final result</p> <div id="final-result" class="demo-container" data-v-b3715568><div class="gjs__themed"><div id="panel__top8" class="panel__top"><div id="panel__basic-actions8" class="panel__basic-actions"></div> <div id="panel__devices8" class="panel__devices"></div> <div id="panel__switcher8" class="panel__switcher"></div></div> <div class="editor-row"><div class="editor-canvas"><div id="gjs8" class="gjs"><h1>Hello World Component!</h1></div></div> <div id="panel__right8" class="panel__right"><div id="layers-container8" class="layers-container"></div> <div id="styles-container8" class="styles-container"></div> <div id="traits-container8" class="traits-container"></div></div></div> <div id="blocks8"></div></div></div></div> <footer class="page-edit"><div class="edit-link"><a href="https://github.com/artf/grapesjs/edit/dev/docs/getting-started.md" target="_blank" rel="noopener noreferrer">Edit this page on GitHub</a> <span><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path> <polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg> <span class="sr-only">(opens new window)</span></span></div> <div class="last-updated"><span class="prefix">Last Updated:</span> <span class="time">8/22/2021, 7:22:51 PM</span></div></footer> <div class="page-nav"><p class="inner"><span class="prev">
← ←
<a href="/docs/" class="prev router-link-active"> <a href="/docs/" class="prev router-link-active">
Introduction Introduction
@ -589,6 +589,6 @@ To complete our builder let's customize its color palette and to make it more vi
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/43.a4256f15.js" defer></script><script src="/docs/assets/js/12.05f31234.js" defer></script><script src="/docs/assets/js/4.f31d6c5b.js" defer></script><script src="/docs/assets/js/3.9c33fa00.js" defer></script><script src="/docs/assets/js/5.a0dda975.js" defer></script><script src="/docs/assets/js/7.cf6e89f4.js" defer></script><script src="/docs/assets/js/8.904f276f.js" defer></script><script src="/docs/assets/js/10.bc8d26ba.js" defer></script><script src="/docs/assets/js/6.f7435f21.js" defer></script><script src="/docs/assets/js/9.acf071b7.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/47.e0d1eca1.js" defer></script><script src="/docs/assets/js/12.0c4d869b.js" defer></script><script src="/docs/assets/js/4.f5f74e88.js" defer></script><script src="/docs/assets/js/3.e2d18c88.js" defer></script><script src="/docs/assets/js/5.08e37066.js" defer></script><script src="/docs/assets/js/7.42f8bf76.js" defer></script><script src="/docs/assets/js/8.01db2cd4.js" defer></script><script src="/docs/assets/js/10.5820b83e.js" defer></script><script src="/docs/assets/js/6.703956f1.js" defer></script><script src="/docs/assets/js/9.22dace02.js" defer></script>
</body> </body>
</html> </html>

6
docs/guides/Custom-CSS-parser.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/44.c05e59f9.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/48.e7d820a6.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -217,6 +217,6 @@ editor<span class="token punctuation">.</span><span class="token function">setCu
<a href="/docs/guides/Replace-Rich-Text-Editor.html" class="prev"> <a href="/docs/guides/Replace-Rich-Text-Editor.html" class="prev">
Replace Rich Text Editor Replace Rich Text Editor
</a></span> <!----></p></div> </main></div><div class="global-ui"></div></div> </a></span> <!----></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/44.c05e59f9.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/48.e7d820a6.js" defer></script>
</body> </body>
</html> </html>

6
docs/guides/Replace-Rich-Text-Editor.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/45.3e7d2ba2.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/49.f98ef45a.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -110,6 +110,6 @@ Obviously, each third-party library has its own APIs and can present some limita
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/45.3e7d2ba2.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/49.f98ef45a.js" defer></script>
</body> </body>
</html> </html>

6
docs/index.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/20.7ee8a470.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/20.20d84c7c.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -45,6 +45,6 @@ GrapesJS ships with features and tools that enable you to craft easy to use buil
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/20.7ee8a470.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/20.20d84c7c.js" defer></script>
</body> </body>
</html> </html>

8
docs/modules/Assets.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/46.c362554c.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/50.d45266e9.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -133,7 +133,7 @@
type<span class="token operator">:</span> <span class="token string">'image'</span><span class="token punctuation">,</span> type<span class="token operator">:</span> <span class="token string">'image'</span><span class="token punctuation">,</span>
src<span class="token operator">:</span> <span class="token string">'http://placehold.it/350x250/459ba8/fff/image2.jpg'</span><span class="token punctuation">,</span> src<span class="token operator">:</span> <span class="token string">'http://placehold.it/350x250/459ba8/fff/image2.jpg'</span><span class="token punctuation">,</span>
height<span class="token operator">:</span> <span class="token number">350</span><span class="token punctuation">,</span> height<span class="token operator">:</span> <span class="token number">350</span><span class="token punctuation">,</span>
width<span class="token operator">:</span> <span class="token number">250</span><span class="token punctuation">,</span> width<span class="token operator">:</span> <span class="token number">250</span><span class="token punctuation">,</span>
name<span class="token operator">:</span> <span class="token string">'displayName'</span> name<span class="token operator">:</span> <span class="token string">'displayName'</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span> <span class="token punctuation">}</span><span class="token punctuation">,</span>
<span class="token punctuation">{</span> <span class="token punctuation">{</span>
@ -378,6 +378,6 @@ editor<span class="token punctuation">.</span><span class="token function">on</s
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/46.c362554c.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/50.d45266e9.js" defer></script>
</body> </body>
</html> </html>

6
docs/modules/Blocks.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/47.a5e549f1.js" as="script"><link rel="preload" href="/docs/assets/js/14.21fd784c.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/48.2e375343.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/51.e5e038d0.js" as="script"><link rel="preload" href="/docs/assets/js/14.5f22df6b.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/52.6dcd0cb9.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -98,6 +98,6 @@ If you want to check the complete list of available Component's properties, chec
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/47.a5e549f1.js" defer></script><script src="/docs/assets/js/14.21fd784c.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/51.e5e038d0.js" defer></script><script src="/docs/assets/js/14.5f22df6b.js" defer></script>
</body> </body>
</html> </html>

6
docs/modules/Commands.html

@ -9,8 +9,8 @@
<link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25"> <link rel="stylesheet" href="../stylesheets/grapes.min.css?v0.17.25">
<script src="../js/grapes.min.js?v0.17.25"></script> <script src="../js/grapes.min.js?v0.17.25"></script>
<meta name="description" content="GrapesJS documentation"> <meta name="description" content="GrapesJS documentation">
<link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.36495a81.js" as="script"><link rel="preload" href="/docs/assets/js/11.e4a5286f.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/48.2e375343.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.bc8d26ba.js"><link rel="prefetch" href="/docs/assets/js/12.05f31234.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.21fd784c.js"><link rel="prefetch" href="/docs/assets/js/15.8026aa70.js"><link rel="prefetch" href="/docs/assets/js/16.5365d48a.js"><link rel="prefetch" href="/docs/assets/js/17.16a899b7.js"><link rel="prefetch" href="/docs/assets/js/18.2b682096.js"><link rel="prefetch" href="/docs/assets/js/19.c8bf26af.js"><link rel="prefetch" href="/docs/assets/js/20.7ee8a470.js"><link rel="prefetch" href="/docs/assets/js/21.80a868df.js"><link rel="prefetch" href="/docs/assets/js/22.b1817aaa.js"><link rel="prefetch" href="/docs/assets/js/23.24b1a9f0.js"><link rel="prefetch" href="/docs/assets/js/24.0b14d393.js"><link rel="prefetch" href="/docs/assets/js/25.a736d8ee.js"><link rel="prefetch" href="/docs/assets/js/26.5a4f24ff.js"><link rel="prefetch" href="/docs/assets/js/27.f3b530ab.js"><link rel="prefetch" href="/docs/assets/js/28.f3e302a2.js"><link rel="prefetch" href="/docs/assets/js/29.0534d4fc.js"><link rel="prefetch" href="/docs/assets/js/3.9c33fa00.js"><link rel="prefetch" href="/docs/assets/js/30.91585127.js"><link rel="prefetch" href="/docs/assets/js/31.58e6a8d0.js"><link rel="prefetch" href="/docs/assets/js/32.9ea68a19.js"><link rel="prefetch" href="/docs/assets/js/33.83a74dc0.js"><link rel="prefetch" href="/docs/assets/js/34.5195e151.js"><link rel="prefetch" href="/docs/assets/js/35.ee386620.js"><link rel="prefetch" href="/docs/assets/js/36.3c04f1d9.js"><link rel="prefetch" href="/docs/assets/js/37.29e16f9c.js"><link rel="prefetch" href="/docs/assets/js/38.5d32b029.js"><link rel="prefetch" href="/docs/assets/js/39.9a58de40.js"><link rel="prefetch" href="/docs/assets/js/4.f31d6c5b.js"><link rel="prefetch" href="/docs/assets/js/40.8e6d589e.js"><link rel="prefetch" href="/docs/assets/js/41.3352d1b5.js"><link rel="prefetch" href="/docs/assets/js/42.57cce0c6.js"><link rel="prefetch" href="/docs/assets/js/43.a4256f15.js"><link rel="prefetch" href="/docs/assets/js/44.c05e59f9.js"><link rel="prefetch" href="/docs/assets/js/45.3e7d2ba2.js"><link rel="prefetch" href="/docs/assets/js/46.c362554c.js"><link rel="prefetch" href="/docs/assets/js/47.a5e549f1.js"><link rel="prefetch" href="/docs/assets/js/49.88dd7cce.js"><link rel="prefetch" href="/docs/assets/js/5.a0dda975.js"><link rel="prefetch" href="/docs/assets/js/50.c459c2cb.js"><link rel="prefetch" href="/docs/assets/js/51.47c12f8d.js"><link rel="prefetch" href="/docs/assets/js/52.334fdb25.js"><link rel="prefetch" href="/docs/assets/js/53.ec424eac.js"><link rel="prefetch" href="/docs/assets/js/54.91803c3a.js"><link rel="prefetch" href="/docs/assets/js/55.266c6160.js"><link rel="prefetch" href="/docs/assets/js/6.f7435f21.js"><link rel="prefetch" href="/docs/assets/js/7.cf6e89f4.js"><link rel="prefetch" href="/docs/assets/js/8.904f276f.js"><link rel="prefetch" href="/docs/assets/js/9.acf071b7.js"> <link rel="preload" href="/docs/assets/css/0.styles.1858edcc.css" as="style"><link rel="preload" href="/docs/assets/js/app.69ef2787.js" as="script"><link rel="preload" href="/docs/assets/js/11.b63b354b.js" as="script"><link rel="preload" href="/docs/assets/js/2.15028157.js" as="script"><link rel="preload" href="/docs/assets/js/52.6dcd0cb9.js" as="script"><link rel="prefetch" href="/docs/assets/js/10.5820b83e.js"><link rel="prefetch" href="/docs/assets/js/12.0c4d869b.js"><link rel="prefetch" href="/docs/assets/js/13.8130e741.js"><link rel="prefetch" href="/docs/assets/js/14.5f22df6b.js"><link rel="prefetch" href="/docs/assets/js/15.4abef4d7.js"><link rel="prefetch" href="/docs/assets/js/16.86ce4521.js"><link rel="prefetch" href="/docs/assets/js/17.f46590a7.js"><link rel="prefetch" href="/docs/assets/js/18.7cde108a.js"><link rel="prefetch" href="/docs/assets/js/19.c63f93b9.js"><link rel="prefetch" href="/docs/assets/js/20.20d84c7c.js"><link rel="prefetch" href="/docs/assets/js/21.2bcebecd.js"><link rel="prefetch" href="/docs/assets/js/22.9198d9a9.js"><link rel="prefetch" href="/docs/assets/js/23.173c6f11.js"><link rel="prefetch" href="/docs/assets/js/24.5f532ac1.js"><link rel="prefetch" href="/docs/assets/js/25.4b4e28f3.js"><link rel="prefetch" href="/docs/assets/js/26.a2eb9e5a.js"><link rel="prefetch" href="/docs/assets/js/27.a94bbf50.js"><link rel="prefetch" href="/docs/assets/js/28.53799e93.js"><link rel="prefetch" href="/docs/assets/js/29.d4b56a92.js"><link rel="prefetch" href="/docs/assets/js/3.e2d18c88.js"><link rel="prefetch" href="/docs/assets/js/30.bcd6c9ba.js"><link rel="prefetch" href="/docs/assets/js/31.351ea798.js"><link rel="prefetch" href="/docs/assets/js/32.405cce15.js"><link rel="prefetch" href="/docs/assets/js/33.0061376c.js"><link rel="prefetch" href="/docs/assets/js/34.9fc51478.js"><link rel="prefetch" href="/docs/assets/js/35.1358dcad.js"><link rel="prefetch" href="/docs/assets/js/36.4efd224f.js"><link rel="prefetch" href="/docs/assets/js/37.bb7369c2.js"><link rel="prefetch" href="/docs/assets/js/38.b6076463.js"><link rel="prefetch" href="/docs/assets/js/39.a5db70a9.js"><link rel="prefetch" href="/docs/assets/js/4.f5f74e88.js"><link rel="prefetch" href="/docs/assets/js/40.b08cabb1.js"><link rel="prefetch" href="/docs/assets/js/41.85377700.js"><link rel="prefetch" href="/docs/assets/js/42.be31a4a9.js"><link rel="prefetch" href="/docs/assets/js/43.5e16fa84.js"><link rel="prefetch" href="/docs/assets/js/44.5ab27d40.js"><link rel="prefetch" href="/docs/assets/js/45.ba1f8509.js"><link rel="prefetch" href="/docs/assets/js/46.d147024c.js"><link rel="prefetch" href="/docs/assets/js/47.e0d1eca1.js"><link rel="prefetch" href="/docs/assets/js/48.e7d820a6.js"><link rel="prefetch" href="/docs/assets/js/49.f98ef45a.js"><link rel="prefetch" href="/docs/assets/js/5.08e37066.js"><link rel="prefetch" href="/docs/assets/js/50.d45266e9.js"><link rel="prefetch" href="/docs/assets/js/51.e5e038d0.js"><link rel="prefetch" href="/docs/assets/js/53.66298f37.js"><link rel="prefetch" href="/docs/assets/js/54.e070b389.js"><link rel="prefetch" href="/docs/assets/js/55.bdd09571.js"><link rel="prefetch" href="/docs/assets/js/56.ca1aa9c3.js"><link rel="prefetch" href="/docs/assets/js/57.5ab02891.js"><link rel="prefetch" href="/docs/assets/js/58.8854dd6f.js"><link rel="prefetch" href="/docs/assets/js/59.7fed6525.js"><link rel="prefetch" href="/docs/assets/js/6.703956f1.js"><link rel="prefetch" href="/docs/assets/js/7.42f8bf76.js"><link rel="prefetch" href="/docs/assets/js/8.01db2cd4.js"><link rel="prefetch" href="/docs/assets/js/9.22dace02.js">
<link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css"> <link rel="stylesheet" href="/docs/assets/css/0.styles.1858edcc.css">
</head> </head>
<body> <body>
@ -173,6 +173,6 @@ editor<span class="token punctuation">.</span><span class="token function">on</s
</a> </a>
→ →
</span></p></div> </main></div><div class="global-ui"></div></div> </span></p></div> </main></div><div class="global-ui"></div></div>
<script src="/docs/assets/js/app.36495a81.js" defer></script><script src="/docs/assets/js/11.e4a5286f.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/48.2e375343.js" defer></script> <script src="/docs/assets/js/app.69ef2787.js" defer></script><script src="/docs/assets/js/11.b63b354b.js" defer></script><script src="/docs/assets/js/2.15028157.js" defer></script><script src="/docs/assets/js/52.6dcd0cb9.js" defer></script>
</body> </body>
</html> </html>

Some files were not shown because too many files changed in this diff

Loading…
Cancel
Save