katalyst-content 0.1.2 → 0.2.1

data/app/assets/stylesheets/katalyst/content/editor/_new-items.scss

@@ -10,6 +10,7 @@
     flex-direction: column;
     justify-content: center;
     align-items: center;
+    text-align: center;
     transform: translate3d(0, 0, 0);
     cursor: grab;
     background: white;
@@ -29,7 +30,27 @@
     }
 
     &[data-item-type="content"]:before {
-      background-image: url("data:image/svg+xml,%3Csvg width='49' height='49' viewBox='0 0 49 49' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.9 0C2.28667 0 0 2.28667 0 4.9C0 6.86 1.30667 8.82008 3.26667 9.47341V39.5266C1.30667 40.1799 0 42.14 0 44.1C0 46.7133 2.28667 49 4.9 49C6.86 49 8.82 47.6933 9.47333 45.7333H39.5267C40.18 47.6933 42.14 49 44.1 49C46.7133 49 49 46.7133 49 44.1C49 42.14 47.6933 40.1799 45.7333 39.5266V9.47341C47.6933 8.82008 49 6.86 49 4.9C49 2.28667 46.7133 0 44.1 0C42.14 0 40.18 1.30667 39.5267 3.26667H9.47333C8.82 1.30667 7.18667 0 4.9 0ZM4.9 3.26667C5.88 3.26667 6.53333 3.92 6.53333 4.9C6.53333 5.88 5.88 6.53333 4.9 6.53333C3.92 6.53333 3.26667 5.88 3.26667 4.9C3.26667 3.92 3.92 3.26667 4.9 3.26667ZM44.1 3.26667C45.08 3.26667 45.7333 3.92 45.7333 4.9C45.7333 5.88 45.08 6.53333 44.1 6.53333C43.12 6.53333 42.4667 5.88 42.4667 4.9C42.4667 3.92 43.12 3.26667 44.1 3.26667ZM9.47333 6.53333H39.5267C40.18 7.84 41.16 9.14675 42.4667 9.47341V39.5266C41.16 40.1799 39.8533 41.16 39.5267 42.4667H9.47333C8.82 41.16 7.84 39.8533 6.53333 39.5266V9.47341C7.84 8.82008 8.82 7.84 9.47333 6.53333ZM4.9 42.4667C5.88 42.4667 6.53333 43.12 6.53333 44.1C6.53333 45.08 5.88 45.7333 4.9 45.7333C3.92 45.7333 3.26667 45.08 3.26667 44.1C3.26667 43.12 3.92 42.4667 4.9 42.4667ZM44.1 42.4667C45.08 42.4667 45.7333 43.12 45.7333 44.1C45.7333 45.08 45.08 45.7333 44.1 45.7333C43.12 45.7333 42.4667 45.08 42.4667 44.1C42.4667 43.12 43.12 42.4667 44.1 42.4667Z' /%3E%3Cpath d='M13 19.1667V11H35.8667V19.1667H32.6V14.2667H26.0667V33.8667H29.3333V37.1333H19.5333V33.8667H22.8V14.2667H16.2667V19.1667H13Z' /%3E%3C/svg%3E");
+      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 49 49' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.9 0C2.28667 0 0 2.28667 0 4.9C0 6.86 1.30667 8.82008 3.26667 9.47341V39.5266C1.30667 40.1799 0 42.14 0 44.1C0 46.7133 2.28667 49 4.9 49C6.86 49 8.82 47.6933 9.47333 45.7333H39.5267C40.18 47.6933 42.14 49 44.1 49C46.7133 49 49 46.7133 49 44.1C49 42.14 47.6933 40.1799 45.7333 39.5266V9.47341C47.6933 8.82008 49 6.86 49 4.9C49 2.28667 46.7133 0 44.1 0C42.14 0 40.18 1.30667 39.5267 3.26667H9.47333C8.82 1.30667 7.18667 0 4.9 0ZM4.9 3.26667C5.88 3.26667 6.53333 3.92 6.53333 4.9C6.53333 5.88 5.88 6.53333 4.9 6.53333C3.92 6.53333 3.26667 5.88 3.26667 4.9C3.26667 3.92 3.92 3.26667 4.9 3.26667ZM44.1 3.26667C45.08 3.26667 45.7333 3.92 45.7333 4.9C45.7333 5.88 45.08 6.53333 44.1 6.53333C43.12 6.53333 42.4667 5.88 42.4667 4.9C42.4667 3.92 43.12 3.26667 44.1 3.26667ZM9.47333 6.53333H39.5267C40.18 7.84 41.16 9.14675 42.4667 9.47341V39.5266C41.16 40.1799 39.8533 41.16 39.5267 42.4667H9.47333C8.82 41.16 7.84 39.8533 6.53333 39.5266V9.47341C7.84 8.82008 8.82 7.84 9.47333 6.53333ZM4.9 42.4667C5.88 42.4667 6.53333 43.12 6.53333 44.1C6.53333 45.08 5.88 45.7333 4.9 45.7333C3.92 45.7333 3.26667 45.08 3.26667 44.1C3.26667 43.12 3.92 42.4667 4.9 42.4667ZM44.1 42.4667C45.08 42.4667 45.7333 43.12 45.7333 44.1C45.7333 45.08 45.08 45.7333 44.1 45.7333C43.12 45.7333 42.4667 45.08 42.4667 44.1C42.4667 43.12 43.12 42.4667 44.1 42.4667Z' /%3E%3Cpath d='M13 19.1667V11H35.8667V19.1667H32.6V14.2667H26.0667V33.8667H29.3333V37.1333H19.5333V33.8667H22.8V14.2667H16.2667V19.1667H13Z' /%3E%3C/svg%3E");
+    }
+
+    &[data-item-type="figure"]:before {
+      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 64 64' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M8 0H56C60.4183 0 64 3.8205 64 8.53333V55.4667C64 60.1795 60.4183 64 56 64H8C3.58172 64 0 60.1795 0 55.4667V8.53333C0 3.8205 3.58172 0 8 0ZM48.8131 18.4523C48.8131 20.9113 46.9782 22.9045 44.7145 22.9045C42.4507 22.9045 40.6158 20.9113 40.6158 18.4523C40.6158 15.9934 42.4507 14 44.7145 14C46.9782 14 48.8131 15.9934 48.8131 18.4523ZM9.91404 49.8654H33.37L45.2139 50L55.2315 49.8938C56.6969 49.8783 57.5059 48.1335 56.6514 46.8391L46.4012 31.3112C45.6298 30.1427 44.0089 30.1621 43.3268 31.3485L38.8194 39.1885C34.5783 32.1588 29.6634 24.1159 27.1454 20.0031C26.391 18.7709 24.5821 18.7994 23.8591 20.0499L8.25556 47.0321C7.52586 48.2939 8.44576 49.8654 9.91404 49.8654Z' fill='black'/%3E%3C/svg%3E");
+    }
+
+    &[data-item-type="section"]:before {
+      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 64 64' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M61.4263 64H58.8525C57.4799 64 56.2788 62.8021 56.2788 61.4332C56.2788 60.0642 57.4799 58.8663 58.8525 58.8663C58.8525 57.4973 60.0536 56.2995 61.4263 56.2995C62.7989 56.2995 64 57.4973 64 58.8663V61.4332C64 62.8021 62.9705 64 61.4263 64Z'/%3E%3Cpath d='M49.244 64H44.4397C43.067 64 41.866 62.8021 41.866 61.4332C41.866 60.0642 43.067 58.8663 44.4397 58.8663H49.244C50.6166 58.8663 51.8177 60.0642 51.8177 61.4332C51.8177 62.8021 50.6166 64 49.244 64ZM34.4879 64H29.6836C28.311 64 27.1099 62.8021 27.1099 61.4332C27.1099 60.0642 28.311 58.8663 29.6836 58.8663H34.4879C35.8606 58.8663 37.0617 60.0642 37.0617 61.4332C37.0617 62.8021 35.8606 64 34.4879 64ZM19.9035 64H14.9276C13.555 64 12.3539 62.8021 12.3539 61.4332C12.3539 60.0642 13.555 58.8663 14.9276 58.8663H19.7319C21.1046 58.8663 22.3056 60.0642 22.3056 61.4332C22.3056 62.8021 21.2761 64 19.9035 64Z'/%3E%3Cpath d='M5.14745 64H2.57372C1.20106 64 0 62.8021 0 61.4332V58.8663C0 57.4973 1.20106 56.2995 2.57372 56.2995C3.94637 56.2995 5.14745 57.4973 5.14745 58.8663C6.5201 58.8663 7.72117 60.0642 7.72117 61.4332C7.72117 62.8021 6.69168 64 5.14745 64Z'/%3E%3Cpath d='M2.57372 51.6791C1.20106 51.6791 0 50.4813 0 49.1123V44.3209C0 42.9519 1.20106 41.754 2.57372 41.754C3.94637 41.754 5.14745 42.9519 5.14745 44.3209V49.1123C5.14745 50.4813 4.11795 51.6791 2.57372 51.6791ZM2.57372 36.9626C1.20106 36.9626 0 35.7647 0 34.3957V29.6043C0 28.2353 1.20106 27.0375 2.57372 27.0375C3.94637 27.0375 5.14745 28.2353 5.14745 29.6043V34.3957C5.14745 35.9358 4.11795 36.9626 2.57372 36.9626ZM2.57372 22.4171C1.20106 22.4171 0 21.2193 0 19.8503V14.8877C0 13.5187 1.20106 12.3209 2.57372 12.3209C3.94637 12.3209 5.14745 13.5187 5.14745 14.8877V19.6792C5.14745 21.2193 4.11795 22.4171 2.57372 22.4171Z'/%3E%3Cpath d='M2.57372 7.70053C1.20106 7.70053 0 6.50267 0 5.13369V2.56684C0 1.19786 1.20106 0 2.57372 0H5.14745C6.5201 0 7.72117 1.19786 7.72117 2.56684C7.72117 3.93582 6.5201 5.13369 5.14745 5.13369C5.14745 6.67379 4.11795 7.70053 2.57372 7.70053Z'/%3E%3Cpath d='M49.244 5.13369H44.4397C43.067 5.13369 41.866 3.93583 41.866 2.56684C41.866 1.19786 43.067 0 44.4397 0H49.244C50.6166 0 51.8177 1.19786 51.8177 2.56684C51.8177 3.93583 50.6166 5.13369 49.244 5.13369ZM34.4879 5.13369H29.6836C28.311 5.13369 27.1099 3.93583 27.1099 2.56684C27.1099 1.19786 28.311 0 29.6836 0H34.4879C35.8606 0 37.0617 1.19786 37.0617 2.56684C37.0617 3.93583 35.8606 5.13369 34.4879 5.13369ZM19.9035 5.13369H14.9276C13.555 5.13369 12.3539 3.93583 12.3539 2.56684C12.3539 1.19786 13.555 0 14.9276 0H19.7319C21.1046 0 22.3056 1.19786 22.3056 2.56684C22.3056 3.93583 21.2761 5.13369 19.9035 5.13369Z'/%3E%3Cpath d='M61.4263 7.70053C60.0536 7.70053 58.8525 6.50267 58.8525 5.13369C57.4799 5.13369 56.2788 3.93582 56.2788 2.56684C56.2788 1.19786 57.4799 0 58.8525 0H61.4263C62.7989 0 64 1.19786 64 2.56684V5.13369C64 6.67379 62.9705 7.70053 61.4263 7.70053Z'/%3E%3Cpath d='M61.4263 51.6791C60.0536 51.6791 58.8525 50.4813 58.8525 49.1123V44.3209C58.8525 42.9519 60.0536 41.754 61.4263 41.754C62.7989 41.754 64 42.9519 64 44.3209V49.1123C64 50.4813 62.9705 51.6791 61.4263 51.6791ZM61.4263 36.9626C60.0536 36.9626 58.8525 35.7647 58.8525 34.3957V29.6043C58.8525 28.2353 60.0536 27.0375 61.4263 27.0375C62.7989 27.0375 64 28.2353 64 29.6043V34.3957C64 35.9358 62.9705 36.9626 61.4263 36.9626ZM61.4263 22.4171C60.0536 22.4171 58.8525 21.2193 58.8525 19.8503V14.8877C58.8525 13.5187 60.0536 12.3209 61.4263 12.3209C62.7989 12.3209 64 13.5187 64 14.8877V19.6792C64 21.2193 62.9705 22.4171 61.4263 22.4171Z'/%3E%3Cpath d='M35.5982 38.4425C35.5982 37.7506 35.4524 37.1641 35.1609 36.6828C34.8693 36.2015 34.3465 35.7654 33.5925 35.3743C32.8385 34.9833 31.7678 34.5872 30.3804 34.1861C29.2946 33.8753 28.3143 33.5244 27.4397 33.1333C26.5751 32.7323 25.8311 32.2761 25.2078 31.7647C24.5845 31.2533 24.1069 30.6668 23.7751 30.005C23.4434 29.3432 23.2775 28.5862 23.2775 27.7339C23.2775 26.5909 23.5841 25.5732 24.1974 24.6808C24.8207 23.7784 25.6904 23.0715 26.8063 22.5601C27.9223 22.0388 29.2292 21.7781 30.7272 21.7781C32.3861 21.7781 33.7936 22.0939 34.9497 22.7256C36.1059 23.3472 36.9856 24.1644 37.5888 25.1771C38.192 26.1798 38.4936 27.2527 38.4936 28.3957H35.553C35.553 27.5735 35.377 26.8416 35.0251 26.1999C34.6833 25.5581 34.1555 25.0568 33.4417 24.6958C32.7279 24.3249 31.8231 24.1394 30.7272 24.1394C29.7017 24.1394 28.8522 24.2948 28.1786 24.6056C27.5151 24.9164 27.0225 25.3376 26.7007 25.869C26.379 26.4004 26.2182 27.007 26.2182 27.6888C26.2182 28.3005 26.3941 28.8469 26.746 29.3282C27.0979 29.7994 27.6508 30.2256 28.4048 30.6066C29.1589 30.9876 30.1341 31.3486 31.3304 31.6895C32.9893 32.1507 34.3515 32.6871 35.4172 33.2988C36.4829 33.9104 37.2671 34.6323 37.7698 35.4646C38.2825 36.2968 38.5389 37.2794 38.5389 38.4124C38.5389 39.5956 38.2222 40.6283 37.5888 41.5107C36.9554 42.393 36.0657 43.0748 34.9196 43.5561C33.7735 44.0374 32.4263 44.278 30.878 44.278C29.8626 44.278 28.8623 44.1377 27.877 43.8569C26.9018 43.5762 26.0121 43.1551 25.2078 42.5936C24.4135 42.0321 23.7751 41.3402 23.2926 40.518C22.82 39.6858 22.5838 38.7232 22.5838 37.6303H25.5094C25.5094 38.3823 25.6552 39.0291 25.9467 39.5705C26.2383 40.1119 26.6354 40.5581 27.1381 40.9091C27.6408 41.26 28.2138 41.5207 28.8572 41.6912C29.5007 41.8516 30.1743 41.9318 30.878 41.9318C31.8934 41.9318 32.748 41.7914 33.4417 41.5107C34.1454 41.2199 34.6783 40.8138 35.0402 40.2924C35.4122 39.771 35.5982 39.1544 35.5982 38.4425Z'/%3E%3C/svg%3E%0A");
+    }
+
+    &[data-item-type="group"]:before {
+      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 64 64' fill='black' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M61.4263 64H58.8525C57.4799 64 56.2788 62.8021 56.2788 61.4332C56.2788 60.0642 57.4799 58.8663 58.8525 58.8663C58.8525 57.4973 60.0536 56.2995 61.4263 56.2995C62.7989 56.2995 64 57.4973 64 58.8663V61.4332C64 62.8021 62.9705 64 61.4263 64Z' /%3E%3Cpath d='M49.244 64H44.4397C43.067 64 41.866 62.8021 41.866 61.4332C41.866 60.0642 43.067 58.8663 44.4397 58.8663H49.244C50.6166 58.8663 51.8177 60.0642 51.8177 61.4332C51.8177 62.8021 50.6166 64 49.244 64ZM34.4879 64H29.6836C28.311 64 27.1099 62.8021 27.1099 61.4332C27.1099 60.0642 28.311 58.8663 29.6836 58.8663H34.4879C35.8606 58.8663 37.0617 60.0642 37.0617 61.4332C37.0617 62.8021 35.8606 64 34.4879 64ZM19.9035 64H14.9276C13.555 64 12.3539 62.8021 12.3539 61.4332C12.3539 60.0642 13.555 58.8663 14.9276 58.8663H19.7319C21.1046 58.8663 22.3056 60.0642 22.3056 61.4332C22.3056 62.8021 21.2761 64 19.9035 64Z' /%3E%3Cpath d='M5.14745 64H2.57372C1.20106 64 0 62.8021 0 61.4332V58.8663C0 57.4973 1.20106 56.2995 2.57372 56.2995C3.94637 56.2995 5.14745 57.4973 5.14745 58.8663C6.5201 58.8663 7.72117 60.0642 7.72117 61.4332C7.72117 62.8021 6.69168 64 5.14745 64Z' /%3E%3Cpath d='M2.57372 51.6791C1.20106 51.6791 0 50.4813 0 49.1123V44.3209C0 42.9519 1.20106 41.754 2.57372 41.754C3.94637 41.754 5.14745 42.9519 5.14745 44.3209V49.1123C5.14745 50.4813 4.11795 51.6791 2.57372 51.6791ZM2.57372 36.9626C1.20106 36.9626 0 35.7647 0 34.3957V29.6043C0 28.2353 1.20106 27.0375 2.57372 27.0375C3.94637 27.0375 5.14745 28.2353 5.14745 29.6043V34.3957C5.14745 35.9358 4.11795 36.9626 2.57372 36.9626ZM2.57372 22.4171C1.20106 22.4171 0 21.2193 0 19.8503V14.8877C0 13.5187 1.20106 12.3209 2.57372 12.3209C3.94637 12.3209 5.14745 13.5187 5.14745 14.8877V19.6792C5.14745 21.2193 4.11795 22.4171 2.57372 22.4171Z' /%3E%3Cpath d='M2.57372 7.70053C1.20106 7.70053 0 6.50267 0 5.13369V2.56684C0 1.19786 1.20106 0 2.57372 0H5.14745C6.5201 0 7.72117 1.19786 7.72117 2.56684C7.72117 3.93583 6.5201 5.13369 5.14745 5.13369C5.14745 6.67379 4.11795 7.70053 2.57372 7.70053Z' /%3E%3Cpath d='M49.244 5.13369H44.4397C43.067 5.13369 41.866 3.93583 41.866 2.56684C41.866 1.19786 43.067 0 44.4397 0H49.244C50.6166 0 51.8177 1.19786 51.8177 2.56684C51.8177 3.93583 50.6166 5.13369 49.244 5.13369ZM34.4879 5.13369H29.6836C28.311 5.13369 27.1099 3.93583 27.1099 2.56684C27.1099 1.19786 28.311 0 29.6836 0H34.4879C35.8606 0 37.0617 1.19786 37.0617 2.56684C37.0617 3.93583 35.8606 5.13369 34.4879 5.13369ZM19.9035 5.13369H14.9276C13.555 5.13369 12.3539 3.93583 12.3539 2.56684C12.3539 1.19786 13.555 0 14.9276 0H19.7319C21.1046 0 22.3056 1.19786 22.3056 2.56684C22.3056 3.93583 21.2761 5.13369 19.9035 5.13369Z' /%3E%3Cpath d='M61.4263 7.70053C60.0536 7.70053 58.8525 6.50267 58.8525 5.13369C57.4799 5.13369 56.2788 3.93583 56.2788 2.56684C56.2788 1.19786 57.4799 0 58.8525 0H61.4263C62.7989 0 64 1.19786 64 2.56684V5.13369C64 6.67379 62.9705 7.70053 61.4263 7.70053Z' /%3E%3Cpath d='M61.4263 51.6791C60.0536 51.6791 58.8525 50.4813 58.8525 49.1123V44.3209C58.8525 42.9519 60.0536 41.754 61.4263 41.754C62.7989 41.754 64 42.9519 64 44.3209V49.1123C64 50.4813 62.9705 51.6791 61.4263 51.6791ZM61.4263 36.9626C60.0536 36.9626 58.8525 35.7647 58.8525 34.3957V29.6043C58.8525 28.2353 60.0536 27.0375 61.4263 27.0375C62.7989 27.0375 64 28.2353 64 29.6043V34.3957C64 35.9358 62.9705 36.9626 61.4263 36.9626ZM61.4263 22.4171C60.0536 22.4171 58.8525 21.2193 58.8525 19.8503V14.8877C58.8525 13.5187 60.0536 12.3209 61.4263 12.3209C62.7989 12.3209 64 13.5187 64 14.8877V19.6792C64 21.2193 62.9705 22.4171 61.4263 22.4171Z' /%3E%3Cpath d='M40.1374 39.3934C39.866 39.7844 39.4337 40.2306 38.8405 40.7319C38.2574 41.2232 37.443 41.6544 36.3975 42.0254C35.3619 42.3863 34.0198 42.5668 32.371 42.5668C30.5915 42.5668 29.008 42.1557 27.6206 41.3335C26.2433 40.5113 25.1625 39.3232 24.3784 37.769C23.5942 36.2149 23.2021 34.3499 23.2021 32.1741V30.4445C23.2021 28.2687 23.5439 26.4087 24.2275 24.8646C24.9112 23.3105 25.9065 22.1223 27.2135 21.3001C28.5305 20.4779 30.1341 20.0668 32.0241 20.0668C33.7031 20.0668 35.1106 20.3576 36.2467 20.9392C37.3827 21.5107 38.2674 22.3028 38.9008 23.3155C39.5442 24.3282 39.9564 25.4813 40.1374 26.7747H37.2118C37.0811 25.9826 36.8197 25.2607 36.4276 24.6089C36.0456 23.9472 35.4977 23.4208 34.7839 23.0297C34.07 22.6287 33.1552 22.4281 32.0392 22.4281C30.682 22.4281 29.566 22.754 28.6914 23.4057C27.8267 24.0474 27.1833 24.9649 26.7611 26.1581C26.3489 27.3513 26.1428 28.77 26.1428 30.4144V32.1741C26.1428 33.8586 26.4042 35.3025 26.9269 36.5057C27.4497 37.6988 28.1786 38.6163 29.1136 39.258C30.0486 39.8997 31.1394 40.2206 32.3861 40.2206C33.4216 40.2206 34.256 40.1353 34.8894 39.9649C35.5328 39.7844 36.0355 39.5738 36.3975 39.3332C36.7594 39.0825 37.0359 38.8469 37.2269 38.6263V33.6932H32.1599V31.3619H40.1374V39.3934Z' /%3E%3C/svg%3E%0A");
+    }
+
+    &[data-item-type="column"]:before {
+      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 64 64' fill='none' stroke='black' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='6' y='12' width='26' height='44' stroke-width='4' /%3E%3Crect x='32' y='12' width='26' height='44' stroke-width='4' /%3E%3C/svg%3E");
+    }
+
+    &[data-item-type="aside"]:before {
+      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 64 64' fill='none' stroke='black' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='6' y='12' width='36' height='44' stroke-width='4' /%3E%3Crect x='42' y='12' width='16' height='44' stroke-width='4' /%3E%3C/svg%3E");
     }
   }
 }

data/app/assets/stylesheets/katalyst/content/editor/_status-bar.scss

@@ -17,9 +17,11 @@
     display: none;
     grid-area: status;
     font-weight: bold;
+    color: var(--color);
   }
 
   &[data-state="published"] .status-text[data-published],
+  &[data-state="unpublished"] .status-text[data-unpublished],
   &[data-state="draft"] .status-text[data-draft],
   &[data-state="dirty"] .status-text[data-dirty] {
     display: unset;
@@ -72,6 +74,14 @@
     }
   }
 
+  &[data-state="unpublished"] {
+    [value="save"],
+    [value="discard"],
+    [value="revert"] {
+      display: none;
+    }
+  }
+
   &[data-state="draft"] {
     [value="save"],
     [value="discard"] {

data/app/assets/stylesheets/katalyst/content/editor/_trix-rails.scss

@@ -13,12 +13,12 @@
 }
 
 .trix-content
-.attachment-gallery.attachment-gallery--2
-> action-text-attachment,
+  .attachment-gallery.attachment-gallery--2
+  > action-text-attachment,
 .trix-content .attachment-gallery.attachment-gallery--2 > .attachment,
 .trix-content
-.attachment-gallery.attachment-gallery--4
-> action-text-attachment,
+  .attachment-gallery.attachment-gallery--4
+  > action-text-attachment,
 .trix-content .attachment-gallery.attachment-gallery--4 > .attachment {
   flex-basis: 50%;
   max-width: 50%;

data/app/controllers/katalyst/content/direct_uploads_controller.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+module Katalyst
+  module Content
+    class DirectUploadsController < ActiveStorage::DirectUploadsController
+    end
+  end
+end

data/app/controllers/katalyst/content/items_controller.rb

@@ -13,8 +13,12 @@ module Katalyst
         render locals: { item: @container.items.build(item_params) }
       end
 
+      def edit
+        render locals: { item: @item }
+      end
+
       def create
-        item = @container.items.build(item_params)
+        @item = item = @container.items.build(item_params)
         if item.save
           render :update, locals: { item: item, previous: @container.items.build(type: item.type) }
         else
@@ -22,10 +26,6 @@ module Katalyst
         end
       end
 
-      def edit
-        render locals: { item: @item }
-      end
-
       def update
         @item.attributes = item_params
 

data/app/helpers/katalyst/content/editor/base.rb

@@ -14,6 +14,7 @@ module Katalyst
 
         attr_accessor :template, :container
 
+        delegate :config, to: ::Katalyst::Content
         delegate_missing_to :template
 
         def initialize(template, container)

data/app/helpers/katalyst/content/editor/container.rb

@@ -6,6 +6,7 @@ module Katalyst
       class Container < Base
         ACTIONS = <<~ACTIONS.gsub(/\s+/, " ").freeze
           submit->#{CONTAINER_CONTROLLER}#reindex
+          content:drop->#{CONTAINER_CONTROLLER}#drop
           content:reindex->#{CONTAINER_CONTROLLER}#reindex
           content:reset->#{CONTAINER_CONTROLLER}#reset
         ACTIONS
@@ -13,12 +14,17 @@ module Katalyst
         def build(options)
           form_with(model: container, **default_options(id: container_form_id, **options)) do |form|
             concat hidden_input
+            concat errors
             concat(capture { yield form })
           end
         end
 
         private
 
+        def errors
+          Editor::Errors.new(self, container).build
+        end
+
         # Hidden input ensures that if the container is empty then the controller
         # receives an empty array.
         def hidden_input
@@ -29,10 +35,6 @@ module Katalyst
           add_option(options, :data, :controller, CONTAINER_CONTROLLER)
           add_option(options, :data, :action, ACTIONS)
 
-          # depth = options.delete(:depth) || container.depth
-          #
-          # add_option(options, :data, :"#{CONTAINER_CONTROLLER}-max-depth-value", depth) if depth
-
           options
         end
       end

data/app/helpers/katalyst/content/editor/errors.rb

@@ -0,0 +1,24 @@
+# frozen_string_literal: true
+
+module Katalyst
+  module Content
+    module Editor
+      class Errors < Base
+        def build(**options)
+          turbo_frame_tag dom_id(container, :errors) do
+            next unless container.errors.any?
+
+            tag.div(class: "content-errors", **options) do
+              tag.h2("Errors in content") +
+                tag.ul(class: "errors") do
+                  container.errors.each do |error|
+                    concat(tag.li(error.full_message))
+                  end
+                end
+            end
+          end
+        end
+      end
+    end
+  end
+end

data/app/helpers/katalyst/content/editor/status_bar.rb

@@ -11,6 +11,7 @@ module Katalyst
         def build(**options)
           tag.div **default_options(**options) do
             concat status(:published, last_update: l(container.updated_at, format: :short))
+            concat status(:unpublished)
             concat status(:draft)
             concat status(:dirty)
             concat actions
@@ -18,9 +19,17 @@ module Katalyst
         end
 
         def status(state, **options)
-          tag.span(t("views.katalyst.content.editor.#{state}_html", **options),
-                   class: "status-text",
-                   data:  { state => "" })
+          status_text  = t("views.katalyst.content.editor.#{state}_html", **options)
+          html_options = { class: "status-text", data: { state => "", turbo: false } }
+
+          case state
+          when :published
+            link_to status_text, url_for(container), **html_options
+          when :unpublished, :draft
+            link_to status_text, "#{url_for(container)}/preview", **html_options
+          else
+            tag.span status_text, **html_options
+          end
         end
 
         def actions

data/app/helpers/katalyst/content/editor_helper.rb

@@ -25,6 +25,12 @@ module Katalyst
         Editor::List.new(self, container).items(item)
       end
 
+      # Generate a turbo stream fragment that will show structural errors to the user.
+      def content_editor_errors(container:, **options)
+        turbo_stream.replace(dom_id(container, :errors),
+                             Editor::Errors.new(self, container).build(**options))
+      end
+
       # Gene
       def content_editor_new_item(item:, container: item.container, **options, &block)
         Editor::NewItem.new(self, container).build(item, **options, &block)
@@ -37,6 +43,26 @@ module Katalyst
       def content_editor_status_bar(container:, **options)
         Editor::StatusBar.new(self, container).build(**options)
       end
+
+      def content_editor_rich_text_options(options = {})
+        defaults = {
+          data: {
+            direct_upload_url: direct_uploads_url,
+            controller:        "content--editor--trix",
+            action:            "trix-initialize->content--editor--trix#trixInitialize",
+          },
+        }
+        defaults.deep_merge(options)
+      end
+
+      def content_editor_image_field(item:, method:, **options, &block)
+        Editor::ImageField.new(self, item.container).build(item, method, **options, &block)
+      end
+
+      # When rendering item forms do not include the controller namespace prefix (katalyst/content)
+      def prefix_partial_path_with_controller_namespace
+        false
+      end
     end
   end
 end

data/app/helpers/katalyst/content/frontend_helper.rb

@@ -0,0 +1,59 @@
+# frozen_string_literal: true
+
+module Katalyst
+  module Content
+    module FrontendHelper
+      def render_content(version)
+        render partial: version.tree.select(&:visible?)
+      end
+
+      def render_content_items(items)
+        items = items.select(&:visible?)
+        render partial: items if items.any?
+      end
+
+      def content_item_tag(item, **options, &block)
+        FrontendBuilder.new(self, item).render(**options, &block)
+      end
+    end
+
+    class FrontendBuilder
+      attr_accessor :template, :item
+
+      delegate_missing_to :@template
+
+      def initialize(template, item)
+        self.template = template
+        self.item     = item
+      end
+
+      def render(**options, &block)
+        content_tag tag, **default_options(**options) do
+          content_tag :div, &block
+        end
+      end
+
+      private
+
+      def default_options(**options)
+        {
+          id:    item.heading&.parameterize,
+          class: ["content-item", item.model_name.param_key, item.background, options[:class]],
+          data:  { content_index: item.index, content_depth: item.depth, **options.fetch(:data, {}) },
+          **options.except(:class, :data, :root),
+        }
+      end
+
+      def tag
+        case item
+        when Figure
+          :figure
+        when Section
+          :section
+        else
+          :div
+        end
+      end
+    end
+  end
+end

data/app/models/concerns/katalyst/content/container.rb

@@ -20,8 +20,8 @@ module Katalyst
                    inverse_of: :parent,
                    optional:   true
 
-        delegate :nodes, :items, :tree, to: :published_version, prefix: :published, allow_nil: true
-        delegate :nodes, :items, :tree, to: :draft_version, prefix: :draft, allow_nil: true
+        delegate :nodes, :items, :tree, :text, to: :published_version, prefix: :published, allow_nil: true
+        delegate :nodes, :items, :tree, :text, to: :draft_version, prefix: :draft, allow_nil: true
 
         has_many :versions,
                  class_name:  "#{name}::Version",
@@ -46,18 +46,37 @@ module Katalyst
                  class_name: "Katalyst::Content::Item",
                  dependent:  :destroy,
                  validate:   true
+
+        scope :order_by_state, ->(dir) do
+          dir            = :asc unless %w[asc desc].include?(dir.to_s)
+          unpublished    = arel_table[:published_version_id].eq(nil)
+          draft          = arel_table[:published_version_id].not_eq(arel_table[:draft_version_id])
+          case_statement = Arel::Nodes::Case.new
+                             .when(unpublished).then(3)
+                             .when(draft).then(2)
+                             .else(1)
+          order(case_statement.public_send(dir)).order(updated_at: dir)
+        end
+
+        scope :published, -> { where.not(published_version_id: nil) }
       end
 
       # A resource is in draft mode if it has an unpublished draft or it has no published version.
       # @return the current state of the resource, either `published` or `draft`
       def state
-        if published_version_id && published_version_id == draft_version_id
-          :published
-        else
+        if !published_version_id
+          :unpublished
+        elsif published_version_id != draft_version_id
           :draft
+        else
+          :published
         end
       end
 
+      def published?
+        published_version_id.present?
+      end
+
       # Promotes the draft version to become the published version
       def publish!
         update!(published_version: draft_version)
@@ -70,6 +89,17 @@ module Katalyst
         self
       end
 
+      # Sets the currently published version to nil
+      def unpublish!
+        update!(published_version_id: nil)
+        self
+      end
+
+      # Required for testing items validation
+      def items_attributes
+        draft_version&.nodes&.as_json
+      end
+
       # Updates the current draft version with new structure. Attributes should be structural information about the
       # items, e.g. `{index => {id:, depth:}` or `[{id:, depth:}]`.
       #
@@ -82,7 +112,9 @@ module Katalyst
       private
 
       def unset_versions
-        update(draft_version: nil, published_version: nil)
+        self.draft_version_id = nil
+        self.published_version_id = nil
+        save!(validate: false)
       end
 
       # Returns an unsaved copy of draft version for accumulating changes.

data/app/models/concerns/katalyst/content/version.rb

@@ -13,6 +13,12 @@ module Katalyst
         # rubocop:enable Rails/ReflectionClassName
 
         attribute :nodes, Katalyst::Content::Types::NodesType.new, default: -> { [] }
+
+        validate :ensure_items_exists
+      end
+
+      def ensure_items_exists
+        parent.errors.add(:items, :missing_item) unless items.all?(&:present?)
       end
 
       def items
@@ -22,12 +28,16 @@ module Katalyst
 
         items = parent.items.where(id: nodes.map(&:id)).index_by(&:id)
         nodes.map do |node|
-          item       = items[node.id]
-          item.index = node.index
-          item.depth = node.depth
-          item
+          items[node.id]&.tap do |item|
+            item.index = node.index
+            item.depth = node.depth
+          end
         end
       end
+
+      def text
+        items.filter_map(&:to_plain_text).join("\n")
+      end
     end
   end
 end

data/app/{helpers/katalyst/content/application_helper.rb → models/katalyst/content/aside.rb}

@@ -2,7 +2,7 @@
 
 module Katalyst
   module Content
-    module ApplicationHelper
+    class Aside < Layout
     end
   end
 end

data/app/models/katalyst/content/column.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+module Katalyst
+  module Content
+    class Column < Layout
+    end
+  end
+end

data/app/models/katalyst/content/content.rb

@@ -16,6 +16,10 @@ module Katalyst
       def self.permitted_params
         super + %i[content]
       end
+
+      def to_plain_text
+        [super, content.to_plain_text].compact.join("\n") if visible?
+      end
     end
   end
 end

data/app/models/katalyst/content/figure.rb

@@ -0,0 +1,41 @@
+# frozen_string_literal: true
+
+require "active_storage_validations"
+
+module Katalyst
+  module Content
+    class Figure < Item
+      has_one_attached :image
+
+      validates :image,
+                presence:     true,
+                content_type: config.image_mime_types,
+                size:         { less_than: config.max_image_size.megabytes }
+
+      default_scope { with_attached_image }
+
+      def initialize_dup(source)
+        super
+
+        # if image has changed, duplicate the change, otherwise attach the existing blob
+        if source.attachment_changes["image"]
+          self.image = source.attachment_changes["image"].attachable
+        elsif source.image.attached? && !source.image.marked_for_destruction?
+          image.attach(source.image.blob)
+        end
+      end
+
+      def self.permitted_params
+        super - %i[show_heading] + %i[image caption]
+      end
+
+      alias_attribute :alt, :heading
+
+      def to_plain_text
+        text = ["Image: #{alt}"]
+        text << "Caption: #{caption}" if caption.present?
+        text.compact.join("\n") if visible?
+      end
+    end
+  end
+end

data/app/models/katalyst/content/group.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+module Katalyst
+  module Content
+    class Group < Layout
+    end
+  end
+end

data/app/models/katalyst/content/item.rb

@@ -4,10 +4,14 @@ module Katalyst
   module Content
     # STI base class for content items
     class Item < ApplicationRecord
+      def self.config
+        Katalyst::Content.config
+      end
+
       belongs_to :container, polymorphic: true
 
       validates :heading, presence: true
-      validates :background, presence: true, inclusion: { in: Katalyst::Content.config.backgrounds }
+      validates :background, presence: true, inclusion: { in: config.backgrounds }, if: :validate_background?
 
       after_initialize :initialize_tree
 
@@ -25,12 +29,24 @@ module Katalyst
         ]
       end
 
+      def to_plain_text
+        heading if show_heading? && visible?
+      end
+
+      def layout?
+        is_a? Layout
+      end
+
       private
 
       def initialize_tree
         self.parent   ||= nil
         self.children ||= []
       end
+
+      def validate_background?
+        true
+      end
     end
   end
 end

data/app/models/katalyst/content/layout.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+module Katalyst
+  module Content
+    class Layout < Item
+    end
+  end
+end

data/app/models/katalyst/content/section.rb

@@ -0,0 +1,8 @@
+# frozen_string_literal: true
+
+module Katalyst
+  module Content
+    class Section < Layout
+    end
+  end
+end

data/app/views/active_storage/blobs/_blob.html.erb

@@ -1,6 +1,6 @@
 <figure class="attachment attachment--<%= blob.representable? ? "preview" : "file" %> attachment--<%= blob.filename.extension %>">
   <% if blob.representable? %>
-    <%= image_tag blob.representation(resize_to_limit: local_assigns[:in_gallery] ? [ 800, 600 ] : [ 1024, 768 ]) %>
+    <%= image_tag main_app.url_for(blob.representation(resize_to_limit: local_assigns[:in_gallery] ? [ 800, 600 ] : [ 1024, 768 ])) %>
   <% end %>
 
   <figcaption class="attachment__caption">

data/app/views/katalyst/content/asides/_aside.html+form.erb

@@ -0,0 +1,27 @@
+<%= form_with model: aside, scope: :item, url: path do |form| %>
+  <%= render "hidden_fields", form: form %>
+  <%= render "form_errors", form: form %>
+
+  <div class="field">
+    <%= form.label :heading %>
+    <%= form.text_field :heading %>
+  </div>
+
+  <div class="field">
+    <%= form.label :show_heading %>
+    <%= form.check_box :show_heading %>
+  </div>
+
+  <div class="field">
+    <%= form.label :background %>
+    <%= form.select :background, Katalyst::Content.config.backgrounds %>
+  </div>
+
+  <div class="field">
+    <%= form.label :visible %>
+    <%= form.check_box :visible %>
+  </div>
+
+  <%= form.submit "Done" %>
+  <%= link_to "Discard", :back %>
+<% end %>

data/app/views/katalyst/content/asides/_aside.html.erb

@@ -0,0 +1,14 @@
+<%= content_item_tag aside do %>
+  <%= tag.h3 aside.heading if aside.show_heading? %>
+
+  <% items = aside.children.select(&:visible?) %>
+  <% last = items.pop %>
+  <div role="aside-container">
+    <div>
+      <%= render_content_items items %>
+    </div>
+    <aside>
+      <%= render_content_items [last] %>
+    </aside>
+  </div>
+<% end %>