tdesign-react 0.45.6-alpha.1 → 0.45.6-alpha.2

package/es/checkbox/style/index.css

@@ -1 +1,141 @@
-.t-checkbox-group{-ms-flex-wrap:wrap;flex-wrap:wrap;gap:16px}.t-checkbox,.t-checkbox-group{font:var(--td-font-body-medium);color:var(--td-text-color-primary);-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;list-style:none;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex}.t-checkbox{-webkit-box-align:center;-ms-flex-align:center;align-items:center;position:relative;cursor:pointer}.t-checkbox+.t-checkbox{margin-left:inherit}.t-checkbox__former{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;outline:0;-webkit-appearance:none;-moz-appearance:none;appearance:none}.t-checkbox__input{position:relative;display:inline-block;width:16px;height:16px;vertical-align:middle;border:1px solid var(--td-border-level-2-color);border-radius:var(--td-radius-default);background-color:var(--td-bg-color-container);-webkit-box-sizing:border-box;box-sizing:border-box}.t-checkbox__input:after{content:"";position:absolute;opacity:0;-webkit-box-sizing:border-box;box-sizing:border-box}.t-checkbox__label{display:inline-block;margin-left:8px;vertical-align:middle;font:var(--td-font-body-medium)}.t-checkbox:hover .t-checkbox__input{border-color:var(--td-brand-color);-webkit-transition:border-color .2s linear;transition:border-color .2s linear}.t-checkbox.t-is-checked .t-checkbox__input{border-color:var(--td-brand-color);background-color:var(--td-brand-color);-webkit-transition:background-color .2s cubic-bezier(.82,0,1,.9);transition:background-color .2s cubic-bezier(.82,0,1,.9)}.t-checkbox.t-is-checked .t-checkbox__input:after{opacity:1;top:6px;left:3px;width:5px;height:9px;border:2px solid var(--td-text-color-anti);border-radius:0 0 1px;border-top:0;border-left:0;-webkit-transform:rotate(45deg) scale(1) translate(-50%,-50%);transform:rotate(45deg) scale(1) translate(-50%,-50%);background:transparent}.t-checkbox.t-is-indeterminate .t-checkbox__input{border-color:var(--td-brand-color);background-color:var(--td-brand-color);-webkit-transition:background-color .2s cubic-bezier(.82,0,1,.9);transition:background-color .2s cubic-bezier(.82,0,1,.9)}.t-checkbox.t-is-indeterminate .t-checkbox__input:after{opacity:1;width:16px;height:4px;left:-1px;right:0;top:5px;border:unset;-webkit-transform:scale(.5);transform:scale(.5);background-color:var(--td-font-white-1)}.t-checkbox.t-is-disabled{cursor:not-allowed}.t-checkbox.t-is-disabled .t-checkbox__label{color:var(--td-text-color-disabled)}.t-checkbox.t-is-disabled .t-checkbox__input{background-color:var(--td-bg-color-component-disabled)}.t-checkbox.t-is-disabled.t-is-checked .t-checkbox__input,.t-checkbox.t-is-disabled:hover .t-checkbox__input{border-color:var(--td-border-level-2-color)}.t-checkbox.t-is-disabled.t-is-checked .t-checkbox__input:after{border-color:var(--td-text-color-disabled)}.t-checkbox.t-is-disabled.t-is-indeterminate .t-checkbox__input{border-color:var(--td-border-level-2-color)}.t-checkbox.t-is-disabled.t-is-indeterminate .t-checkbox__input:after{background-color:var(--td-text-color-disabled)}
+.t-checkbox-group {
+  font: var(--td-font-body-medium);
+  color: var(--td-text-color-primary);
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -ms-flex-wrap: wrap;
+      flex-wrap: wrap;
+  gap: 16px;
+}
+.t-checkbox {
+  font: var(--td-font-body-medium);
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  position: relative;
+  cursor: pointer;
+  color: var(--td-text-color-primary);
+}
+.t-checkbox + .t-checkbox {
+  margin-left: inherit;
+}
+.t-checkbox__former {
+  border: 0;
+  clip: rect(0 0 0 0);
+  height: 1px;
+  margin: -1px;
+  overflow: hidden;
+  padding: 0;
+  position: absolute;
+  width: 1px;
+  outline: 0;
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+}
+.t-checkbox__input {
+  position: relative;
+  display: inline-block;
+  width: 16px;
+  height: 16px;
+  vertical-align: middle;
+  border: 1px solid var(--td-border-level-2-color);
+  border-radius: var(--td-radius-default);
+  background-color: var(--td-bg-color-container);
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+}
+.t-checkbox__input::after {
+  content: "";
+  position: absolute;
+  opacity: 0;
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+}
+.t-checkbox__label {
+  display: inline-block;
+  margin-left: 8px;
+  vertical-align: middle;
+  font: var(--td-font-body-medium);
+}
+.t-checkbox:hover .t-checkbox__input {
+  border-color: var(--td-brand-color);
+  -webkit-transition: border-color 0.2s linear;
+  transition: border-color 0.2s linear;
+}
+.t-checkbox.t-is-checked .t-checkbox__input {
+  border-color: var(--td-brand-color);
+  background-color: var(--td-brand-color);
+  -webkit-transition: background-color 0.2s cubic-bezier(0.82, 0, 1, 0.9);
+  transition: background-color 0.2s cubic-bezier(0.82, 0, 1, 0.9);
+}
+.t-checkbox.t-is-checked .t-checkbox__input::after {
+  opacity: 1;
+  top: 6px;
+  left: 3px;
+  width: 5px;
+  height: 9px;
+  border: 2px solid var(--td-text-color-anti);
+  border-radius: 0 0 1px;
+  border-top: 0;
+  border-left: 0;
+  -webkit-transform: rotate(45deg) scale(1) translate(-50%, -50%);
+          transform: rotate(45deg) scale(1) translate(-50%, -50%);
+  background: transparent;
+}
+.t-checkbox.t-is-indeterminate .t-checkbox__input {
+  border-color: var(--td-brand-color);
+  background-color: var(--td-brand-color);
+  -webkit-transition: background-color 0.2s cubic-bezier(0.82, 0, 1, 0.9);
+  transition: background-color 0.2s cubic-bezier(0.82, 0, 1, 0.9);
+}
+.t-checkbox.t-is-indeterminate .t-checkbox__input::after {
+  opacity: 1;
+  width: 16px;
+  height: 4px;
+  left: -1px;
+  right: 0;
+  top: 5px;
+  border: unset;
+  -webkit-transform: scale(0.5);
+          transform: scale(0.5);
+  background-color: var(--td-font-white-1);
+}
+.t-checkbox.t-is-disabled {
+  cursor: not-allowed;
+}
+.t-checkbox.t-is-disabled .t-checkbox__label {
+  color: var(--td-text-color-disabled);
+}
+.t-checkbox.t-is-disabled .t-checkbox__input {
+  background-color: var(--td-bg-color-component-disabled);
+}
+.t-checkbox.t-is-disabled:hover .t-checkbox__input {
+  border-color: var(--td-border-level-2-color);
+}
+.t-checkbox.t-is-disabled.t-is-checked .t-checkbox__input {
+  border-color: var(--td-border-level-2-color);
+}
+.t-checkbox.t-is-disabled.t-is-checked .t-checkbox__input::after {
+  border-color: var(--td-text-color-disabled);
+}
+.t-checkbox.t-is-disabled.t-is-indeterminate .t-checkbox__input {
+  border-color: var(--td-border-level-2-color);
+}
+.t-checkbox.t-is-disabled.t-is-indeterminate .t-checkbox__input::after {
+  background-color: var(--td-text-color-disabled);
+}

package/es/collapse/style/index.css

@@ -1 +1,116 @@
-.t-collapse{font:var(--td-font-body-medium);color:var(--td-text-color-primary);-webkit-box-sizing:border-box;box-sizing:border-box;margin:0;padding:0;list-style:none;border:1px solid var(--td-component-border);border-bottom:0;background:var(--td-bg-color-container)}.t-collapse.t--border-less{border:none}.t-collapse.t--border-less .t-collapse-panel__header{border-bottom:none}.t-collapse.t--border-less .t-collapse-panel__body{background:var(--td-bg-color-container);border:none}.t-collapse-panel__icon{-webkit-transition:all .2s cubic-bezier(.38,0,.24,1);transition:all .2s cubic-bezier(.38,0,.24,1);cursor:pointer;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.t-collapse-panel__icon>.t-fake-arrow{-webkit-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-transition:all .2s cubic-bezier(.38,0,.24,1);transition:all .2s cubic-bezier(.38,0,.24,1)}.t-collapse-panel__icon--left{margin-right:var(--td-comp-margin-s)}.t-collapse-panel__icon--right{margin-left:var(--td-comp-margin-s)}.t-collapse-panel__icon--active>.t-fake-arrow{-webkit-transform:rotate(0);transform:rotate(0)}.t-collapse-panel__icon:hover{background-color:var(--td-bg-color-container-hover);border-radius:var(--td-radius-small)}.t-collapse-panel__wrapper{overflow:hidden}.t-collapse-panel__wrapper .t-collapse-panel__header{padding:var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l);border-bottom:1px solid var(--td-component-border);font:var(--td-font-title-small);display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.t-collapse-panel__wrapper .t-collapse-panel__header--blank{-webkit-box-flex:1;-ms-flex:1;flex:1}.t-collapse-panel__wrapper .t-collapse-panel__header.t-is-clickable{cursor:pointer}.t-collapse-panel__wrapper .t-collapse-panel__header-left,.t-collapse-panel__wrapper .t-collapse-panel__header-right,.t-collapse-panel__wrapper .t-collapse-panel__header-right-content{display:-webkit-box;display:-ms-flexbox;display:flex}.t-collapse-panel__wrapper .t-collapse-panel__body{border-bottom:1px solid var(--td-component-border);background:var(--td-bg-color-secondarycontainer);overflow:inherit}.t-collapse-panel__wrapper .t-collapse-panel__body--collapsed{border:none}.t-collapse-panel__wrapper .t-collapse-panel__content{padding:var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l) var(--td-comp-paddingTB-m) calc(var(--td-comp-paddingLR-l) + var(--td-comp-margin-xxl));color:var(--td-text-color-secondary)}.t-collapse-panel.t-is-disabled .t-collapse-panel__header{cursor:not-allowed;color:var(--td-text-color-disabled)}.t-collapse-panel.t-is-disabled .t-collapse-panel__icon{cursor:not-allowed;pointer-events:none}.t-collapse-panel.t-is-disabled .t-collapse-panel__body{background:var(--td-bg-color-component-disabled)}.t-collapse-panel.t-is-disabled .t-collapse-panel__content{color:var(--td-text-color-disabled)}.t-slide-down-enter-active,.t-slide-down-leave-active{-webkit-transition:height .2s,padding .2s;transition:height .2s,padding .2s}
+.t-collapse {
+  font: var(--td-font-body-medium);
+  color: var(--td-text-color-primary);
+  -webkit-box-sizing: border-box;
+          box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  list-style: none;
+  border: solid 1px var(--td-component-border);
+  border-bottom: 0;
+  background: var(--td-bg-color-container);
+}
+.t-collapse.t--border-less {
+  border: none;
+}
+.t-collapse.t--border-less .t-collapse-panel__header {
+  border-bottom: none;
+}
+.t-collapse.t--border-less .t-collapse-panel__body {
+  background: var(--td-bg-color-container);
+  border: none;
+}
+.t-collapse-panel__icon {
+  -webkit-transition: all 0.2s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: all 0.2s cubic-bezier(0.38, 0, 0.24, 1);
+  cursor: pointer;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -webkit-box-pack: center;
+      -ms-flex-pack: center;
+          justify-content: center;
+}
+.t-collapse-panel__icon > .t-fake-arrow {
+  -webkit-transform: rotate(-90deg);
+          transform: rotate(-90deg);
+  -webkit-transition: all 0.2s cubic-bezier(0.38, 0, 0.24, 1);
+  transition: all 0.2s cubic-bezier(0.38, 0, 0.24, 1);
+}
+.t-collapse-panel__icon--left {
+  margin-right: var(--td-comp-margin-s);
+}
+.t-collapse-panel__icon--right {
+  margin-left: var(--td-comp-margin-s);
+}
+.t-collapse-panel__icon--active > .t-fake-arrow {
+  -webkit-transform: rotate(0);
+          transform: rotate(0);
+}
+.t-collapse-panel__icon:hover {
+  background-color: var(--td-bg-color-container-hover);
+  border-radius: var(--td-radius-small);
+}
+.t-collapse-panel__wrapper {
+  overflow: hidden;
+}
+.t-collapse-panel__wrapper .t-collapse-panel__header {
+  padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l);
+  border-bottom: solid 1px var(--td-component-border);
+  font: var(--td-font-title-small);
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+}
+.t-collapse-panel__wrapper .t-collapse-panel__header--blank {
+  -webkit-box-flex: 1;
+      -ms-flex: 1;
+          flex: 1;
+}
+.t-collapse-panel__wrapper .t-collapse-panel__header.t-is-clickable {
+  cursor: pointer;
+}
+.t-collapse-panel__wrapper .t-collapse-panel__header-left,
+.t-collapse-panel__wrapper .t-collapse-panel__header-right,
+.t-collapse-panel__wrapper .t-collapse-panel__header-right-content {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+}
+.t-collapse-panel__wrapper .t-collapse-panel__body {
+  border-bottom: solid 1px var(--td-component-border);
+  background: var(--td-bg-color-secondarycontainer);
+  overflow: inherit;
+}
+.t-collapse-panel__wrapper .t-collapse-panel__body--collapsed {
+  border: none;
+}
+.t-collapse-panel__wrapper .t-collapse-panel__content {
+  padding: var(--td-comp-paddingTB-m) var(--td-comp-paddingLR-l) var(--td-comp-paddingTB-m) calc(var(--td-comp-paddingLR-l) + var(--td-comp-margin-xxl));
+  color: var(--td-text-color-secondary);
+}
+.t-collapse-panel.t-is-disabled .t-collapse-panel__header {
+  cursor: not-allowed;
+  color: var(--td-text-color-disabled);
+}
+.t-collapse-panel.t-is-disabled .t-collapse-panel__icon {
+  cursor: not-allowed;
+  pointer-events: none;
+}
+.t-collapse-panel.t-is-disabled .t-collapse-panel__body {
+  background: var(--td-bg-color-component-disabled);
+}
+.t-collapse-panel.t-is-disabled .t-collapse-panel__content {
+  color: var(--td-text-color-disabled);
+}
+.t-slide-down-enter-active,
+.t-slide-down-leave-active {
+  -webkit-transition: height 0.2s, padding 0.2s;
+  transition: height 0.2s, padding 0.2s;
+}