builder-settings-types 0.0.76 → 0.0.78

package/dist/colors.svg

@@ -1,3 +1,3 @@
-<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M8.99999 15.8542C9.79613 16.5667 10.8475 17 12 17C14.4853 17 16.5 14.9853 16.5 12.5C16.5 10.4248 15.0953 8.67769 13.1849 8.15763M4.81513 8.15762C2.9047 8.67768 1.5 10.4248 1.5 12.5C1.5 14.9853 3.51472 17 6 17C8.48528 17 10.5 14.9853 10.5 12.5C10.5 11.9146 10.3882 11.3554 10.1849 10.8424M13.5 6.5C13.5 8.98528 11.4853 11 9 11C6.51472 11 4.5 8.98528 4.5 6.5C4.5 4.01472 6.51472 2 9 2C11.4853 2 13.5 4.01472 13.5 6.5Z" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.99999 15.8542C9.79613 16.5667 10.8475 17 12 17C14.4853 17 16.5 14.9853 16.5 12.5C16.5 10.4248 15.0953 8.67769 13.1849 8.15763M4.81513 8.15762C2.9047 8.67768 1.5 10.4248 1.5 12.5C1.5 14.9853 3.51472 17 6 17C8.48528 17 10.5 14.9853 10.5 12.5C10.5 11.9146 10.3882 11.3554 10.1849 10.8424M13.5 6.5C13.5 8.98528 11.4853 11 9 11C6.51472 11 4.5 8.98528 4.5 6.5C4.5 4.01472 6.51472 2 9 2C11.4853 2 13.5 4.01472 13.5 6.5Z" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/dist/index.css

@@ -1 +1 @@
-@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";@import"https://fonts.cdnfonts.com/css/satoshi";.setting-group{padding:16px 8px;display:flex;flex-direction:column;max-width:268px;gap:8px;border:1px solid #D0D5DD;border-radius:8px;background:#f8f8f8;width:100%;margin:auto;-webkit-user-select:none;user-select:none;box-shadow:0 1px 2px #1018280d}.setting-group .setting-group{width:100%;padding:8px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:12px;border:0;border-radius:8px;background-color:var(--color-white);box-shadow:0 1px 2px #1018280d}.setting-group .setting-group .setting-group-content .setting-group{border:1px solid #D0D5DD}.setting-group .setting-group:nth-child(1){border-bottom:solid 1px var(--color-border)}.setting-group-title{display:flex;justify-content:space-between;align-items:center;align-self:stretch}.setting-group-title h3{color:#344054;font-family:Satoshi,sans-serif;font-size:14px;font-weight:700;line-height:20px}.setting-group-arrow{transform:rotate(180deg);display:flex;cursor:pointer;transition:transform .3s ease-in-out}.setting-group-arrow.rotated{transform:rotate(0)}.setting-group-content.collapsed{max-height:0;display:none}.setting-group-content{display:flex;padding:4px;flex-direction:column;align-items:flex-start;gap:8px;align-self:stretch;border-radius:8px;position:relative;background:#fff;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808}.main-content{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:8px;align-self:stretch;border-radius:8px;background:#f8f8f8;border:0;box-shadow:none;padding:0}.main-group{border:0;border-bottom:1px solid #D0D5DD}.icon-container{display:flex;align-items:center;gap:4px}.input-icon{display:flex;align-items:center;justify-content:center;color:var(--color-text)}.input-label{color:var(--color-text)}.input-container{display:inline-flex;align-items:center;position:relative}.with-suffix{flex:1;padding-right:36px}.input-suffix{position:absolute;right:8px;top:50%;transform:translateY(-50%);color:#666;pointer-events:none;font-size:.9em}.string-setting-wrapper{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.string-setting-input{max-width:120px;padding:8px;font-size:14px;border-radius:8px;color:var(--color-input-text);border:1px solid var(--color-border);background:var(--color-bg)}.color-setting-wrapper{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.color-input-wrapper{position:relative;padding:8px 8px 8px 4px;width:120px;height:33px;display:flex;align-items:center;gap:4px;border:1px solid var(--color-border);border-radius:8px;background-color:var(--color-bg)}.color-text-input{border:none;outline:none;width:65px;color:var(--color-input-text);font-size:14px;text-align:center;background:transparent}.color-picker{position:absolute;left:0;top:0;width:25px;height:25px;opacity:0;cursor:pointer}.color-preview{width:25px;height:25px;border-radius:4px}.number-setting-wrapper{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center;position:relative}.number-setting-input{width:120px;padding:8px;font-size:14px;border-radius:8px;color:#292b2e;border:1px solid var(--color-border);background:var(--color-bg);box-sizing:border-box}.suffix-label{position:absolute;right:8px;padding-left:8px;border-left:1px solid var(--color-divider);font-size:12px;color:var(--color-text)}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.select-container{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center;position:relative}.select-button{width:120px;height:33px;display:flex;padding:8px;border-radius:8px;border:1px solid var(--color-border);background:var(--color-bg);cursor:pointer;font-size:13px;font-weight:400;color:#292b2e;position:relative;text-align:center}.select-options{display:none;position:absolute;top:100%;left:0;right:0;max-height:200px;overflow-y:auto;margin:4px 0 0;list-style-type:none;background:var(--color-bg);border:1px solid var(--color-border);border-radius:8px;z-index:10;flex-direction:column;color:#101828;align-items:flex-start;border:1px solid rgba(208,213,221,1);background:#fff;padding:4px 0;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808}.select-options.open{display:flex;padding:4px}.select-option{padding:12px;width:100%;display:flex;align-items:center;cursor:pointer;color:#292b2e;border-radius:8px}.select-option:hover{background:#eaecf0}.svg-container{position:absolute;right:8px;top:50%;transform:translateY(-7px) rotate(0);transition:transform .3s ease-out;cursor:pointer}.svg-container .svg-select{stroke:#000;transition:transform .3s ease-out;width:16px;height:16px}.svg-container.open .svg-select{transform:rotate(180deg)}.select-options::-webkit-scrollbar{width:10px}.select-options::-webkit-scrollbar-track{background:transparent;border-radius:8px}.select-options::-webkit-scrollbar-thumb{background:#eaecf0;border-radius:8px;border:2px solid transparent;background-clip:content-box}.select-options::-webkit-scrollbar-thumb:hover{background:#555}.align-setting-wrapper{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.align-setting-label{font-size:12px;color:var(--color-text)}.align-options-container{width:120px;color:#0006;background-color:#f5f6f7;border-radius:9999px;padding:4px 13px;display:flex;gap:8px}.align-option-button{display:flex;align-items:center;justify-content:center;width:26px;height:26px;background:transparent;border:none;cursor:pointer;border-radius:50%;transition:background-color .2s,color .2s}.align-option-button:hover{background-color:#fff}.align-option-button.selected{background-color:var(--color-white);color:var(--color-black)}.button-setting-wrapper{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.button-setting{padding:8px 16px;background-color:var(--button-bg, #007bff);color:var(--button-color, #fff);border:none;border-radius:4px;cursor:pointer;font-size:14px}.button-setting:hover{background-color:var(--button-bg-hover, #0056b3)}.dimension-setting-container{display:flex;flex-direction:column;gap:8px;position:relative}.dimension-bracket{width:18px;height:42px;position:absolute;top:16px;right:122px;display:flex;align-items:center;justify-content:center}.dimension-bracket:before{content:"";position:absolute;width:13px;height:14px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='15' viewBox='0 0 14 15' fill='none'><path d='M14 1H5C2.79086 1 1 2.79086 1 5V15' stroke='%23667085'/></svg>") no-repeat center center;background-size:contain;top:0;right:1px}.dimension-bracket:after{content:"";position:absolute;width:13px;height:14px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='15' viewBox='0 0 14 15' fill='none'><path d='M14 14H5C2.79086 14 1 12.2091 1 10V4.76837e-07' stroke='%23667085'/></svg>") no-repeat center center;background-size:contain;bottom:0;right:1px}.dimension-lock-icon{width:24px;height:24px;background:none;cursor:pointer;display:inline-flex;align-items:center;color:#667085;z-index:1}.dimension-lock-icon:hover{color:#000}.upload-setting-wrapper{display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr;gap:10px;align-items:center;width:100%}.icon-title-container{grid-column:1 / 2;grid-row:1 / 2}.preview-wrapper,.upload-button{grid-row:2 / 3;display:inline-flex;align-items:center;gap:10px}.preview-wrapper{position:relative;width:91px;height:71px;border-radius:4px;overflow:hidden;background-color:#f2f4f7;display:none}.preview-wrapper.has-image{display:block}.upload-preview{width:100%;height:100%;object-fit:cover;border-radius:4px;display:none;object-fit:contain;padding:3px}.empty-state{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.empty-state svg{width:100%;height:100%}.preview-wrapper.has-image .upload-preview{display:block}.preview-wrapper.has-image .empty-state{display:none}.upload-button{display:inline-flex;align-items:center;padding:5px 4px;background-color:var(--color-white);border:1px solid var(--color-border-secondary);border-radius:12px;cursor:pointer;max-height:40px;transition:transform .15s ease,box-shadow .15s ease}.preview-wrapper:not(.has-image)~.upload-button{width:100%;justify-content:center}.upload-icon{padding:7px 8px 8px 7px;display:flex;align-items:center;justify-content:center;background-color:var(--color-bg-icon);border-radius:28px}.upload-label{display:inline-block;font-size:12px;font-weight:600;color:var(--color-btn-text);transition:transform .15s ease}.upload-button:hover{transform:scale(1.02);box-shadow:0 2px 6px #0000001a}.delete-button{display:flex;width:28px;height:28px;padding:6px;justify-content:center;align-items:center;gap:8px;position:absolute;left:60px;top:3px;background:#fff;border:none;border-radius:50%;cursor:pointer;box-shadow:0 2px 4px #0000001a;transition:background-color .2s ease}.delete-button svg{width:16px;height:16px;flex-shrink:0}.delete-button:hover{background-color:#f3f4f6}.preview-wrapper:not(.has-image) .delete-button{display:none}.height-setting{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.height-setting-wrapper{display:flex;align-items:center;justify-content:space-between;gap:2px}.height-input-wrapper{position:relative;padding:8px 8px 8px 4px;width:120px;height:33px;display:flex;align-items:center;gap:4px;border:1px solid var(--color-border);border-radius:8px;background-color:var(--color-bg)}.height-text-input{border:none;outline:none;width:65px;color:var(--color-input-text);font-size:14px;text-align:center;background:transparent}.width-setting{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.width-setting-wrapper{display:flex;align-items:center;justify-content:space-between;gap:2px}.width-input-wrapper{position:relative;padding:8px 8px 8px 4px;width:120px;height:33px;display:flex;align-items:center;gap:4px;border:1px solid var(--color-border);border-radius:8px;background-color:var(--color-bg)}.width-text-input{border:none;outline:none;width:65px;color:var(--color-input-text);font-size:14px;text-align:center;background:transparent}.width-setting .number-setting{width:100%}.select-api-container{display:grid;grid-template-columns:1fr;place-content:center;align-items:center;position:relative;width:100%}.select-api-button{width:100%;height:48px;display:flex;align-items:end;padding:8px;border-radius:8px;border:1px solid var(--color-border);background:#fff;cursor:pointer;font-size:13px;font-weight:400;color:#292b2e;position:relative;text-align:center;font-weight:700}.select-api-options{display:none;position:absolute;top:100%;left:0;right:0;max-height:200px;overflow-y:auto;margin:4px 0 0;list-style-type:none;background:var(--color-bg);border:1px solid var(--color-border);border-radius:8px;z-index:10;flex-direction:column;color:#101828;align-items:flex-start;border:1px solid rgba(208,213,221,1);background:#fff;padding:4px 0;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808}.select-api-options.open{display:flex;padding:4px}.select-api-option{padding:12px;width:100%;display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:#292b2e;border-radius:8px}.select-api-option:hover{background:#eaecf0}.svg-container{position:absolute;right:8px;top:45%;transform:translateY(-7px) rotate(0);transition:transform .3s ease-out;cursor:pointer}.svg-container .svg-select-api{stroke:#000;transition:transform .3s ease-out;width:20px;height:20px}.svg-container.open .svg-select-api{transform:rotate(180deg)}.select-api-options::-webkit-scrollbar{width:10px}.select-api-options::-webkit-scrollbar-track{background:transparent;border-radius:8px}.select-api-options::-webkit-scrollbar-thumb{background:#eaecf0;border-radius:8px;border:2px solid transparent;background-clip:content-box}.select-api-options::-webkit-scrollbar-thumb:hover{background:#555}.select-api-radio{width:16px;height:16px;border-radius:50%;border:1px solid var(--color-border);background:var(--color-bg)}.select-api-container .icon-container .input-label{position:absolute;top:18%;font-family:Inter;font-size:12px;font-style:normal;font-weight:400;line-height:normal;transform:translate(13%);color:#667085;z-index:10}.tab-delete-button{background:transparent;border:none;cursor:pointer;padding:2px 4px}.tab-delete-button svg{width:16px;height:16px}.tabs-add-btn-container{display:flex;justify-content:flex-end}.tabs-add-button{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:6px;cursor:pointer;font-size:14px;color:#667085;transition:transform .15s ease,box-shadow .3s ease}.tabs-add-button:hover{transform:scale(1);box-shadow:0 2px 6px #0000001a}.add-icon{display:flex;align-items:center;width:18px}.add-label{display:inline-block}.bgset-or-label{margin:8px 0;text-align:center;font-weight:500;color:#667085;align-self:center}:root{--color-border: #D5DCE5;--color-bg: #F8F8F8;--color-border-secondary: #eaecf0;--color-text: #667085;--color-title: #344054;--color-input-text: #292b2e;--color-white: #fff;--color-black: #000;--color-divider: #dcdcdc;--color-btn-text: #4b4b4b;--color-bg-icon: #f2f4f7}*{padding:0;margin:0;border:none}*,*:before,*:after{box-sizing:border-box}a,a:link,a:visited,a:hover{text-decoration:none}body{font-family:Satoshi,sans-serif;font-weight:400;font-size:12px;line-height:18px}aside,nav,footer,header,section,main{display:block}h1,h2,h3,h4,h5,h6,p{font-size:inherit;font-weight:inherit}ul,ul li{list-style:none}img{vertical-align:top}img,svg{max-width:100%;height:auto}address{font-style:normal}input::-ms-clear{display:none}button,input[type=submit]{display:inline-block;box-shadow:none;background-color:transparent;background:none;cursor:pointer}input:focus,input:active,button:focus,button:active{outline:none}button::-moz-focus-inner{padding:0;border:0}label{cursor:pointer}legend{display:block}
+@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";@import"https://fonts.cdnfonts.com/css/satoshi";.setting-group{padding:16px;display:flex;flex-direction:column;width:100%;gap:12px;border:1px solid var(--Gray-200, #eaecf0);border-radius:8px;background:#fff;margin:0 auto;-webkit-user-select:none;user-select:none;box-shadow:0 1px 3px #1018281a,0 1px 2px #1018280f;transition:all .2s ease-in-out}.setting-group.collapsed{padding:0;border:none;background:transparent;box-shadow:none}.setting-group .setting-group{width:100%;padding:8px;border:1px solid #d0d5dd;border-radius:8px;background-color:#fff;box-shadow:none;margin:0}.setting-group .setting-group.collapsed{padding:0;border:none;background:transparent;margin:0}.setting-group .setting-group .setting-group-content.collapsed{padding:0}.setting-group .setting-group .setting-group{border-radius:8px;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808;border:1px solid #eaecf0}.setting-group .setting-group .setting-group.collapsed{padding:0;border:none;background:transparent;margin:0;box-shadow:none}.setting-group .setting-group.collapsed{padding-bottom:0}.setting-group .setting-group .setting-group-content{padding:0}.setting-group-title{display:flex;justify-content:space-between;align-items:center;padding:4px 0;cursor:pointer;border-radius:6px;transition:none}.setting-group-title:hover,.setting-group-title:hover .setting-group-arrow{background-color:transparent}.setting-group-title h3{color:var(--Gray-800, #1d2939);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;font-size:14px;font-weight:500;line-height:20px;margin:0;padding:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.setting-group-arrow{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:4px;transition:transform .3s cubic-bezier(.34,1.56,.64,1);color:var(--Gray-500, #667085)}.setting-group-arrow.rotated{transform:rotate(180deg)}.setting-group-content{display:flex;flex-direction:column;width:100%;gap:12px;overflow:hidden;transition:max-height .3s ease,opacity .3s ease;max-height:2000px;opacity:1;padding:0 16px 16px}.setting-group-content.collapsed{max-height:0;opacity:0;margin:0;padding:0;pointer-events:none}.setting-group.main-group{padding:16px;border:none;border-bottom:1px solid var(--Border-default, #d5dce5);box-shadow:none;margin-bottom:4px;margin-top:4px;background:#f8f8f8;border-radius:8px}.setting-group.main-group.collapsed{padding:0;background:transparent!important;border:none;box-shadow:none;margin:0}.setting-group.main-group.collapsed .setting-group-title.collapsed-view{height:55px;background:#f8f8f8;border:none;border-bottom:1px solid var(--Border-default, #d5dce5)}.setting-group.main-group .setting-group-title h3{font-weight:600;font-size:16px;color:#101828}.setting-group-content.main-content{width:100%;background:#f8f8f8;border:0;box-shadow:none;padding:0}.setting-divider{height:1px;width:100%;background-color:#f2f4f7;margin:4px 0}.setting-group-content>*{margin-bottom:8px}.setting-group-content>*:last-child{margin-bottom:0}.setting-group.active{border-color:#d6bbfb;box-shadow:0 0 0 4px #7f56d91a}.setting-group-empty{color:#667085;font-size:13px;font-style:italic;padding:12px 0;text-align:center}.setting-group-title.collapsed-view{display:flex;justify-content:space-between;align-items:center;padding:0 16px;height:36px;border-radius:8px;border:1px solid var(--Gray-200, #eaecf0);background:var(--Base-White, #fff);margin-bottom:0;position:relative;overflow:hidden;cursor:pointer}.setting-group-title.collapsed-view:hover{border-color:var(--Gray-200, #eaecf0);box-shadow:none;background:#fff;transform:none}.setting-group.main-group .setting-group-title.collapsed-view{height:55px;background:#f8f8f8;border:none;border-bottom:1px solid var(--Border-default, #d5dce5)}.setting-group:not(.main-group) .setting-group-title.collapsed-view{height:36px;background:#fff;border:1px solid var(--Gray-200, #eaecf0)}.setting-group-title .title-section{display:flex;align-items:center;gap:12px;flex:1;min-width:0}.setting-group-title .group-icon{display:flex;justify-content:center;align-items:center;color:var(--Gray-500, #667085);flex-shrink:0;width:20px;height:20px}.setting-group-title.collapsed-view h3{color:var(--Gray-800, #1d2939);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;font-size:14px;font-weight:500;line-height:20px;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.setting-group-title.collapsed-view .group-badge{display:flex;padding:2px 8px;justify-content:center;align-items:center;border-radius:16px;background:var(--Gray-100, #f2f4f7);color:var(--Gray-700, #344054);font-size:12px;font-weight:500;line-height:18px;margin-left:8px}.setting-group-title .actions-section{display:flex;align-items:center;gap:8px;margin-left:12px}.setting-group-title.collapsed-view .setting-group-arrow{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:4px;transition:transform .3s cubic-bezier(.34,1.56,.64,1),background-color .2s ease;color:var(--Gray-500, #667085)}.setting-group-title.collapsed-view:hover .setting-group-arrow{background-color:transparent;color:var(--Gray-500, #667085)}.setting-group-title .setting-group-arrow{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:4px;transition:transform .3s cubic-bezier(.34,1.56,.64,1);color:var(--Gray-500, #667085)}.setting-group-title:hover .setting-group-arrow{background-color:var(--Gray-100, #f2f4f7)}.setting-group-title .setting-group-arrow.rotated{transform:rotate(180deg)}.setting-group-title.collapsed-view .info-marker{width:16px;height:16px;color:var(--Gray-400, #98a2b3);cursor:help;transition:color .2s ease}.setting-group-title.collapsed-view .info-marker:hover{color:var(--Gray-500, #667085)}.setting-group-description{color:#667085;font-size:13px;margin-bottom:8px}@media (max-width: 768px){.setting-group-title.collapsed-view{padding:10px 12px}.setting-group-title .title-section{gap:8px}.setting-group-title.collapsed-view .group-badge{display:none}}@media (max-width: 480px){.setting-group-title.collapsed-view h3{font-size:13px}.setting-group-title.collapsed-view .setting-group-arrow{width:24px;height:24px}.setting-group-title.collapsed-view{padding:0 10px}}.setting-group-title.collapsed-view.striped:before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;background:var(--Primary-100, #f4ebff)}.icon-container{display:flex;align-items:center;gap:4px}.input-icon{display:flex;align-items:center;justify-content:center;color:var(--color-text)}.input-label{color:var(--color-text)}.input-container{display:inline-flex;align-items:center;position:relative}.with-suffix{flex:1;padding-right:36px}.input-suffix{position:absolute;right:8px;top:50%;transform:translateY(-50%);color:#666;pointer-events:none;font-size:.9em}.string-setting-wrapper{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.string-setting-input{max-width:120px;padding:8px;font-size:14px;border-radius:8px;color:var(--color-input-text);border:1px solid var(--color-border);background:var(--color-bg)}.color-setting-wrapper{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.color-input-wrapper{position:relative;padding:8px 8px 8px 4px;width:120px;height:33px;display:flex;align-items:center;gap:4px;border:1px solid var(--color-border);border-radius:8px;background-color:var(--color-bg)}.color-text-input{border:none;outline:none;width:65px;color:var(--color-input-text);font-size:14px;text-align:center;background:transparent}.color-picker{position:absolute;left:0;top:0;width:25px;height:25px;opacity:0;cursor:pointer}.color-preview{width:25px;height:25px;border-radius:4px}.number-setting-wrapper{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center;position:relative}.number-setting-input{width:120px;padding:8px;font-size:14px;border-radius:8px;color:#292b2e;border:1px solid var(--color-border);background:var(--color-bg);box-sizing:border-box}.suffix-label{position:absolute;right:8px;padding-left:8px;border-left:1px solid var(--color-divider);font-size:12px;color:var(--color-text)}input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]{-moz-appearance:textfield}.select-container{display:flex;justify-content:space-between;align-items:center;column-gap:12px;position:relative;width:100%}.select-container .icon-container{display:flex;align-items:center;margin-bottom:0}.select-container .icon-container .input-label{color:#667085;font-family:Inter;font-size:12px;font-style:normal;font-weight:400;line-height:normal}.select-button{place-self:end;max-width:120px;width:100%;height:33px;min-height:33px;display:flex;align-items:center;justify-content:flex-start;padding:0 40px 0 16px;border-radius:8px;border:1px solid var(--color-border, #e4e7ec);background:var(--color-bg, #fff);cursor:pointer;font-size:14px;font-weight:400;color:#101828;position:relative;transition:all .2s ease;box-shadow:0 1px 2px #1018280d;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.select-button:hover{border-color:#d0d5dd;box-shadow:0 1px 3px #1018281a}.select-button:focus{outline:none;border-color:#7f56d9;box-shadow:0 0 0 4px #7f56d91a}.select-button.has-label{padding-top:0;height:33px}.select-button .select-label{position:absolute;top:8px;left:16px;color:#667085;font-family:Inter;font-size:12px;font-style:normal;font-weight:400;line-height:18px;pointer-events:none}.select-button .select-value{width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.select-button.loading{position:relative;color:#6e7891;background-color:#f9fafb;pointer-events:none;padding-left:36px!important}.select-button.loading:before{content:"";position:absolute;left:10px;top:25%;transform:translateY(-50%);width:16px;height:16px;border:2px solid #e4e7ec;border-top:2px solid #7f56d9;border-radius:50%;animation:select-spin 1s linear infinite;z-index:2}@keyframes select-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.select-button.error{border-color:#f04438;color:#f04438;background-color:#fff4f4}.select-options{display:none;position:absolute;top:calc(100% + 2px);left:0;right:0;max-height:280px;overflow-y:auto;margin:0;padding:6px;list-style-type:none;z-index:100;flex-direction:column;color:#101828;align-items:flex-start;border:1px solid #e4e7ec;background:#fff;border-radius:8px;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808;transition:opacity .2s ease,transform .2s ease;opacity:0;transform:translateY(-8px)}.select-options.open{display:flex;opacity:1;transform:translateY(0);animation:select-fade-in .2s ease forwards}@keyframes select-fade-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.select-option{padding:10px 12px;width:100%;display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:#344054;border-radius:6px;transition:background-color .15s ease;font-size:14px}.select-option:hover{background:#f9fafb}.select-option.selected{background:#f4ebff;color:#6941c6;font-weight:400}.svg-container{position:absolute;right:10px;top:50%;transform:translateY(-50%);display:flex;align-items:center;justify-content:center;width:20px;height:20px;pointer-events:none;z-index:1}.svg-container .svg-select{stroke:#667085;transition:transform .3s ease;width:16px;height:16px}.svg-container.open .svg-select{transform:rotate(180deg)}.select-options::-webkit-scrollbar{width:6px}.select-options::-webkit-scrollbar-track{background:transparent;border-radius:8px}.select-options::-webkit-scrollbar-thumb{background:#e4e7ec;border-radius:8px}.select-options::-webkit-scrollbar-thumb:hover{background:#d0d5dd}.select-option.empty-message{text-align:center;color:#6e7891;font-style:italic;cursor:default;justify-content:center}.align-setting-wrapper{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.align-setting-label{font-size:12px;color:var(--color-text)}.align-options-container{width:120px;color:#0006;background-color:#f5f6f7;border-radius:9999px;padding:4px 13px;display:flex;gap:8px}.align-option-button{display:flex;align-items:center;justify-content:center;width:26px;height:26px;background:transparent;border:none;cursor:pointer;border-radius:50%;transition:background-color .2s,color .2s}.align-option-button:hover{background-color:#fff}.align-option-button.selected{background-color:var(--color-white);color:var(--color-black)}.button-setting-wrapper{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.button-setting{padding:8px 16px;background-color:var(--button-bg, #007bff);color:var(--button-color, #fff);border:none;border-radius:4px;cursor:pointer;font-size:14px}.button-setting:hover{background-color:var(--button-bg-hover, #0056b3)}.dimension-setting-container{display:flex;flex-direction:column;gap:8px;position:relative;width:100%}.dimension-bracket{width:18px;height:42px;position:absolute;top:16px;right:122px;display:flex;align-items:center;justify-content:center;z-index:1}.dimension-bracket:before{content:"";position:absolute;width:13px;height:14px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='15' viewBox='0 0 14 15' fill='none'><path d='M14 1H5C2.79086 1 1 2.79086 1 5V15' stroke='%23667085'/></svg>") no-repeat center center;background-size:contain;top:0;right:1px}.dimension-bracket:after{content:"";position:absolute;width:13px;height:14px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='15' viewBox='0 0 14 15' fill='none'><path d='M14 14H5C2.79086 14 1 12.2091 1 10V4.76837e-07' stroke='%23667085'/></svg>") no-repeat center center;background-size:contain;bottom:0;right:1px}.dimension-lock-icon{transform:translate(-.25rem);width:24px;height:24px;background:none;border:none;padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;color:#667085;z-index:1;border-radius:4px;transition:background-color .15s ease,color .15s ease}.dimension-setting-container.aspect-locked .dimension-bracket:before,.dimension-setting-container.aspect-locked .dimension-bracket:after{filter:hue-rotate(210deg) saturate(2)}@media (max-width: 480px){.dimension-bracket{right:100px}}.upload-setting-wrapper{display:grid;grid-template-columns:1fr;gap:8px;width:100%}.icon-title-container{display:flex;align-items:center;gap:8px;margin-bottom:4px}.icon-title-container .input-label{color:#344054;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;font-size:14px;font-weight:500}.preview-button-container{display:flex;justify-content:space-between;align-items:center;align-self:stretch;width:100%;gap:12px;border-radius:12px}.preview-button-container.no-image{justify-content:center}.preview-button-container.no-image .preview-placeholder{display:none}.preview-button-container.no-image .upload-button{width:100%;min-width:140px;flex-grow:1;margin:0 auto}.preview-wrapper{position:relative;width:91px;height:71px;border-radius:4px;overflow:hidden;background-color:#d3d3d3;flex-shrink:0;display:none}.preview-wrapper.has-image{display:block}.upload-preview{width:100%;height:100%;object-fit:cover;border-radius:4px;display:none;background-position:center;background-size:146.165% 100%;background-repeat:no-repeat}.preview-wrapper.has-image .upload-preview{display:block}.empty-state{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background-color:#d3d3d3}.empty-state svg{width:100%;height:100%}.preview-wrapper.has-image .empty-state{display:none}.upload-button{width:100%;height:40px;display:flex;padding:5px 4px;flex-direction:row;align-items:center;gap:4px;border-radius:12px;border:1px solid var(--Gray-200, #eaecf0);background:var(--Base-White, #fff);cursor:pointer;transition:all .2s ease;box-shadow:0 1px 2px #1018280d;flex-grow:0;justify-content:center;min-width:90px}.preview-wrapper:not(.has-image)+.upload-button{flex-grow:0}.upload-button:hover{border-color:#d0d5dd;box-shadow:0 1px 3px #1018281a}.upload-icon{display:flex;align-items:center;justify-content:center}.upload-label{font-size:12px;font-weight:500;color:#344054}.delete-button{display:flex;width:24px;height:24px;padding:4px;justify-content:center;align-items:center;position:absolute;right:4px;top:4px;background:#fff;border:none;border-radius:50%;cursor:pointer;box-shadow:0 2px 4px #0000001a;transition:background-color .2s ease;z-index:2}.delete-button svg{width:14px;height:14px;flex-shrink:0}.delete-button:hover{background-color:#f3f4f6}.upload-setting-wrapper.no-label .preview-button-container{grid-row:1}.preview-placeholder{display:flex;justify-content:center;align-items:center;width:91px;height:71px;border-radius:4px;background-color:#f2f4f7;flex-shrink:0}.preview-button-container:not(:has(.preview-wrapper.has-image)) .preview-placeholder{display:flex}.height-setting{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.height-setting-wrapper{display:flex;align-items:center;justify-content:space-between;gap:2px}.height-input-wrapper{position:relative;padding:8px 8px 8px 4px;width:120px;height:33px;display:flex;align-items:center;gap:4px;border:1px solid var(--color-border);border-radius:8px;background-color:var(--color-bg)}.height-text-input{border:none;outline:none;width:65px;color:var(--color-input-text);font-size:14px;text-align:center;background:transparent}.width-setting{display:grid;grid-template-columns:1fr 1fr;place-content:center;align-items:center}.width-setting-wrapper{display:flex;align-items:center;justify-content:space-between;gap:2px}.width-input-wrapper{position:relative;padding:8px 8px 8px 4px;width:120px;height:33px;display:flex;align-items:center;gap:4px;border:1px solid var(--color-border);border-radius:8px;background-color:var(--color-bg)}.width-text-input{border:none;outline:none;width:65px;color:var(--color-input-text);font-size:14px;text-align:center;background:transparent}.width-setting .number-setting{width:100%}.select-api-container{display:grid;grid-template-columns:1fr;place-content:center;align-items:center;position:relative;width:100%}.select-api-button{width:100%;height:33px;min-height:33px;display:flex;align-items:center;justify-content:flex-start;padding:0 40px 0 16px;border-radius:8px;border:1px solid var(--color-border, #e4e7ec);background:#fff;cursor:pointer;font-size:14px;font-weight:500;color:#101828;position:relative;transition:all .2s ease;box-shadow:0 1px 2px #1018280d;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:40px!important}.select-api-button:hover{border-color:#d0d5dd;box-shadow:0 1px 3px #1018281a}.select-api-button:focus{outline:none;border-color:#7f56d9;box-shadow:0 0 0 4px #7f56d91a}.select-api-button .select-label{position:absolute;top:2px;font-size:10px;color:#667085;font-weight:500;pointer-events:none}.select-api-button .select-value{margin-top:6px}.select-api-button.loading{position:relative;color:#6e7891;background-color:#f9fafb;pointer-events:none;padding-left:36px!important}.select-api-button.loading:before{content:"";position:absolute;left:10px;top:25%;transform:translateY(-50%);width:16px;height:16px;border:2px solid #e4e7ec;border-top:2px solid #7f56d9;border-radius:50%;animation:select-api-spin 1s linear infinite;z-index:2}.select-api-button.has-label.loading{padding-left:36px!important}.select-api-button.has-label.loading .select-value{padding-left:0}.select-api-button.has-label.loading:before{top:18px;left:10px}@keyframes select-api-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.select-api-button.error{border-color:#f04438;color:#f04438;background-color:#fff4f4}.select-api-options{display:none;position:absolute;top:calc(100% + 4px);left:0;right:0;max-height:280px;overflow-y:auto;margin:0;padding:6px;list-style-type:none;z-index:100;flex-direction:column;color:#101828;align-items:flex-start;border:1px solid #e4e7ec;background:#fff;border-radius:8px;box-shadow:0 12px 16px -4px #10182814,0 4px 6px -2px #10182808;transition:opacity .2s ease,transform .2s ease;opacity:0;transform:translateY(-8px)}.select-api-options.open{display:flex;opacity:1;transform:translateY(0)}.select-api-option{padding:10px 12px;width:100%;display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:#344054;border-radius:6px;transition:background-color .15s ease;font-size:14px}.select-api-option:hover{background:#f9fafb}.select-api-option.selected{background:#f4ebff;color:#6941c6;font-weight:500}.select-api-option.disabled{opacity:.6;cursor:not-allowed;color:#6e7891}.select-api-radio{width:18px;height:18px;border-radius:50%;border:1.5px solid #e4e7ec;background:#fff;-webkit-appearance:none;-moz-appearance:none;appearance:none;position:relative;margin:0;cursor:pointer}.select-api-radio:checked{border-color:#7f56d9;border-width:4px;background:#fff}.svg-container{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:24px;height:24px;display:flex;align-items:center;justify-content:center;pointer-events:none}.svg-container .svg-select-api{stroke:#667085;transition:transform .3s ease;width:16px;height:16px}.svg-container.open .svg-select-api{transform:rotate(180deg)}.select-api-container .icon-container{display:none}.select-api-options::-webkit-scrollbar{width:6px}.select-api-options::-webkit-scrollbar-track{background:transparent;border-radius:8px}.select-api-options::-webkit-scrollbar-thumb{background:#e4e7ec;border-radius:8px}.select-api-options::-webkit-scrollbar-thumb:hover{background:#d0d5dd}.select-api-option.empty-message{text-align:center;color:#6e7891;font-style:italic;cursor:default;justify-content:center}.select-api-option.empty-message:hover{background:transparent}.select-api-option:focus{outline:none;box-shadow:0 0 0 2px #7f56d9}@keyframes fadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.select-api-options.open{display:flex;animation:fadeIn .2s ease forwards}.select-api-button.has-label{height:48px}.tab-delete-button{background:transparent;border:none;cursor:pointer;padding:2px 4px}.tab-delete-button svg{width:16px;height:16px}.tabs-add-btn-container{display:flex;justify-content:flex-end}.tabs-add-button{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:6px;cursor:pointer;font-size:14px;color:#667085;transition:transform .15s ease,box-shadow .3s ease}.tabs-add-button:hover{transform:scale(1);box-shadow:0 2px 6px #0000001a}.add-icon{display:flex;align-items:center;width:18px}.add-label{display:inline-block}.bgset-or-label{margin:8px 0;text-align:center;font-weight:500;color:#667085;align-self:center}:root{--color-border: #D5DCE5;--color-bg: #F8F8F8;--color-border-secondary: #eaecf0;--color-text: #667085;--color-title: #344054;--color-input-text: #292b2e;--color-white: #fff;--color-black: #000;--color-divider: #dcdcdc;--color-btn-text: #4b4b4b;--color-bg-icon: #f2f4f7}*{padding:0;margin:0;border:none}*,*:before,*:after{box-sizing:border-box}a,a:link,a:visited,a:hover{text-decoration:none}body{font-family:Satoshi,sans-serif;font-weight:400;font-size:12px;line-height:18px}aside,nav,footer,header,section,main{display:block}h1,h2,h3,h4,h5,h6,p{font-size:inherit;font-weight:inherit}ul,ul li{list-style:none}img{vertical-align:top}img,svg{max-width:100%;height:auto}address{font-style:normal}input::-ms-clear{display:none}button,input[type=submit]{display:inline-block;box-shadow:none;background-color:transparent;background:none;cursor:pointer}input:focus,input:active,button:focus,button:active{outline:none}button::-moz-focus-inner{padding:0;border:0}label{cursor:pointer}legend{display:block}

package/dist/index.d.ts

@@ -118,27 +118,47 @@ export declare class DimensionSetting extends Setting<DimensionValue, DimensionS
     };
     private widthSetting;
     private heightSetting;
+    private minWidth;
+    private maxWidth?;
+    private minHeight;
+    private maxHeight?;
     private locked;
     private aspectRatio;
     private isUpdating;
     constructor(props?: DimensionSettingProps);
+    /**
+     * Handle width changes with improved validation and aspect ratio preservation
+     */
+    private handleWidthChange;
+    /**
+     * Handle height changes with improved validation and aspect ratio preservation
+     */
+    private handleHeightChange;
     /**
      * Toggles the locked state. When locking, it recalculates the aspect ratio
      * based on the current width and height. Updates the lock icon accordingly.
-     * @param lockIcon The HTMLElement containing the lock icon SVG.
      */
     private toggleLock;
     /**
      * Returns the appropriate SVG string for the lock icon based on lock state.
-     * @param isLocked Whether the dimension is currently locked.
      */
     private getLockSVG;
+    /**
+     * Programmatically update both width and height values
+     */
+    setValue(newValue: DimensionValue): void;
     /**
      * Renders the DimensionSetting component.
-     * It arranges the width and height NumberSettings with a bracket containing a lock icon.
-     * @returns {HTMLElement} The container element with the complete dimension control.
      */
     draw(): HTMLElement;
+    /**
+     * Allow for external access to the locked state
+     */
+    isLocked(): boolean;
+    /**
+     * Allow for external control of the locked state
+     */
+    setLocked(locked: boolean): void;
 }
 
 /**
@@ -153,6 +173,9 @@ export declare interface DimensionSettingProps extends SettingProps<DimensionVal
     maxWidth?: number;
     minHeight?: number;
     maxHeight?: number;
+    /** Default values if none are provided */
+    width?: number;
+    height?: number;
 }
 
 /**
@@ -226,7 +249,7 @@ declare type InputProps = {
     placeholder?: string;
 };
 
-export declare type InputTypes = 'number' | 'text' | 'select' | 'color' | 'date' | 'button';
+export declare type InputTypes = "number" | "text" | "select" | "color" | "date" | "button";
 
 export declare function iterateSettings<T extends Record<string, Setting<any, any> | SettingGroup<any>>>(settings: T, callback: (key: string, setting: Setting<any, any> | SettingGroup<any>) => void): void;
 
@@ -297,6 +320,7 @@ export declare interface SelectApiSettingProps<T = any> extends SettingProps<T>
     options?: SelectApiOption[];
     getOptions?: () => SelectApiOption[];
     getOptionsAsync?: () => Promise<SelectApiOption[]>;
+    loadingText?: string;
 }
 
 export declare class SelectApiSettings<T = any> extends Setting<T, SelectApiSettingProps<T>> {
@@ -306,10 +330,15 @@ export declare class SelectApiSettings<T = any> extends Setting<T, SelectApiSett
     private selectedOptionIndex;
     private optionsListEl;
     private svgContainer;
+    private buttonEl;
+    private isLoading;
+    private container;
     constructor(props?: SelectApiSettingProps<T>);
     private createOption;
     draw(): HTMLElement;
     private selectApiOption;
+    private updateOptionsList;
+    private updateButtonText;
 }
 
 export declare interface SelectOption {
@@ -324,20 +353,30 @@ export declare class SelectSetting<T = any> extends Setting<T, SelectSettingProp
     private selectedOptionIndex;
     private optionsListEl;
     private svgContainer;
+    private buttonEl;
+    private isLoading;
+    private container;
+    private clickOutsideListener;
     constructor(props?: SelectSettingProps<T>);
     private createOption;
     draw(): HTMLElement;
     private selectOption;
+    private updateOptionsList;
+    private updateButtonText;
+    destroy(): void;
 }
 
 export declare interface SelectSettingProps<T = any> extends SettingProps<T> {
     options?: SelectOption[];
     getOptions?: () => SelectOption[];
     getOptionsAsync?: () => Promise<SelectOption[]>;
+    loadingText?: string;
+    placeholder?: string;
 }
 
 export declare abstract class Setting<T, P extends SettingProps<T>> implements IDrawable, IChangable<T> {
     protected props: P;
+    destroy(): void;
     protected inputEl?: HTMLInputElement;
     id: string;
     value: T | undefined;
@@ -356,10 +395,13 @@ export declare abstract class Setting<T, P extends SettingProps<T>> implements I
 export declare class SettingGroup<T extends Record<string, Setting<any, any> | SettingGroup<any>>> implements IDrawable, IChangable<T> {
     title: string;
     settings: T;
+    description?: string;
+    icon?: string;
     id: string;
     onChange?: ((value: T) => void) | undefined;
     private isCollapsed;
     private isMain;
+    private elementRef;
     constructor(groupProps: SettingGroupProps<T>);
     setOnChange(onChange: (value: T) => void): SettingGroup<T>;
     /**
@@ -368,6 +410,18 @@ export declare class SettingGroup<T extends Record<string, Setting<any, any> | S
      */
     getValues<K extends keyof T>(childKey?: K): any;
     draw(): HTMLElement;
+    /**
+     * Collapse the setting group
+     */
+    collapse(): void;
+    /**
+     * Expand the setting group
+     */
+    expand(): void;
+    /**
+     * Toggle the collapsed state
+     */
+    toggle(): void;
 }
 
 export declare type SettingGroupProps<T> = {
@@ -376,6 +430,8 @@ export declare type SettingGroupProps<T> = {
     id?: string;
     collapsed?: boolean;
     main?: boolean;
+    description?: string;
+    icon?: string;
 };
 
 export declare interface SettingProps<T> {

package/dist/margins-bottom.svg

@@ -1,3 +1,3 @@
-<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M2.25 2.75H2.2575M2.25 9.5H2.2575M2.25 12.875H2.2575M2.25 6.125H2.2575M5.625 2.75H5.6325M5.625 9.5H5.6325M12.375 2.75H12.3825M12.375 9.5H12.3825M9 2.75H9.0075M9 9.5H9.0075M9 12.875H9.0075M9 6.125H9.0075M15.75 2.75H15.7575M15.75 9.5H15.7575M15.75 12.875H15.7575M15.75 6.125H15.7575M15.75 16.25H2.25" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.25 2.75H2.2575M2.25 9.5H2.2575M2.25 12.875H2.2575M2.25 6.125H2.2575M5.625 2.75H5.6325M5.625 9.5H5.6325M12.375 2.75H12.3825M12.375 9.5H12.3825M9 2.75H9.0075M9 9.5H9.0075M9 12.875H9.0075M9 6.125H9.0075M15.75 2.75H15.7575M15.75 9.5H15.7575M15.75 12.875H15.7575M15.75 6.125H15.7575M15.75 16.25H2.25" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/dist/margins-left.svg

@@ -1,3 +1,3 @@
-<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M5.625 2.75H5.6325M5.625 9.5H5.6325M5.625 16.25H5.6325M12.375 2.75H12.3825M12.375 9.5H12.3825M12.375 16.25H12.3825M9 2.75H9.0075M9 9.5H9.0075M9 16.25H9.0075M9 12.875H9.0075M9 6.125H9.0075M15.75 2.75H15.7575M15.75 9.5H15.7575M15.75 16.25H15.7575M15.75 12.875H15.7575M15.75 6.125H15.7575M2.25 16.25V2.75" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.625 2.75H5.6325M5.625 9.5H5.6325M5.625 16.25H5.6325M12.375 2.75H12.3825M12.375 9.5H12.3825M12.375 16.25H12.3825M9 2.75H9.0075M9 9.5H9.0075M9 16.25H9.0075M9 12.875H9.0075M9 6.125H9.0075M15.75 2.75H15.7575M15.75 9.5H15.7575M15.75 16.25H15.7575M15.75 12.875H15.7575M15.75 6.125H15.7575M2.25 16.25V2.75" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/dist/margins-right.svg

@@ -1,3 +1,3 @@
-<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M5.625 2.75H5.6325M5.625 9.5H5.6325M5.625 16.25H5.6325M12.375 2.75H12.3825M12.375 9.5H12.3825M12.375 16.25H12.3825M9 2.75H9.0075M9 9.5H9.0075M9 16.25H9.0075M9 12.875H9.0075M9 6.125H9.0075M2.25 2.75H2.2575M2.25 9.5H2.2575M2.25 16.25H2.2575M2.25 12.875H2.2575M2.25 6.125H2.2575M15.75 16.25V2.75" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.625 2.75H5.6325M5.625 9.5H5.6325M5.625 16.25H5.6325M12.375 2.75H12.3825M12.375 9.5H12.3825M12.375 16.25H12.3825M9 2.75H9.0075M9 9.5H9.0075M9 16.25H9.0075M9 12.875H9.0075M9 6.125H9.0075M2.25 2.75H2.2575M2.25 9.5H2.2575M2.25 16.25H2.2575M2.25 12.875H2.2575M2.25 6.125H2.2575M15.75 16.25V2.75" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/dist/margins-top.svg

@@ -1,3 +1,3 @@
-<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M2.25 16.25H2.2575M2.25 9.5H2.2575M2.25 12.875H2.2575M2.25 6.125H2.2575M5.625 16.25H5.6325M5.625 9.5H5.6325M12.375 16.25H12.3825M12.375 9.5H12.3825M9 16.25H9.0075M9 9.5H9.0075M9 12.875H9.0075M9 6.125H9.0075M15.75 16.25H15.7575M15.75 9.5H15.7575M15.75 12.875H15.7575M15.75 6.125H15.7575M15.75 2.75H2.25" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M2.25 16.25H2.2575M2.25 9.5H2.2575M2.25 12.875H2.2575M2.25 6.125H2.2575M5.625 16.25H5.6325M5.625 9.5H5.6325M12.375 16.25H12.3825M12.375 9.5H12.3825M9 16.25H9.0075M9 9.5H9.0075M9 12.875H9.0075M9 6.125H9.0075M15.75 16.25H15.7575M15.75 9.5H15.7575M15.75 12.875H15.7575M15.75 6.125H15.7575M15.75 2.75H2.25" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/dist/radius.svg

@@ -1,3 +1,3 @@
-<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M5.625 9.5H5.6325M12.375 9.5H12.3825M9 9.5H9.0075M9 12.875H9.0075M9 6.125H9.0075M2.25 6.35L2.25 12.65C2.25 13.9101 2.25 14.5402 2.49524 15.0215C2.71095 15.4448 3.05516 15.789 3.47852 16.0048C3.95982 16.25 4.58988 16.25 5.85 16.25H12.15C13.4101 16.25 14.0402 16.25 14.5215 16.0048C14.9448 15.789 15.289 15.4448 15.5048 15.0215C15.75 14.5402 15.75 13.9101 15.75 12.65V6.35C15.75 5.08988 15.75 4.45982 15.5048 3.97852C15.289 3.55516 14.9448 3.21095 14.5215 2.99524C14.0402 2.75 13.4101 2.75 12.15 2.75L5.85 2.75C4.58988 2.75 3.95982 2.75 3.47852 2.99524C3.05516 3.21095 2.71095 3.55516 2.49524 3.97852C2.25 4.45982 2.25 5.08988 2.25 6.35Z" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.625 9.5H5.6325M12.375 9.5H12.3825M9 9.5H9.0075M9 12.875H9.0075M9 6.125H9.0075M2.25 6.35L2.25 12.65C2.25 13.9101 2.25 14.5402 2.49524 15.0215C2.71095 15.4448 3.05516 15.789 3.47852 16.0048C3.95982 16.25 4.58988 16.25 5.85 16.25H12.15C13.4101 16.25 14.0402 16.25 14.5215 16.0048C14.9448 15.789 15.289 15.4448 15.5048 15.0215C15.75 14.5402 15.75 13.9101 15.75 12.65V6.35C15.75 5.08988 15.75 4.45982 15.5048 3.97852C15.289 3.55516 14.9448 3.21095 14.5215 2.99524C14.0402 2.75 13.4101 2.75 12.15 2.75L5.85 2.75C4.58988 2.75 3.95982 2.75 3.47852 2.99524C3.05516 3.21095 2.71095 3.55516 2.49524 3.97852C2.25 4.45982 2.25 5.08988 2.25 6.35Z" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/dist/spacing-height.svg

@@ -1,3 +1,3 @@
-<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M9 14L9 5M9 14L6.75 12.5M9 14L11.25 12.5M9 5L6.75 6.5M9 5L11.25 6.5M15.75 2.75H2.25M15.75 16.25H2.25" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9 14L9 5M9 14L6.75 12.5M9 14L11.25 12.5M9 5L6.75 6.5M9 5L11.25 6.5M15.75 2.75H2.25M15.75 16.25H2.25" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/dist/spacing-width.svg

@@ -1,3 +1,3 @@
-<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M4.5 9.5H13.5M4.5 9.5L6 7.25M4.5 9.5L6 11.75M13.5 9.5L12 7.25M13.5 9.5L12 11.75M15.75 16.25V2.75M2.25 16.25V2.75" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
-</svg>
+<svg width="18" height="19" viewBox="0 0 18 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M4.5 9.5H13.5M4.5 9.5L6 7.25M4.5 9.5L6 11.75M13.5 9.5L12 7.25M13.5 9.5L12 11.75M15.75 16.25V2.75M2.25 16.25V2.75" stroke="#667085" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/package.json

@@ -1,36 +1,36 @@
-{
-	"name": "builder-settings-types",
-	"description": "builder settings",
-	"version": "0.0.76",
-	"type": "module",
-	"main": "dist/builder-settings-types.cjs.js",
-	"module": "dist/builder-settings-types.es.js",
-	"types": "dist/index.d.ts",
-	"scripts": {
-		"dev": "vite",
-		"build": "tsc && vite build",
-		"test": "tsc && vite test",
-		"preview": "vite preview",
-		"pub": "npm version patch && npm run build && npm publish --access public"
-	},
-	"devDependencies": {
-		"typescript": "~5.6.2",
-		"vite": "^6.0.1"
-	},
-	"files": [
-		"dist"
-	],
-	"exports": {
-		".": {
-			"types": "./dist/index.d.ts",
-			"import": "./dist/builder-settings-types.es.js",
-			"require": "./dist/builder-settings-types.cjs.js"
-		}
-	},
-	"license": "MIT",
-	"author": "onAim",
-	"dependencies": {
-		"nanoid": "^5.1.0",
-		"vite-plugin-dts": "^4.5.0"
-	}
-}
+{
+	"name": "builder-settings-types",
+	"description": "builder settings",
+	"version": "0.0.78",
+	"type": "module",
+	"main": "dist/builder-settings-types.cjs.js",
+	"module": "dist/builder-settings-types.es.js",
+	"types": "dist/index.d.ts",
+	"scripts": {
+		"dev": "vite",
+		"build": "tsc && vite build",
+		"test": "tsc && vite test",
+		"preview": "vite preview",
+		"pub": "npm version patch && npm run build && npm publish --access public"
+	},
+	"devDependencies": {
+		"typescript": "~5.6.2",
+		"vite": "^6.0.1"
+	},
+	"files": [
+		"dist"
+	],
+	"exports": {
+		".": {
+			"types": "./dist/index.d.ts",
+			"import": "./dist/builder-settings-types.es.js",
+			"require": "./dist/builder-settings-types.cjs.js"
+		}
+	},
+	"license": "MIT",
+	"author": "onAim",
+	"dependencies": {
+		"nanoid": "^5.1.0",
+		"vite-plugin-dts": "^4.5.0"
+	}
+}