@fudanda/workflow 1.20261015.1-beta.1 → 2.20261024.1-beta.2

package/vendor/coze/source/components/node-render/node-render-new/fields/overflow-tag-list.tsx

@@ -1,162 +1,162 @@
-/*
- * Copyright 2025 coze-dev Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import React, {
-  type ReactNode,
-  useLayoutEffect,
-  useRef,
-  useState,
-} from 'react';
-
-import classnames from 'classnames';
-import { IconCozMore } from '@coze-arch/coze-design/icons';
-import { Tooltip, IconButton } from '@coze-arch/coze-design';
-import { Dropdown } from '@coze-arch/bot-semi';
-
-import s from './overflow-tag-list.module.less';
-
-export interface TagProps {
-  key?: string;
-  icon?: ReactNode;
-  label?: ReactNode;
-  tooltip?: ReactNode;
-}
-
-export interface OverflowTagListProps<T extends TagProps = TagProps> {
-  /* tag list */
-  value?: T[];
-  enableTooltip?: boolean;
-  tagItemRenderer?: (tagData: T) => ReactNode;
-  dropdownClassName?: string;
-  disableMore?: boolean;
-}
-
-const TAG_ITEM_IDENTIFIER_CLASS = 'tag-item-wrapper';
-
-const defaultTagItemRenderer = (tag: TagProps): ReactNode => {
-  const { icon, label = '' } = tag;
-  return (
-    <div className={classnames(s.tagItem, s.limitWidth, 'gap-[4px]')}>
-      {icon ? (
-        <span className={classnames(s.tagItemIcon, 'text-lg', 'coz-fg-dim')}>
-          {icon}
-        </span>
-      ) : null}
-      <span className={s.tagItemLabel}>{label}</span>
-    </div>
-  );
-};
-
-export function OverflowTagList<T extends TagProps = TagProps>({
-  value = [],
-  enableTooltip,
-  tagItemRenderer,
-  dropdownClassName,
-  disableMore,
-}: OverflowTagListProps<T>) {
-  const renderTags = (tags: T[]) =>
-    tags.map(tag => {
-      const { tooltip, key } = tag;
-      const tagItemContent =
-        tagItemRenderer?.(tag) || defaultTagItemRenderer(tag);
-      const tagItem = (
-        <div
-          key={key}
-          className={classnames(TAG_ITEM_IDENTIFIER_CLASS, 'max-w-full')}
-        >
-          {tagItemContent}
-        </div>
-      );
-      if (!tooltip || !enableTooltip) {
-        return tagItem;
-      }
-      return (
-        <Tooltip
-          key={key ? `tooltip-${key}` : undefined}
-          content={<span className="coz-fg-primary text-lg">{tooltip}</span>}
-          style={{ backgroundColor: 'rgba(var(--coze-bg-3), 1)' }}
-        >
-          {tagItem}
-        </Tooltip>
-      );
-    });
-
-  const tagListRef = useRef<HTMLDivElement | null>(null);
-  const [showOverlay, setShowOverlay] = useState(false);
-
-  useLayoutEffect(() => {
-    if (!tagListRef.current) {
-      return;
-    }
-    const listWidth = tagListRef.current?.clientWidth ?? 0;
-    const tags = Array.from(
-      tagListRef.current.getElementsByClassName(TAG_ITEM_IDENTIFIER_CLASS),
-    ) as HTMLElement[];
-    if (!tags?.length) {
-      setShowOverlay(false);
-    } else {
-      const lastTag = tags[tags.length - 1];
-      const right = lastTag.offsetWidth + lastTag.offsetLeft;
-      setShowOverlay(right > listWidth);
-    }
-  }, [value]);
-
-  return (
-    <div
-      ref={tagListRef}
-      className={classnames(s.overflowTagList, 'flex gap-1.5 items-center')}
-    >
-      {renderTags(value)}
-      {showOverlay ? (
-        <div key="overlay" className={s.overlay}>
-          <div className={s.overlayMask}></div>
-          {!disableMore && (
-            <Dropdown
-              position="bottomRight"
-              render={
-                <div
-                  className={classnames(
-                    'w-[230px] p-1.5 gap-1.5 flex flex-row flex-wrap',
-                    {
-                      [dropdownClassName as string]: dropdownClassName,
-                    },
-                  )}
-                >
-                  {renderTags(value)}
-                </div>
-              }
-            >
-              <IconButton
-                className={classnames('w-full', 'h-full')}
-                wrapperClass={classnames(
-                  'pointer-events-auto',
-                  'text-[0px]',
-                  'coz-bg-plus',
-                  'w-[22px]',
-                  'h-[20px]',
-                )}
-                style={{ height: '100%' }}
-                size="mini"
-                iconSize="small"
-                icon={<IconCozMore />}
-              />
-            </Dropdown>
-          )}
-        </div>
-      ) : null}
-    </div>
-  );
-}
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React, {
+  type ReactNode,
+  useLayoutEffect,
+  useRef,
+  useState,
+} from 'react';
+
+import classnames from 'classnames';
+import { IconCozMore } from '@coze-arch/coze-design/icons';
+import { Tooltip, IconButton } from '@coze-arch/coze-design';
+import { Dropdown } from '@coze-arch/bot-semi';
+
+import s from './overflow-tag-list.module.less';
+
+export interface TagProps {
+  key?: string;
+  icon?: ReactNode;
+  label?: ReactNode;
+  tooltip?: ReactNode;
+}
+
+export interface OverflowTagListProps<T extends TagProps = TagProps> {
+  /* tag list */
+  value?: T[];
+  enableTooltip?: boolean;
+  tagItemRenderer?: (tagData: T) => ReactNode;
+  dropdownClassName?: string;
+  disableMore?: boolean;
+}
+
+const TAG_ITEM_IDENTIFIER_CLASS = 'tag-item-wrapper';
+
+const defaultTagItemRenderer = (tag: TagProps): ReactNode => {
+  const { icon, label = '' } = tag;
+  return (
+    <div className={classnames(s.tagItem, s.limitWidth, 'gap-[4px]')}>
+      {icon ? (
+        <span className={classnames(s.tagItemIcon, 'text-lg', 'coz-fg-dim')}>
+          {icon}
+        </span>
+      ) : null}
+      <span className={s.tagItemLabel}>{label}</span>
+    </div>
+  );
+};
+
+export function OverflowTagList<T extends TagProps = TagProps>({
+  value = [],
+  enableTooltip,
+  tagItemRenderer,
+  dropdownClassName,
+  disableMore,
+}: OverflowTagListProps<T>) {
+  const renderTags = (tags: T[]) =>
+    tags.map(tag => {
+      const { tooltip, key } = tag;
+      const tagItemContent =
+        tagItemRenderer?.(tag) || defaultTagItemRenderer(tag);
+      const tagItem = (
+        <div
+          key={key}
+          className={classnames(TAG_ITEM_IDENTIFIER_CLASS, 'max-w-full')}
+        >
+          {tagItemContent}
+        </div>
+      );
+      if (!tooltip || !enableTooltip) {
+        return tagItem;
+      }
+      return (
+        <Tooltip
+          key={key ? `tooltip-${key}` : undefined}
+          content={<span className="coz-fg-primary text-lg">{tooltip}</span>}
+          style={{ backgroundColor: 'rgba(var(--coze-bg-3), 1)' }}
+        >
+          {tagItem}
+        </Tooltip>
+      );
+    });
+
+  const tagListRef = useRef<HTMLDivElement | null>(null);
+  const [showOverlay, setShowOverlay] = useState(false);
+
+  useLayoutEffect(() => {
+    if (!tagListRef.current) {
+      return;
+    }
+    const listWidth = tagListRef.current?.clientWidth ?? 0;
+    const tags = Array.from(
+      tagListRef.current.getElementsByClassName(TAG_ITEM_IDENTIFIER_CLASS),
+    ) as HTMLElement[];
+    if (!tags?.length) {
+      setShowOverlay(false);
+    } else {
+      const lastTag = tags[tags.length - 1];
+      const right = lastTag.offsetWidth + lastTag.offsetLeft;
+      setShowOverlay(right > listWidth);
+    }
+  }, [value]);
+
+  return (
+    <div
+      ref={tagListRef}
+      className={classnames(s.overflowTagList, 'flex gap-1.5 items-center')}
+    >
+      {renderTags(value)}
+      {showOverlay ? (
+        <div key="overlay" className={s.overlay}>
+          <div className={s.overlayMask}></div>
+          {!disableMore && (
+            <Dropdown
+              position="bottomRight"
+              render={
+                <div
+                  className={classnames(
+                    'w-[230px] p-1.5 gap-1.5 flex flex-row flex-wrap',
+                    {
+                      [dropdownClassName as string]: dropdownClassName,
+                    },
+                  )}
+                >
+                  {renderTags(value)}
+                </div>
+              }
+            >
+              <IconButton
+                className={classnames('w-full', 'h-full')}
+                wrapperClass={classnames(
+                  'pointer-events-auto',
+                  'text-[0px]',
+                  'coz-bg-plus',
+                  'w-[22px]',
+                  'h-[20px]',
+                )}
+                style={{ height: '100%' }}
+                size="mini"
+                iconSize="small"
+                icon={<IconCozMore />}
+              />
+            </Dropdown>
+          )}
+        </div>
+      ) : null}
+    </div>
+  );
+}

package/vendor/coze/source/components/node-render/node-render-new/fields/variable-tag-list.module.less

@@ -1,48 +1,48 @@
-
-.variable-tag {
-  @apply flex items-center coz-mg-primary rounded-mini cursor-pointer coz-fg-secondary font-medium;
-
-  max-width: 100%;
-
-  .variable-tag-label {
-    @apply leading-4 text-base coz-fg-primary;
-
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-  }
-
-  .variable-tag-icon {
-    @apply flex grow shrink-0;
-  }
-
-  &.variable-tag_default {
-    &:hover {
-      @apply coz-mg-primary-pressed;
-    }
-  }
-
-  &.variable-tag_warning {
-    @apply coz-fg-hglt-yellow coz-mg-hglt-yellow;
-
-    .variable-tag-label {
-      @apply coz-fg-hglt-yellow;
-    }
-
-    .variable-tag-icon {
-      @apply coz-fg-hglt-yellow-dim;
-    }
-  }
-
-  &.variable-tag_success {
-    @apply coz-fg-hglt-green coz-mg-hglt-green;
-
-    .variable-tag-label {
-      @apply coz-fg-hglt-green;
-    }
-
-    .variable-tag-icon {
-      @apply coz-fg-hglt-green-dim;
-    }
-  }
-}
+
+.variable-tag {
+  @apply flex items-center coz-mg-primary rounded-mini cursor-pointer coz-fg-secondary font-medium;
+
+  max-width: 100%;
+
+  .variable-tag-label {
+    @apply leading-4 text-base coz-fg-primary;
+
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  .variable-tag-icon {
+    @apply flex grow shrink-0;
+  }
+
+  &.variable-tag_default {
+    &:hover {
+      @apply coz-mg-primary-pressed;
+    }
+  }
+
+  &.variable-tag_warning {
+    @apply coz-fg-hglt-yellow coz-mg-hglt-yellow;
+
+    .variable-tag-label {
+      @apply coz-fg-hglt-yellow;
+    }
+
+    .variable-tag-icon {
+      @apply coz-fg-hglt-yellow-dim;
+    }
+  }
+
+  &.variable-tag_success {
+    @apply coz-fg-hglt-green coz-mg-hglt-green;
+
+    .variable-tag-label {
+      @apply coz-fg-hglt-green;
+    }
+
+    .variable-tag-icon {
+      @apply coz-fg-hglt-green-dim;
+    }
+  }
+}

package/vendor/coze/source/components/node-render/node-render-new/fields/variable-tag-list.tsx

@@ -1,126 +1,126 @@
-/*
- * Copyright 2025 coze-dev Authors
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *     http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */
-
-import React, { type ReactNode, useMemo } from 'react';
-
-import classnames from 'classnames';
-import {
-  type ViewVariableType,
-  VARIABLE_TYPE_ALIAS_MAP,
-} from '@coze-workflow/base';
-import { I18n } from '@coze-arch/i18n';
-import { IconCozWarningCircle } from '@coze-arch/coze-design/icons';
-
-import { OverflowTagList, type TagProps } from './overflow-tag-list';
-import { VARIABLE_TYPE_ICON_MAP } from './constants';
-
-import s from './variable-tag-list.module.less';
-
-// state
-export enum VariableTagStatus {
-  Success = 'success',
-  Warning = 'warning',
-  Default = 'default',
-}
-
-export interface VariableTagProps {
-  key?: string;
-  /* Variable type */
-  type?: ViewVariableType;
-  /* Variable name, when empty, is displayed as Undefined/Undefined */
-  label?: ReactNode;
-  invalid?: boolean;
-  status?: VariableTagStatus;
-}
-
-export interface VariableTagListProps {
-  /* tag list */
-  value?: VariableTagProps[];
-  /**
-   * The maximum width of each tag, the default is the width of the parent container
-   */
-  maxTagWidth?: number;
-}
-
-interface VariableTagRenderProps extends TagProps {
-  invalid?: boolean;
-  status?: VariableTagStatus;
-}
-
-export const VariableTagList: React.FC<VariableTagListProps> = ({
-  value = [],
-  maxTagWidth,
-}) => {
-  const renderTag = ({
-    icon,
-    label,
-    invalid,
-    status,
-  }: VariableTagRenderProps) => {
-    if (!status && invalid) {
-      status = VariableTagStatus.Warning;
-    }
-
-    return (
-      <div
-        className={classnames(
-          s.variableTag,
-          'px-1 py-0.5 gap-0.5',
-          s[`variable-tag_${status || 'default'}`],
-        )}
-      >
-        <span
-          className={classnames(s.variableTagIcon, 'text-lg', 'coz-fg-dim')}
-        >
-          {icon}
-        </span>
-        <span className={s.variableTagLabel} style={{ maxWidth: maxTagWidth }}>
-          {label}
-        </span>
-      </div>
-    );
-  };
-
-  const formattedValue = useMemo<VariableTagRenderProps[]>(
-    () =>
-      value.map(v => {
-        const label = v.label || I18n.t('workflow_variable_undefined');
-        const icon = v.type ? (
-          VARIABLE_TYPE_ICON_MAP[v.type] || <IconCozWarningCircle />
-        ) : (
-          <IconCozWarningCircle />
-        );
-        const invalid = v.invalid || !v.label || !v.type;
-
-        return {
-          key: v.key,
-          label,
-          icon,
-          invalid,
-          tooltip: v.type ? VARIABLE_TYPE_ALIAS_MAP[v.type] : undefined,
-          status: v.status,
-        };
-      }),
-    [value],
-  );
-  return (
-    <OverflowTagList<VariableTagRenderProps>
-      value={formattedValue}
-      enableTooltip
-      tagItemRenderer={renderTag}
-    />
-  );
-};
+/*
+ * Copyright 2025 coze-dev Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import React, { type ReactNode, useMemo } from 'react';
+
+import classnames from 'classnames';
+import {
+  type ViewVariableType,
+  VARIABLE_TYPE_ALIAS_MAP,
+} from '@coze-workflow/base';
+import { I18n } from '@coze-arch/i18n';
+import { IconCozWarningCircle } from '@coze-arch/coze-design/icons';
+
+import { OverflowTagList, type TagProps } from './overflow-tag-list';
+import { VARIABLE_TYPE_ICON_MAP } from './constants';
+
+import s from './variable-tag-list.module.less';
+
+// state
+export enum VariableTagStatus {
+  Success = 'success',
+  Warning = 'warning',
+  Default = 'default',
+}
+
+export interface VariableTagProps {
+  key?: string;
+  /* Variable type */
+  type?: ViewVariableType;
+  /* Variable name, when empty, is displayed as Undefined/Undefined */
+  label?: ReactNode;
+  invalid?: boolean;
+  status?: VariableTagStatus;
+}
+
+export interface VariableTagListProps {
+  /* tag list */
+  value?: VariableTagProps[];
+  /**
+   * The maximum width of each tag, the default is the width of the parent container
+   */
+  maxTagWidth?: number;
+}
+
+interface VariableTagRenderProps extends TagProps {
+  invalid?: boolean;
+  status?: VariableTagStatus;
+}
+
+export const VariableTagList: React.FC<VariableTagListProps> = ({
+  value = [],
+  maxTagWidth,
+}) => {
+  const renderTag = ({
+    icon,
+    label,
+    invalid,
+    status,
+  }: VariableTagRenderProps) => {
+    if (!status && invalid) {
+      status = VariableTagStatus.Warning;
+    }
+
+    return (
+      <div
+        className={classnames(
+          s.variableTag,
+          'px-1 py-0.5 gap-0.5',
+          s[`variable-tag_${status || 'default'}`],
+        )}
+      >
+        <span
+          className={classnames(s.variableTagIcon, 'text-lg', 'coz-fg-dim')}
+        >
+          {icon}
+        </span>
+        <span className={s.variableTagLabel} style={{ maxWidth: maxTagWidth }}>
+          {label}
+        </span>
+      </div>
+    );
+  };
+
+  const formattedValue = useMemo<VariableTagRenderProps[]>(
+    () =>
+      value.map(v => {
+        const label = v.label || I18n.t('workflow_variable_undefined');
+        const icon = v.type ? (
+          VARIABLE_TYPE_ICON_MAP[v.type] || <IconCozWarningCircle />
+        ) : (
+          <IconCozWarningCircle />
+        );
+        const invalid = v.invalid || !v.label || !v.type;
+
+        return {
+          key: v.key,
+          label,
+          icon,
+          invalid,
+          tooltip: v.type ? VARIABLE_TYPE_ALIAS_MAP[v.type] : undefined,
+          status: v.status,
+        };
+      }),
+    [value],
+  );
+  return (
+    <OverflowTagList<VariableTagRenderProps>
+      value={formattedValue}
+      enableTooltip
+      tagItemRenderer={renderTag}
+    />
+  );
+};