@cozeloop/components 0.0.0-beta-1766561124625

package/README.md

@@ -0,0 +1,84 @@
+# @cozeloop/components
+
+common components for cozeloop
+
+## Overview
+
+This package is part of the Coze Loop monorepo and provides ui component functionality. It serves as a core component in the Coze Loop ecosystem.
+
+## Getting Started
+
+### Installation
+
+Add this package to your `package.json`:
+
+```json
+{
+  "dependencies": {
+    "@cozeloop/components": "workspace:*"
+  }
+}
+```
+
+Then run:
+
+```bash
+rush update
+```
+
+### Usage
+
+```typescript
+import { /* exported functions/components */ } from '@cozeloop/components';
+
+// Example usage
+// TODO: Add specific usage examples
+```
+
+## Features
+
+- Core functionality for Coze Loop
+- TypeScript support
+- Modern ES modules
+
+## API Reference
+
+### Exports
+
+- `ColumnSelector, type ColumnItem`
+- `TooltipWhenDisabled`
+- `LoopTable`
+- `TableWithPagination,
+  DEFAULT_PAGE_SIZE,
+  PAGE_SIZE_OPTIONS,`
+- `PageError,
+  PageLoading,
+  PageNoAuth,
+  PageNoContent,
+  PageNotFound,`
+- `TableColActions`
+- `LoopTabs`
+- `LargeTxtRender`
+- `InputSlider`
+- `handleCopy, sleep`
+
+*And more...*
+
+For detailed API documentation, please refer to the TypeScript definitions.
+
+## Development
+
+This package is built with:
+
+- TypeScript
+- React
+- Vitest for testing
+- ESLint for code quality
+
+## Contributing
+
+This package is part of the Coze Loop monorepo. Please follow the monorepo contribution guidelines.
+
+## License
+
+Apache-2.0

package/dist/es/index.css

@@ -0,0 +1,645 @@
+#loop-table-ZtuuXn .semi-table-container {
+  border: 1px solid var(--line-color-border-2, #eaedf1);
+  border-radius: 6px;
+  overflow: hidden;
+}
+
+#loop-table-ZtuuXn .semi-table-header {
+  background-color: var(--coz-bg, #f0f0f7);
+}
+
+#loop-table-ZtuuXn .semi-spin-wrapper svg {
+  width: 20px;
+  height: 20px;
+}
+
+#loop-table-ZtuuXn .semi-table-row:hover > .semi-table-row-cell:first-child {
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+}
+
+#loop-table-ZtuuXn .semi-table-row:hover > .semi-table-row-cell:last-child {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+
+#loop-table-ZtuuXn .semi-table-tbody .semi-table-row:last-child .semi-table-row-cell {
+  border-bottom: none;
+}
+
+#loop-table-ZtuuXn .semi-table-row-head {
+  box-sizing: border-box;
+  height: 42px;
+  color: var(--coz-fg-plus);
+  background: var(--coz-bg, #f0f0f7);
+  border-bottom: 1px solid var(--line-color-border-2, #eaedf1);
+  padding: 5px 20px;
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 20px;
+  background-color: var(--coz-bg, #f0f0f7) !important;
+}
+
+#loop-table-ZtuuXn .semi-table-row-head:before {
+  background-color: var(--coz-bg, #f0f0f7) !important;
+}
+
+#loop-table-ZtuuXn .semi-table-row {
+  background-color: var(--coz-bg-max);
+}
+
+#loop-table-ZtuuXn .semi-table-row:hover {
+  border-radius: 0 !important;
+}
+
+#loop-table-ZtuuXn .semi-table-row:hover .semi-table-row-cell {
+  background-color: var(--coz-bg);
+}
+
+#loop-table-ZtuuXn .semi-table-row:hover .semi-table-cell-fixed-left {
+  background-image: linear-gradient(0deg, var(--coz-bg), var(--coz-bg));
+}
+
+#loop-table-ZtuuXn .semi-table-row:hover .semi-table-cell-fixed-right {
+  background-image: linear-gradient(0deg, var(--coz-bg), var(--coz-bg));
+}
+
+#loop-table-ZtuuXn .semi-table-row-cell {
+  box-sizing: border-box;
+  height: 42px;
+  color: var(--coz-fg-primary);
+  vertical-align: top;
+  vertical-align: middle;
+  background-color: #fff;
+  border-radius: 0;
+  padding: 10px 20px;
+  font-size: 13px;
+  font-weight: 400;
+  overflow: hidden;
+}
+
+#loop-table-ZtuuXn .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-left-last {
+  border-right: none;
+  box-shadow: 2px 0 8px #0000000f;
+}
+
+#loop-table-ZtuuXn .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-left-last {
+  border-right: none;
+  box-shadow: 2px 0 8px #0000000f;
+}
+
+#loop-table-ZtuuXn .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-right-first {
+  border-left: none;
+  box-shadow: -2px 0 8px #0000000f;
+}
+
+#loop-table-ZtuuXn .semi-table-thead > .semi-table-row > .semi-table-row-head.semi-table-cell-fixed-right-first {
+  border-left: none;
+  box-shadow: -2px 0 8px #0000000f;
+}
+
+:is(#loop-table-ZtuuXn .semi-table-scroll-position-left .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-left-last, #loop-table .semi-table-scroll-position-left .semi-table-thead > .semi-table-row > .semi-table-cell-fixed-left-last, #loop-table .semi-table-scroll-position-right .semi-table-tbody > .semi-table-row > .semi-table-cell-fixed-right-first, #loop-table .semi-table-scroll-position-right .semi-table-thead > .semi-table-row > .semi-table-cell-fixed-right-first) {
+  box-shadow: none !important;
+}
+
+:is(#loop-table-ZtuuXn .semi-table-bordered .semi-table-thead > .semi-table-row > .semi-table-row-head:last-child, #loop-table .semi-table-bordered .semi-table-tbody > .semi-table-row > .semi-table-row-cell:last-child) {
+  border-right: none;
+}
+
+.table-col-actions-dropdown-olnsGG .coz-item-text {
+  align-content: center;
+  height: 32px;
+  width: 100% !important;
+  margin-right: 0 !important;
+}
+
+.tabs-xtRGQ6 {
+  flex-direction: column;
+  display: flex;
+}
+
+.tabs-xtRGQ6 .semi-tabs-bar-card.semi-tabs-bar-top .semi-tabs-tab:first-of-type {
+  margin-left: 24px;
+}
+
+.tabs-xtRGQ6 .semi-tabs-tab-card.semi-tabs-tab-top.semi-tabs-tab {
+  height: 36px;
+  color: var(--semi-color-text-0);
+  border: 1px solid var(--semi-color-border);
+  background-color: #f6f8fa;
+  border-top-left-radius: 4px;
+  border-top-right-radius: 4px;
+  padding-top: 6px;
+  padding-bottom: 6px;
+}
+
+.tabs-xtRGQ6 .semi-tabs-tab-card.semi-tabs-tab-top.semi-tabs-tab-active {
+  color: rgb(var(--coze-up-brand-9));
+  background: linear-gradient(to bottom, rgb(var(--coze-up-brand-9)) 2px, transparent 2px);
+  border-top: 1px solid rgb(var(--coze-up-brand-9));
+  border-bottom: 1px solid var(--semi-color-bg-2);
+}
+
+.tabs-xtRGQ6 .semi-tabs-content {
+  flex: 1;
+  padding: 0;
+  overflow: hidden;
+}
+
+.tabs-xtRGQ6 .semi-tabs-pane {
+  height: 100%;
+}
+
+.tabs-xtRGQ6 .semi-tabs-pane-motion-overlay {
+  height: 100%;
+}
+
+.tabs-xtRGQ6 .semi-tag-large {
+  height: 20px;
+}
+
+.input-slider-nrb15W {
+  align-items: center;
+  column-gap: 8px;
+  display: flex;
+}
+
+.input-slider-nrb15W .semi-slider {
+  flex: 1;
+  padding-left: 14px;
+}
+
+.input-slider-nrb15W .semi-slider-handle {
+  width: 12px !important;
+  height: 12px !important;
+  margin-top: 10px !important;
+}
+
+.input-slider-nrb15W .input-number-CQtlyn {
+  width: 90px;
+}
+
+.input-slider-nrb15W .input-number-CQtlyn .semi-input-number-suffix-btns {
+  height: auto !important;
+}
+
+.description-gjffk4 .semi-descriptions-item {
+  padding-bottom: 8px;
+}
+
+.description-gjffk4 .semi-descriptions-key {
+  font-size: 13px !important;
+}
+
+.description-gjffk4 th {
+  padding-right: 12px;
+}
+
+.primary-title-jtuLYY {
+  align-items: center;
+  gap: 4px;
+  font-weight: 600;
+  display: flex;
+  position: relative;
+}
+
+.primary-title-jtuLYY:before {
+  content: "";
+  background-color: var(--semi-color-primary);
+  width: 2px;
+  height: 14px;
+}
+
+.sheet-ZBSI8O .semi-sidesheet-header {
+  border-bottom: 1px solid var(--semi-color-border);
+  align-items: flex-start;
+  padding: 18px 24px;
+  display: flex;
+}
+
+.sheet-ZBSI8O .semi-sidesheet-footer {
+  border-top: 1px solid var(--semi-color-border);
+}
+
+.row-Vt7Bgj {
+  flex-direction: row;
+  align-items: center;
+  display: flex;
+}
+
+.row-border-vZcL1U {
+  border-top: 1px solid var(--semi-color-border);
+}
+
+.cell-thead-wLFYez {
+  color: var(--semi-color-text-2);
+  background-color: var(--fornax-table-header-color);
+  border: 1px solid #fff;
+}
+
+.cell-n0obTX {
+  padding: 8px 12px;
+}
+
+.cell-left-wG3kZL {
+  flex-grow: 1;
+  flex-shrink: 1;
+  width: 0;
+}
+
+.cell-right-KbGFQ9 {
+  box-sizing: border-box;
+  flex-grow: 0;
+  flex-shrink: 0;
+  align-items: center;
+  width: 70px;
+  display: flex;
+}
+
+.table-header-form-ipuZ0x .semi-form-horizontal .semi-form-field {
+  padding-right: 8px;
+}
+
+.select-dropdown-style-o3gnrf .coz-select-option-item .option-text-wrapper {
+  padding-left: 8px;
+}
+
+.select-dropdown-style-o3gnrf .coz-select-option-item .option-text-wrapper .option-text {
+  padding-left: 0;
+}
+
+.select-dropdown-style-o3gnrf .coz-select-option-item.disabled .option-text-wrapper {
+  color: rgba(var(--coze-fg-1), var(--coze-fg-1-alpha));
+}
+
+:is(.coze-up-panel-st9yKG .semi-collapse-header, .coze-up-panel .semi-collapse-content) {
+  margin: 0;
+  padding: 0;
+}
+
+.coze-up-panel-st9yKG .semi-collapse-content {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+
+.coze-up-panel-st9yKG .chevron-icon-nCcWH9 {
+  cursor: pointer;
+  transition: transform .3s;
+}
+
+.coze-up-panel-st9yKG .chevron-icon-nCcWH9.chevron-icon-close-nRZ43H {
+  transform: rotate(-90deg);
+}
+
+.coze-up-panel-hidden-QXqP27 {
+  border: 0;
+}
+
+.logic-not-i_g5Y7 {
+  cursor: pointer;
+  user-select: none;
+  color: var(--semi-color-white);
+  opacity: .35;
+  background-color: rgba(var(--semi-grey-2), 1);
+  border-radius: 2px;
+  padding: 1px 2px;
+  font-size: 12px;
+  line-height: 14px;
+}
+
+.logic-not_active-fbWTlI {
+  opacity: 1;
+  background-color: rgba(var(--semi-red-4), 1);
+}
+
+.logic-toggle-tgPhuU {
+  align-self: stretch;
+  align-items: center;
+  margin-right: 8px;
+  display: flex;
+  position: relative;
+}
+
+.logic-toggle-tgPhuU:before {
+  content: "";
+  border: 0 solid #d0d4e0;
+  border-width: 1px 0 0 1px;
+  border-radius: 4px 0 0;
+  width: 50%;
+  height: calc(50% - 23px);
+  transition: border-color .5s;
+  position: absolute;
+  top: 12px;
+  left: 50%;
+}
+
+.logic-toggle-tgPhuU:after {
+  content: "";
+  border: 0 solid #d0d4e0;
+  border-width: 0 0 1px 1px;
+  border-radius: 0 0 0 4px;
+  width: 50%;
+  height: calc(50% - 23px);
+  transition: border-color .5s;
+  position: absolute;
+  bottom: 12px;
+  left: 50%;
+}
+
+.logic-toggle-tgPhuU .logic-toggle-tag-ahpXZm {
+  z-index: 2;
+  width: 32px;
+  height: 24px;
+  color: var(--coz-fg-secondary, #3d79f2);
+  text-align: center;
+  background-color: var(--coze-up-brand-10, #99bbff4d);
+  border-radius: 12px;
+  justify-content: center;
+  align-items: center;
+  padding: 4px;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 20px;
+  transition: background-color .5s;
+  display: flex;
+}
+
+.logic-toggle-tgPhuU .logic-toggle-tag-ahpXZm .logic-toggle-tag-not-yOXXnB {
+  margin-right: 4px;
+}
+
+.logic-toggle-tgPhuU .logic-toggle-tag-ahpXZm .logic-toggle-tag-icon-ssVJso {
+  margin-left: 4px;
+  font-size: 10px;
+}
+
+.logic-toggle-tgPhuU .logic-toggle-tag_edit-gB1cMB {
+  cursor: pointer;
+  user-select: none;
+  box-sizing: border-box;
+  white-space: nowrap;
+  background-color: #99bbff4d;
+  border-radius: 6px;
+  width: 32px;
+  height: 24px;
+  padding: 4px;
+}
+
+.logic-toggle_and-FlzXao {
+  --border-color: rgba(var(--semi-blue-3), 1);
+  --tag-bg-color: rgba(var(--semi-blue-0), 1);
+  --tag-hover-bg-color: rgba(var(--semi-blue-1), 1);
+}
+
+.logic-toggle_or-LHfIPj {
+  --border-color: rgba(var(--semi-orange-3), 1);
+  --tag-bg-color: rgba(var(--semi-orange-0), 1);
+  --tag-hover-bg-color: rgba(var(--semi-orange-1), 1);
+}
+
+.logic-toggle_hide-line-xcqY69:before, .logic-toggle_hide-line-xcqY69:after {
+  display: none;
+}
+
+.logic-toggle-select-dropdown-PFkS65 .semi-select-option {
+  padding: 4px 6px;
+  font-size: 12px;
+}
+
+.logic-toggle-select-dropdown-PFkS65 .semi-select-option .semi-select-option-icon {
+  margin-right: 4px;
+}
+
+.logic-toggle-select-dropdown-PFkS65 .semi-select-option .semi-select-option-icon .semi-icon-default {
+  font-size: 12px;
+}
+
+.expr-render-text-QUye7y {
+  word-break: break-all;
+  max-width: 100%;
+  font-size: 12px;
+  line-height: 24px;
+  display: inline-block;
+}
+
+.expr-render-group-qPKkPP {
+  width: 100%;
+}
+
+.expr-render-group-qPKkPP .del-expr-group-btn-g3W5Lw {
+  margin-left: 16px;
+}
+
+.expr-render-group-qPKkPP .expr-render-group-title-kODMKe {
+  align-items: center;
+  padding: 4px 6px;
+  font-size: 12px;
+  font-weight: 500;
+  line-height: 16px;
+  display: flex;
+}
+
+.expr-render-group-qPKkPP .expr-render-group-content-x9oezj {
+  align-items: center;
+  padding: 4px 8px;
+  display: flex;
+}
+
+.expr-render-group-qPKkPP .expr-render-expr-items-rO6GD5 {
+  flex: 1;
+}
+
+.expr-render-group-qPKkPP .expr-render-expr-items-rO6GD5 > div:not(:first-of-type) {
+  margin-top: 8px;
+}
+
+.expr-render-group_delete-tLE2d9 {
+  background-color: rgba(var(--semi-red-0), 1);
+}
+
+.expr-render-expr-item-vpMkQR {
+  box-sizing: border-box;
+  border-radius: 4px;
+  flex-wrap: nowrap;
+  align-items: center;
+  gap: 8px;
+  padding: 0 4px;
+  display: flex;
+}
+
+.expr-render-del-btn-DX28fy {
+  height: 20px;
+}
+
+.expr-render-del-btn-DX28fy .semi-icon-default {
+  color: rgba(var(--semi-grey-5), 1);
+  font-size: 12px;
+}
+
+.expr-render-tool-XlsGbr {
+  align-items: center;
+  gap: 4px;
+  margin-top: 6px;
+  padding: 0 4px 4px;
+  display: flex;
+}
+
+.expr-render-tool-XlsGbr .expr-render-tool-btn-BXfW_7 {
+  height: 20px;
+  padding-left: 6px;
+  padding-right: 6px;
+  font-size: 12px;
+  font-weight: 400;
+}
+
+.expr-render-tool-XlsGbr .expr-render-tool-btn-BXfW_7 .semi-icon-default {
+  font-size: 12px;
+}
+
+.expr-logic-editor-DCh_VP .expr-render-del-btn {
+  background-color: #0000 !important;
+}
+
+.expr-logic-editor-DCh_VP .expr-render-del-btn:hover {
+  background-color: rgba(var(--coze-bg-5), var(--coze-bg-5-alpha)) !important;
+}
+
+.video-preview-modal-TRvZA4 .semi-modal-content {
+  gap: 6px !important;
+  padding-top: 8px !important;
+  padding-bottom: 0 !important;
+}
+
+.video-preview-modal-TRvZA4 .semi-modal-body {
+  background: #000;
+  margin: 0 -24px !important;
+  padding: 6px 0 0 !important;
+}
+
+.video-preview-modal-TRvZA4 .semi-modal-footer {
+  display: none;
+}
+
+.video-preview-modal-TRvZA4 video {
+  object-fit: contain;
+}
+
+.ghost-kDAF3r {
+  opacity: .5;
+}
+
+.drag-wBqaGf {
+  max-height: 100px;
+  overflow: hidden;
+}
+
+.select-Mjmv9h {
+  height: 24px !important;
+  min-height: 24px !important;
+}
+
+.select-Mjmv9h .semi-select-selection-text .coz-chip {
+  padding-right: 0;
+}
+
+.select-Mjmv9h .semi-select-arrow {
+  padding-left: 0 !important;
+}
+
+.step-nav-RHJlOX {
+  justify-content: center;
+  align-items: center;
+  gap: 28px;
+  height: 24px;
+  display: flex;
+}
+
+.step-nav-RHJlOX .tab-step-gThbGo {
+  color: #2029459e;
+  align-items: center;
+  gap: 8px;
+  display: flex;
+  font-weight: 500 !important;
+}
+
+.step-nav-RHJlOX .tab-step-gThbGo .tab-icon-VLWtow {
+  text-align: center;
+  background: #5768a114;
+  border-radius: 12px;
+  justify-content: center;
+  align-items: center;
+  width: 24px;
+  height: 24px;
+  font-size: 13px;
+  font-style: normal;
+  font-weight: 500;
+  line-height: 24px;
+  display: inline-flex;
+}
+
+.step-nav-RHJlOX .tab-active-x7oVdY {
+  color: #5147ff;
+}
+
+.step-nav-RHJlOX .tab-active-x7oVdY .tab-icon-VLWtow {
+  color: #fff;
+  background: #5147ff;
+}
+
+.full-PbFKOt textarea {
+  height: calc(100vh - 126px);
+}
+
+.tabs-GNhC2M {
+  flex-direction: column;
+  height: 100%;
+  display: flex;
+  position: relative;
+  top: -14px;
+}
+
+.tabs-GNhC2M .semi-tabs-bar {
+  flex-shrink: 0;
+}
+
+.tabs-GNhC2M .semi-tabs-content {
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-height: 0;
+  padding: 16px 0 0;
+}
+
+.tabs-GNhC2M .semi-tabs-pane {
+  height: 100%;
+}
+
+.tabs-GNhC2M .semi-tabs-pane-motion-overlay {
+  height: 100%;
+}
+
+.container-Zxbk2N {
+  border: 1px solid var(--semi-color-border);
+  border-radius: var(--semi-border-radius-medium);
+  padding: 8px 16px;
+}
+
+.shadow-rfFePf {
+  transition: box-shadow .3s;
+}
+
+.shadow-rfFePf:hover {
+  box-shadow: var(--semi-shadow-elevated);
+  z-index: 1;
+}
+
+.code-container-A_QOb1 {
+  background-color: #1e1e1e;
+  border-radius: 6px;
+  flex-direction: column;
+  height: 292px;
+  padding: 12px 0;
+  display: flex;
+  position: relative;
+  overflow: auto;
+}
+