bromcom-ui 2.9.0-rc.8 → 2.9.0

package/dist/collection/components/atoms/icon/static/message-bot.svg

@@ -1,10 +1,10 @@
 <svg width="15" height="14" viewBox="0 0 15 14" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g clip-path="url(#clip0_1215_817)">
-<path d="M13.8 4.8807C13.3877 4.8807 13.2435 5.17186 13.2087 5.2307H12.4V3.15039C12.4 2.18395 11.6169 1.40039 10.65 1.40039H4.35C3.38312 1.40039 2.6 2.18395 2.6 3.15039V5.2307H1.79128C1.7565 5.19133 1.61234 4.8807 1.2 4.8807C0.826813 4.8807 0.5 5.18083 0.5 5.5807C0.5 5.98102 0.827469 6.26102 1.2 6.26102C1.61234 6.26102 1.7565 5.97008 1.79128 5.9307H2.6V8.71102C2.6 9.67745 3.38356 10.461 4.35 10.461L5.4 10.4807V12.318C5.4 12.4101 5.45906 12.6004 5.6625 12.6004C5.71765 12.6004 5.77183 12.5827 5.81772 12.5495L8.55 10.4807L10.65 10.4808C11.6164 10.4808 12.4 9.69727 12.4 8.73083V5.9307H13.2089C13.2444 6.00945 13.3888 6.2807 13.8 6.2807C14.1732 6.2807 14.5 5.98058 14.5 5.60039C14.5 5.20008 14.1741 4.8807 13.8 4.8807ZM11 7.00039C11 7.38692 10.6865 7.70039 10.3 7.70039H4.7C4.31281 7.70039 4 7.38758 4 7.00039V4.20039C4 3.81386 4.31347 3.50039 4.7 3.50039H10.3C10.6865 3.50039 11 3.81386 11 4.20039V7.00039ZM5.4 4.8807C5.01347 4.8807 4.7 5.19417 4.7 5.5807C4.7 5.96723 5.01347 6.2807 5.4 6.2807C5.78653 6.2807 6.1 5.96723 6.1 5.5807C6.1 5.2132 5.78719 4.8807 5.4 4.8807ZM9.6 4.8807C9.21347 4.8807 8.9 5.19417 8.9 5.5807C8.9 5.96723 9.21347 6.2807 9.6 6.2807C9.98653 6.2807 10.3 5.96723 10.3 5.5807C10.3 5.2132 9.98719 4.8807 9.6 4.8807Z" fill="white"/>
+<path d="M13.8 4.8807C13.3877 4.8807 13.2435 5.17186 13.2087 5.2307H12.4V3.15039C12.4 2.18395 11.6169 1.40039 10.65 1.40039H4.35C3.38312 1.40039 2.6 2.18395 2.6 3.15039V5.2307H1.79128C1.7565 5.19133 1.61234 4.8807 1.2 4.8807C0.826813 4.8807 0.5 5.18083 0.5 5.5807C0.5 5.98102 0.827469 6.26102 1.2 6.26102C1.61234 6.26102 1.7565 5.97008 1.79128 5.9307H2.6V8.71102C2.6 9.67745 3.38356 10.461 4.35 10.461L5.4 10.4807V12.318C5.4 12.4101 5.45906 12.6004 5.6625 12.6004C5.71765 12.6004 5.77183 12.5827 5.81772 12.5495L8.55 10.4807L10.65 10.4808C11.6164 10.4808 12.4 9.69727 12.4 8.73083V5.9307H13.2089C13.2444 6.00945 13.3888 6.2807 13.8 6.2807C14.1732 6.2807 14.5 5.98058 14.5 5.60039C14.5 5.20008 14.1741 4.8807 13.8 4.8807ZM11 7.00039C11 7.38692 10.6865 7.70039 10.3 7.70039H4.7C4.31281 7.70039 4 7.38758 4 7.00039V4.20039C4 3.81386 4.31347 3.50039 4.7 3.50039H10.3C10.6865 3.50039 11 3.81386 11 4.20039V7.00039ZM5.4 4.8807C5.01347 4.8807 4.7 5.19417 4.7 5.5807C4.7 5.96723 5.01347 6.2807 5.4 6.2807C5.78653 6.2807 6.1 5.96723 6.1 5.5807C6.1 5.2132 5.78719 4.8807 5.4 4.8807ZM9.6 4.8807C9.21347 4.8807 8.9 5.19417 8.9 5.5807C8.9 5.96723 9.21347 6.2807 9.6 6.2807C9.98653 6.2807 10.3 5.96723 10.3 5.5807C10.3 5.2132 9.98719 4.8807 9.6 4.8807Z" fill="currentColor"/>
 </g>
 <defs>
 <clipPath id="clip0_1215_817">
-<rect width="14" height="14" fill="white" transform="translate(0.5)"/>
+<rect width="14" height="14" fill="currentColor" transform="translate(0.5)"/>
 </clipPath>
 </defs>
 </svg>

package/dist/collection/components/molecules/dropdown/dropdown.js

@@ -238,7 +238,7 @@ export class BcmDropdown {
         "mutable": true,
         "complexType": {
           "original": "KindTypes",
-          "resolved": "\"ghost\" | \"link\" | \"solid\"",
+          "resolved": "\"ghost\" | \"ghost-link\" | \"link\" | \"solid\"",
           "references": {
             "KindTypes": {
               "location": "import",

package/dist/collection/components/molecules/input/input.js

@@ -284,7 +284,6 @@ export class BcmInput {
   whatchHasFocus() {
     const { type, focused, valueCache, inValid } = this;
     if (type == Bcm.InputType.number && inValid) {
-      console.log("whatchHasFocus");
       if (focused) {
         this.value = '';
       }
@@ -310,7 +309,6 @@ export class BcmInput {
     eyeDropper
       .open()
       .then((color) => {
-      console.log("color: ", color.sRGBHex);
       this.setValue(color.sRGBHex);
     })
       .catch((error) => {

package/dist/collection/components/molecules/input-dropdown/input-dropdown.css

@@ -0,0 +1,291 @@
+@import url("https://fonts.googleapis.com/css?family=Roboto:400,500");
+@import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap");
+.size-1 {
+  font-size: 12px;
+  line-height: 20px;
+}
+
+.size-2 {
+  font-size: 14px;
+  line-height: 22px;
+}
+
+.size-3 {
+  font-size: 16px;
+  line-height: 24px;
+}
+
+.size-4 {
+  font-size: 20px;
+  line-height: 28px;
+}
+
+.size-5 {
+  font-size: 24px;
+  line-height: 32px;
+}
+
+.size-6 {
+  font-size: 30px;
+  line-height: 38px;
+}
+
+.size-7 {
+  font-size: 38px;
+  line-height: 46px;
+}
+
+.size-8 {
+  font-size: 46px;
+  line-height: 54px;
+}
+
+.size-9 {
+  font-size: 56px;
+  line-height: 64px;
+}
+
+.weight-regular {
+  font-weight: 400;
+}
+
+.weight-semibold {
+  font-weight: 500;
+}
+
+/**
+ * Generator
+ */
+.input-size-large {
+  height: 40px;
+}
+
+.input-size-medium {
+  height: 32px;
+}
+
+.input-size-small {
+  height: 24px;
+}
+
+.resize-none textarea {
+  resize: none;
+}
+
+.resize-vertical textarea {
+  resize: vertical;
+}
+
+.resize-auto textarea {
+  height: auto;
+  resize: none;
+}
+
+.textarea-size-large {
+  padding: 4px 0 0 4px;
+  min-height: 40px;
+}
+.textarea-size-large .bcm-input-element {
+  min-height: calc((40px - 8px) + 2px);
+}
+.textarea-size-large .input-clear-button {
+  height: calc( 40px - 16px );
+  top: 8px;
+  padding: 0;
+  margin-right: 8px;
+}
+
+.textarea-size-medium {
+  padding: 4px 0 0 4px;
+  min-height: 32px;
+}
+.textarea-size-medium .bcm-input-element {
+  min-height: calc((32px - 8px) + 2px);
+}
+.textarea-size-medium .input-clear-button {
+  height: calc( 32px - 16px );
+  top: 8px;
+  padding: 0;
+  margin-right: 8px;
+}
+
+.textarea-size-small {
+  padding: 0px 0 0 4px;
+  min-height: 24px;
+}
+.textarea-size-small .bcm-input-element {
+  min-height: calc((24px - 8px) + 2px);
+}
+.textarea-size-small .input-clear-button {
+  height: calc( 24px - 16px );
+  top: 8px;
+  padding: 0;
+  margin-right: 8px;
+}
+
+* {
+  box-sizing: border-box;
+}
+
+.bcm-caption-area {
+  font-family: "Inter", sans-serif;
+  font-size: 14px;
+  line-height: calc(14px + 8px);
+  font-weight: 400;
+  font-size: 12px;
+  line-height: calc(12px + 8px);
+  color: var(--bcm-new-ds-color-slate-400);
+  display: flex;
+  flex-direction: row;
+  align-items: flex-start;
+  justify-content: space-between;
+  flex-wrap: nowrap;
+  margin-top: 2px;
+}
+.bcm-caption-area__text {
+  color: var(--bcm-new-ds-color-slate-400);
+}
+.bcm-caption-area__text.default {
+  color: var(--bcm-new-ds-color-slate-400);
+}
+.bcm-caption-area__text.info {
+  color: var(--bcm-new-ds-color-blue-500);
+}
+.bcm-caption-area__text.success {
+  color: var(--bcm-new-ds-color-emerald-500);
+}
+.bcm-caption-area__text.warning {
+  color: var(--bcm-new-ds-color-amber-500);
+}
+.bcm-caption-area__text.error {
+  color: var(--bcm-new-ds-color-red-500);
+}
+.bcm-caption-area__size-small {
+  font-size: 10px;
+  line-height: calc(10px + 8px);
+  min-height: calc(10px + 8px);
+}
+.bcm-caption-area__size-medium {
+  font-size: 12px;
+  line-height: calc(12px + 8px);
+  min-height: calc(12px + 8px);
+}
+.bcm-caption-area__size-large {
+  font-size: 14px;
+  line-height: calc(14px + 8px);
+  min-height: calc(14px + 8px);
+}
+
+* {
+  box-sizing: border-box;
+}
+
+.bcm-label {
+  display: inline-flex;
+  align-items: flex-start;
+  grid-gap: 2px;
+}
+.bcm-label__text {
+  margin-bottom: 2px;
+  font-family: "Inter", sans-serif;
+  font-size: 14px;
+  line-height: calc(14px + 8px);
+  font-weight: 400;
+  display: inline-block;
+  color: var(--bcm-new-ds-color-slate-600);
+}
+.bcm-label__size-small {
+  font-size: 10px;
+  line-height: calc(10px + 8px);
+  min-height: calc(10px + 8px);
+}
+.bcm-label__size-medium {
+  font-size: 12px;
+  line-height: calc(12px + 8px);
+  min-height: calc(12px + 8px);
+}
+.bcm-label__size-large {
+  font-size: 14px;
+  line-height: calc(14px + 8px);
+  min-height: calc(14px + 8px);
+}
+
+.bcm-input[no-margin] {
+  margin: 0;
+}
+
+.bcm-textarea[no-margin] {
+  margin: 0;
+}
+
+.bcm-switch[no-margin] {
+  margin: 0;
+}
+
+.bcm-checkbox[no-margin] {
+  margin: 0;
+}
+
+.bcm-radio-group[no-margin] {
+  margin: 0;
+}
+
+.bcm-checkbox-group[no-margin] {
+  margin: 0;
+}
+
+.bcm-range[no-margin] {
+  margin: 0;
+}
+
+.bcm-form[no-margin] {
+  margin: 0;
+}
+
+.bcm-form-group[no-margin] {
+  margin: 0;
+}
+
+.bcm-list[no-margin] {
+  margin: 0;
+}
+
+.bcm-colorpicker[no-margin] {
+  margin: 0;
+}
+
+.bcm-date-picker[no-margin] {
+  margin: 0;
+}
+
+.bcm-time-picker[no-margin] {
+  margin: 0;
+}
+
+.bcm-datetime-picker[no-margin] {
+  margin: 0;
+}
+
+.bcm-select[no-margin] {
+  margin: 0;
+}
+
+.bcm-listbox[no-margin] {
+  margin: 0;
+}
+
+:host {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  position: relative;
+}
+
+.input-dropdown-button i {
+  transition: transform 0.2s ease-in-out;
+}
+.input-dropdown-button[linked-is-open] > i {
+  transform: rotate(-180deg);
+  transition: transform 0.2s ease-in-out;
+}