@useinsider/guido 1.0.0-beta.df613dd → 1.0.0-beta.e08abf8

package/dist/static/styles/components/amp-block.css.js

@@ -0,0 +1,18 @@
+const n = `.amp-input-list {
+    box-shadow: none;
+    border: 1px solid var(--guido-color-gray-300);
+    margin-bottom: 16px;
+}
+
+.amp-input-list:last-child {
+    margin-bottom: 0;
+}
+
+.amp-input-list.active,
+.amp-input-list:hover {
+    background-color: var(--guido-color-neutral-100);
+}
+`;
+export {
+  n as default
+};

package/dist/static/styles/components/base-input.css.js

@@ -0,0 +1,47 @@
+const n = `.base-input {
+    border: 1px solid var(--guido-color-gray-300);
+    border-radius: 4px;
+    background-color: var(--guido-color-gray-0);
+    align-items: center;
+    height: 40px;
+    max-height: 40px;
+    box-sizing: content-box;
+    outline: none;
+    resize: vertical;
+    padding: 8px;
+    font-size: 13px;
+    color: var(--guido-color-gray-800);
+    box-shadow: none !important;
+    box-sizing: border-box !important;
+}
+
+.base-input:hover:not(:disabled) {
+    background-color: var(--guido-color-gray-0);
+    border-color: var(--guido-color-primary-500);
+}
+
+.base-input:focus:not(:disabled),
+.base-input.focused {
+    background-color: var(--guido-color-gray-0);
+    border-color: var(--guido-color-primary-500);
+    box-shadow: 0 0 0 3px var(--guido-color-primary-200) !important;
+}
+
+ue-contenteditable {
+    height: 40px;
+    overflow: unset;
+}
+
+ue-contenteditable .base-input {
+    line-height: 24px;
+}
+
+ue-icon-component.icon-button.icon-clear-input {
+    right: 2px;
+    top: 2px;
+    padding: 9px;
+}
+`;
+export {
+  n as default
+};

package/dist/static/styles/components/button-group.css.js

@@ -0,0 +1,54 @@
+const o = `/* Radio Buttons and Check Buttons */
+
+.button-group {
+    padding: 0;
+    column-gap: 0;
+    border-radius: 0;
+    background-color: transparent;
+}
+
+.button-group .button {
+    background-color: var(--guido-color-gray-0);
+    outline: none;
+    padding: 8px 12px;
+    border: 1px solid var(--guido-color-gray-300);
+    box-shadow: none;
+    height: 40px;
+}
+
+.button-group .button:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-gray-1);
+}
+
+.button-group .button ue-icon-component.icon-button {
+    color: var(--guido-color-gray-800);
+}
+
+.button-group > div:first-of-type .button {
+    border-radius: 4px 0 0 4px;
+}
+
+.button-group > *:last-child .button {
+    border-radius: 0 4px 4px 0;
+}
+
+ue-check-buttons input:checked + .button,
+ue-radio-buttons input:checked + .button {
+    background-color: var(--guido-color-primary-100);
+    color: var(--guido-color-primary-500);
+    border-color: var(--guido-color-primary-500);
+}
+
+ue-check-buttons input:checked + .button ue-icon-component.icon-button,
+ue-radio-buttons input:checked + .button ue-icon-component.icon-button {
+    color: var(--guido-color-primary-500);
+}
+
+ue-check-buttons input:checked + label:hover:not(:disabled,.disabled),
+ue-radio-buttons input:checked + label:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-primary-100) !important;
+}
+`;
+export {
+  o as default
+};

package/dist/static/styles/components/button.css.js

@@ -0,0 +1,106 @@
+const o = `.control-shadow-wrapper:has(.button) {
+    border-radius: 0;
+    box-shadow: none;
+    background-color: transparent;
+    padding: 0;
+}
+
+.button {
+    min-width: 40px;
+    min-height: 40px;
+    padding: 8px;
+    background-color: var(--guido-color-gray-0);
+    border: 1px solid var(--guido-color-gray-300);
+    border-radius: 4px;
+    box-shadow: none;
+}
+
+.button:not(:disabled,.disabled):active {
+    transform: none !important;
+}
+
+.button:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-gray-1);
+}
+
+.button .icon-button {
+    color: var(--guido-color-gray-800);
+}
+
+.on > .button {
+    background-color: var(--guido-color-primary-100);
+    color: var(--guido-color-primary-500);
+    border-color: var(--guido-color-primary-500);
+    box-shadow: none;
+}
+
+.on > .button .icon-button {
+    color: var(--guido-color-primary-500);
+}
+
+.on > .button:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-primary-100);
+}
+
+.e2e-remove-container-item .button .icon-button,
+.e2e-delete-menu-btn .button .icon-button {
+    color: var(--guido-color-danger-500);
+}
+
+.e2e-text-insert-controls .control-shadow-wrapper:not(:last-of-type) {
+    margin-right: 16px;
+}
+
+.flat-white > .button {
+    border: 0;
+}
+
+.flat-white > .button:hover:not(:disabled,.disabled) {
+    background-color: transparent !important;
+    color: var(--guido-color-primary-500);
+}
+
+.flat-white > .button:hover:not(:disabled,.disabled) {
+    color: var(--guido-color-primary-500);
+}
+
+ue-check-button.checked:not(.flat-white) input:checked + label {
+    background-color: var(--guido-color-primary-100);
+    color: var(--guido-color-primary-500);
+    border: 1px solid var(--guido-color-primary-500);
+    box-shadow: none;
+}
+
+ue-check-button.checked:not(.flat-white) input:checked + label:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-primary-100);
+}
+
+ue-check-button.checked:not(.flat-white) input:checked + label .icon-button {
+    color: var(--guido-color-primary-500);
+}
+
+ue-select.full-width .button {
+    border: none !important;
+    background-color: var(--guido-color-neutral-200) !important;
+    color: var(--guido-color-neutral-800) !important;
+}
+
+ue-select.full-width .button .icon-button {
+    color: var(--guido-color-gray-600) !important;
+}
+
+ue-select.full-width .button:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-neutral-100) !important;
+}
+
+ue-color {
+    width: 80px;
+}
+
+ue-color .base-input {
+    width: 100%;
+}
+`;
+export {
+  o as default
+};

package/dist/static/styles/components/combobox.css.js

@@ -0,0 +1,49 @@
+const o = `.control-shadow-wrapper:has(.button[role="combobox"]) {
+    border-radius: 0;
+    padding: 0;
+    background: transparent;
+}
+
+ue-select .button, 
+ue-mergetags .button, 
+ue-font-family-select .button {
+    background-color: var(--guido-color-gray-0);
+    border: 1px solid var(--guido-color-gray-300);
+    border-radius: 4px;
+    box-shadow: none;
+    min-height: 40px;
+    padding: 8px;
+    font-size: 13px;
+    color: var(--guido-color-gray-800);
+    text-align: left;
+    outline: none;
+    white-space: nowrap;
+    text-overflow: ellipsis;
+    overflow: hidden;
+}
+
+ue-select .button:hover:not(:disabled,.disabled), 
+ue-mergetags .button.button:hover:not(:disabled,.disabled), 
+ue-font-family-select .button.button:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-gray-0);
+    border-color: var(--guido-color-primary-500);
+}
+
+ue-select .button.on, 
+ue-mergetags .button.on, 
+ue-font-family-select .button.on {
+    background-color: var(--guido-color-gray-0);
+    border-color: var(--guido-color-primary-500);
+    box-shadow: 0 0 0 3px var(--guido-color-primary-200) !important;
+}
+
+ue-select .button > .icon-button, 
+ue-mergetags .button > .icon-button, 
+ue-font-family-select .button > .icon-button {
+    margin-left: 0;
+    margin-right: 0;
+}
+`;
+export {
+  o as default
+};

package/dist/static/styles/components/counter.css.js

@@ -0,0 +1,42 @@
+const o = `ue-counter {
+    padding: 0 !important;
+    background-color: var(--guido-color-gray-0) !important;
+    border-radius: 0;
+}
+
+ue-counter .button {
+    width: 40px;
+    height: 40px;
+    box-shadow: none;
+    background-color: var(--guido-color-gray-0);
+    border: 1px solid var(--guido-color-gray-300);
+}
+
+ue-counter .button:hover:not(:disabled,.disabled) {
+    background-color: var(--guido-color-gray-1);
+}
+
+ue-counter .button .icon-button {
+    color: var(--guido-color-gray-600);
+}
+
+ue-counter .button.disabled .icon-button {
+    color: var(--guido-color-gray-700);
+}
+
+ue-counter ue-button:first-child .button {
+    border-radius: 4px 0 0 4px;
+}
+
+ue-counter ue-button:last-child .button {
+    border-radius: 0 4px 4px 0;
+}
+
+ue-counter .input {
+    border-top: 1px solid var(--guido-color-gray-300);
+    border-bottom: 1px solid var(--guido-color-gray-300);
+}
+`;
+export {
+  o as default
+};

package/dist/static/styles/components/dropdown-menu.css.js

@@ -0,0 +1,52 @@
+const n = `ue-dropdown {
+    border-radius: 4px;
+    border: 1px solid var(--guido-color-gray-300);
+    box-shadow: 0 8px 10px -6px var(--ue-base-shadow-color, rgba(0, 0, 0, .1)),0 15px 35px -5px var(--ue-base-shadow-color, rgba(0, 0, 0, .1));
+}
+
+ue-dropdown .service-element.padding-t-3 {
+    padding-top: 8px;
+}
+
+.dropdown__search {
+    padding: 0 8px 16px;
+}
+
+.dropdown__tabs {
+    padding: 8px;
+}
+
+.dropdown__category {
+    padding: 16px 16px 0;
+    margin: 0;
+    text-transform: uppercase;
+    font-size: 13px;
+    letter-spacing: 1.2px;
+    font-weight: 600;
+    line-height: 20px;
+    color: var(--guido-color-gray-600);
+}
+
+.dropdown__item {
+    padding: 8px 16px;
+    margin: 0;
+    border-radius: 0;
+    background-color: var(--guido-color-gray-100);
+    color: var(--guido-color-gray-800);
+}
+
+.dropdown__menu ue-icon-component.icon-button {
+    color: var(--guido-color-primary-500);
+}
+
+.menu {
+    padding: 8px 0px;
+}
+
+.menu .menu-item {
+    padding: 8px;
+}
+`;
+export {
+  n as default
+};

package/dist/static/styles/components/narrow-panel.css.js

@@ -0,0 +1,38 @@
+const o = `ue-ui-headed-simple-panel,
+ue-ui-simple-panel,
+.modules-panel-small-content {
+    box-shadow: var(--guido-box-shadow);
+    border: 1px solid var(--guido-color-gray-300);
+}
+
+ue-stripe-thumb,
+.ue-stripe-thumb {
+    box-shadow: none;
+    border: 1px solid var(--guido-color-gray-300);
+}
+
+ue-stripe-thumb:hover:not(.disabled),
+.ue-stripe-thumb:hover:not(.disabled) {
+    box-shadow: none;
+    border: 1px solid var(--guido-color-primary-500);
+}
+
+.block-thumb {
+    box-shadow: none;
+    border: 1px solid var(--guido-color-gray-300);
+}
+
+.ue-dragged-node-component>.block-thumb,
+.block-thumb:hover:not(.disabled) {
+    box-shadow: none;
+    border-color: var(--guido-color-primary-500);
+}
+
+.modules-layout-wrapper {
+    padding: 0 16px 16px;
+    grid-row-gap: 16px;
+}
+`;
+export {
+  o as default
+};

package/dist/static/styles/components/switcher.css.js

@@ -0,0 +1,11 @@
+const e = `ue-switcher input {
+    border-radius: 26px;
+} 
+
+ue-switcher input:before {
+    border-radius: 22px;
+}
+`;
+export {
+  e as default
+};

package/dist/static/styles/components/tabs.css.js

@@ -0,0 +1,97 @@
+const n = `
+
+ue-tabs-header .tabs-header {
+    padding: 0;
+    column-gap: 0;
+    background-color: transparent;
+}
+
+.control-panel-tabs .tabs-header {
+    margin: 16px 16px 0;
+}
+
+ue-tabs-header .tabs-header button {
+    background-color: var(--guido-color-gray-0);
+    outline: none;
+    padding: 8px 16px;
+    border: 1px solid var(--guido-color-gray-300);
+    height: 40px;
+    font-size: 15px;
+}
+
+ue-tabs-header .tabs-header button:hover:not(:disabled,.disabled,.checked) {
+    background-color: var(--guido-color-gray-1);
+}
+
+ue-tabs-header .tabs-header button ue-icon-component.icon-button {
+    color: var(--guido-color-gray-800);
+}
+
+ue-tabs-header .tabs-header button:before {
+    content: none;
+}
+
+ue-tabs-header .tabs-header button:not(:last-child),
+ue-tabs-header .tabs-header button:not(:first-child) {
+    border-radius: 0;
+}
+
+ue-tabs-header .tabs-header button:first-child {
+    border-radius: 4px 0 0 4px;
+}
+
+ue-tabs-header .tabs-header button:last-child {
+    border-radius: 0 4px 4px 0;
+}
+
+ue-tabs-header .tabs-header button:first-child:last-child {
+    border-radius: 4px;
+}
+
+ue-tabs-header .tabs-header button.checked {
+    background-color: var(--guido-color-primary-100);
+    color: var(--guido-color-primary-500);
+    border-color: var(--guido-color-primary-500);
+}
+
+ue-tabs-header .tabs-header button.checked ue-icon-component.icon-button {
+    color: var(--guido-color-primary-500);
+}
+
+.ue-radio-tabs .button-group {
+    padding: 0;
+    column-gap: 0;
+    background-color: transparent;
+}
+
+.ue-radio-tabs .button-group .button {
+    background-color: var(--guido-color-gray-0);
+    outline: none;
+    padding: 8px 16px;
+    border: 1px solid var(--guido-color-gray-300);
+    height: 40px;
+    font-size: 15px;
+}
+
+.ue-radio-tabs .button-group input:checked + label {
+    box-shadow: none;
+    background-color: var(--guido-color-primary-100);
+    color: var(--guido-color-primary-500);
+    border-color: var(--guido-color-primary-500);
+}
+
+.ue-radio-tabs .button-group > div:first-of-type .button {
+    border-radius: 4px 0 0 4px !important;
+}
+
+.ue-radio-tabs .button-group > div:last-of-type .button {
+    border-radius: 0 4px 4px 0 !important;
+}
+
+.ue-radio-tabs .button-group > div:first-of-type:last-of-type .button {
+    border-radius: 4px !important;
+}
+`;
+export {
+  n as default
+};

package/dist/static/styles/components/tools.css.js

@@ -0,0 +1,23 @@
+const o = `ue-emoji .emoji-tabs .active-smile-tab {
+    border-color: var(--guido-color-primary-500);
+}
+
+ue-insert-table .hovered-template-cell {
+    background: var(--guido-color-primary-100);
+}
+
+ue-insert-table .template-row,
+ue-insert-table .template-row:last-child,
+ue-insert-table .template-cell {
+    border-color: var(--guido-color-primary-500);
+}
+
+.ue-popover.light {
+    border-radius: 4px;
+    border: 1px solid var(--guido-color-gray-300);
+    box-shadow: var(--guido-box-shadow);
+}
+`;
+export {
+  o as default
+};

package/dist/static/styles/components/version-history.css.js

@@ -0,0 +1,30 @@
+const o = `.patch-session-container {
+    row-gap: 16px;
+}
+
+ue-vh-group {
+    box-shadow: none;
+    border: 1px solid var(--guido-color-gray-300);
+    border-radius: 4px;
+}
+
+ue-vh-group:has(ue-vh-patch.selected) {
+    border-color: var(--guido-color-primary-500);
+}
+
+ue-vh-patch.selected .patch-wrapper {
+    box-shadow: none;
+}
+
+ue-vh-patch:hover .patch-wrapper {
+    background: var(--guido-color-neutral-100);
+}
+
+ue-vh-patch.selected .patch-wrapper {
+    background-color: var(--guido-color-primary-100);
+    box-shadow: 0 0 0 1px var(--guido-color-primary-500);
+}
+`;
+export {
+  o as default
+};

package/dist/static/styles/components/wide-panel.css.js

@@ -0,0 +1,135 @@
+const n = `ue-wide-panel {
+    width: 425px;
+}
+
+ue-main-tabs-panel-component .fixed-panel-header {
+    display: none;
+}
+
+.label {
+    font-size: 13px;
+    color: var(--guido-color-gray-800);
+}
+
+.stacked-panel-title {
+    padding: 16px;
+    font-size: 16px;
+    font-weight: 600;
+    color: var(--guido-color-gray-800);
+    text-align: left;
+}
+
+.stacked-panel-item {
+    border-radius: 4px;
+    border: 1px solid var(--guido-color-gray-300);
+    box-shadow: var(--guido-box-shadow);
+}
+
+.container {
+    padding: 16px;
+    grid-column-gap: 8px;
+}
+
+.container.widest-spacing {
+    grid-column-gap: 16px;
+    grid-row-gap: 16px;
+}
+
+.container.parent-container > .container {
+    padding: 0 16px;
+}
+
+.container .container.has-container-separator {
+    padding-top: 16px;
+}
+
+ue-control-panel,
+.common-wrapper {
+    border: 1px solid var(--guido-color-gray-300);
+    box-shadow: var(--guido-box-shadow);
+}
+
+.control-panel-header {
+    grid-template-columns: repeat(12, 1fr);
+    padding: 0;
+}
+
+.control-panel-header > * {
+    display: flex;
+    align-items: center;
+}
+
+.header-control-panel-left {
+    grid-area: 1 / 1 / 2 / 2;
+}
+
+.header-control-panel-label {
+    grid-area: 1 / 2 / 2 / 12;
+    text-align: left;
+    padding: 0;
+    font-size: 16px;
+    font-weight: 600;
+    line-height: 24px;
+}
+
+.header-control-panel-right {
+    grid-area: 1 / 12 / 2 / 13;
+}
+
+.control-panel-header button {
+    padding: 16px !important;
+    border: 0;
+    min-height: auto;
+}
+
+.container.droppable-header-container ue-button:last-child {
+    margin-right: 0;
+}
+
+.secondary-control-group {
+    gap: 16px;
+}
+
+.droppable-container {
+    padding-top: 6px;
+}
+
+.control-plus-rounded-wrapper {
+    border-radius: 4px;
+    border: 1px solid var(--guido-color-gray-300);
+}
+
+.structure-item-container {
+    padding: 8px 16px 8px 10px;
+}
+
+ue-label {
+    align-items: center;
+}
+
+ue-label.accent-dot:before {
+    content: none;
+}
+
+ue-label.accent-dot:after {
+    content: "New";
+    width: auto;
+    height: auto;
+    border-radius: 4px;
+    background: var(--guido-color-primary-500);
+    z-index: 2;
+    color: var(--guido-color-white);
+    padding: 4px 8px;
+    right: 1px;
+    font-size: 13px;
+}
+
+.e2e-size,
+.e2e-timer-size {
+    grid-auto-flow: row;
+    grid-template-columns: 1fr !important;
+}
+`;
+export {
+  n as default
+};