@morlay/ui-conversation-message-actions 0.0.18 → 0.0.19-alpha.1

package/src/client/chat-node/MessageItem.module.css

@@ -1,290 +0,0 @@
-/* User bubble: right-aligned column (bubble + IconActions). Figma
-   User_Bubble/message_container 659:38813 — r22 fill, actions gap 6 below. */
-
-.userRow {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-end;
-  gap: 6px;
-}
-
-.userStack {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-end;
-  gap: 8px;
-  min-width: 0;
-  max-width: min(525px, 82%);
-}
-.bubble {
-  /* 525px cap inside the 736 column; percentage keeps narrow windows sane. */
-  max-width: 100%;
-  background: var(--dsw-specific-bubble);
-  border-radius: 22px;
-  /* 44px single-line bubble: 24 line + 10 vertical padding each side. */
-  padding: 10px 16px;
-  font-size: 16px;
-  line-height: 24px;
-  color: var(--dsw-alias-label-primary);
-}
-
-.contextRow {
-  padding: 2px 0;
-}
-
-/* Compaction marker: one dim 24px row with a context icon at rest and a
-   hover/focus disclosure for the summary body. Dimmed title (not
-   label-primary) — the row is a boundary notice, not conversation content. */
-.compactionRow {
-  padding: 2px 0;
-}
-
-.compactionButton {
-  display: flex;
-  align-items: center;
-  width: 100%;
-  height: 24px;
-  min-width: 0;
-  padding: 0;
-  border: none;
-  border-radius: 6px;
-  background: none;
-  color: inherit;
-  font: inherit;
-  text-align: left;
-}
-
-.compactionButton:not(:disabled) {
-  cursor: pointer;
-}
-
-.compactionButton:not(:disabled):hover {
-  background: var(--dsw-alias-interactive-bg-hover);
-}
-
-.compactionLeading {
-  flex: none;
-  display: inline-grid;
-  place-items: center;
-  width: 16px;
-  height: 16px;
-  margin-right: 6px;
-  color: var(--dsw-alias-label-secondary);
-}
-
-.compactionContextIcon,
-.compactionDisclosureIcon {
-  display: inline-flex;
-  grid-area: 1 / 1;
-  align-items: center;
-  justify-content: center;
-}
-
-.compactionDisclosureIcon {
-  opacity: 0;
-}
-
-.compactionButton:not(:disabled):hover .compactionContextIcon,
-.compactionButton:not(:disabled):focus-visible .compactionContextIcon {
-  opacity: 0;
-}
-
-.compactionButton:not(:disabled):hover .compactionDisclosureIcon,
-.compactionButton:not(:disabled):focus-visible .compactionDisclosureIcon {
-  opacity: 1;
-}
-
-.compactionTitle {
-  flex: none;
-  font-size: 14px;
-  line-height: 24px;
-  color: var(--dsw-alias-label-primary-dimmed);
-}
-
-.compactionSep {
-  flex: none;
-  width: 2px;
-  height: 2px;
-  margin: 0 8px;
-  border-radius: 1px;
-  background: var(--dsw-alias-label-caption);
-}
-
-.compactionSummary {
-  flex: 1 1 auto;
-  min-width: 0;
-  overflow: hidden;
-  color: var(--dsw-alias-label-tertiary);
-  font-size: 14px;
-  line-height: 24px;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.compactionBody {
-  padding: 4px 0 4px 22px;
-  color: var(--dsw-alias-label-tertiary);
-  font-size: 14px;
-  line-height: 24px;
-}
-
-.retryRow {
-  color: var(--dsw-alias-label-tertiary);
-  font-size: 13px;
-  line-height: 20px;
-}
-
-.retrySummary {
-  display: inline-flex;
-  align-items: center;
-  width: fit-content;
-  padding: 2px 0;
-  gap: 7px;
-  border-radius: 3px;
-  color: inherit;
-  cursor: pointer;
-  list-style: none;
-  user-select: none;
-}
-
-.retrySummary::-webkit-details-marker {
-  display: none;
-}
-
-.retrySummary::after {
-  width: 6px;
-  height: 6px;
-  border-right: 1.5px solid currentcolor;
-  border-bottom: 1.5px solid currentcolor;
-  content: "";
-  opacity: 0.8;
-  transform: rotate(-45deg);
-  transition: transform 120ms ease;
-}
-
-.retrySummary:hover {
-  color: var(--dsw-alias-label-secondary);
-}
-
-.retrySummary:focus-visible {
-  outline: 1.5px solid var(--dsw-alias-button-info-fill);
-  outline-offset: 2px;
-}
-
-.retryText {
-  color: inherit;
-}
-
-.retryRow[data-active] .retryText {
-  background: linear-gradient(
-    90deg,
-    var(--dsw-alias-label-tertiary) 0%,
-    var(--dsw-alias-label-tertiary) 40%,
-    var(--dsw-alias-label-secondary) 50%,
-    var(--dsw-alias-label-tertiary) 60%,
-    var(--dsw-alias-label-tertiary) 100%
-  );
-  background-position: 100% 50%;
-  background-size: 200% 100%;
-  background-clip: text;
-  color: transparent;
-  animation: retry-shimmer 1.6s ease-in-out infinite;
-}
-
-.retryRow[open] .retrySummary::after {
-  transform: rotate(45deg);
-}
-
-.retryDetails {
-  display: grid;
-  gap: 2px;
-  margin-top: 3px;
-  padding-left: 14px;
-  overflow-wrap: anywhere;
-  font-size: 12px;
-  line-height: 18px;
-}
-
-.retryDetailLabel {
-  color: var(--dsw-alias-label-secondary);
-}
-
-.turnErrorRow {
-  display: grid;
-  grid-template-columns: 10px minmax(0, 1fr) auto;
-  gap: 8px;
-  align-items: start;
-  padding: 2px 0;
-  font-size: 13px;
-  line-height: 20px;
-}
-
-.turnErrorDot {
-  margin-top: 5px;
-}
-
-.turnErrorCopy {
-  min-width: 0;
-  overflow-wrap: anywhere;
-}
-
-.turnErrorTitle {
-  margin-right: 6px;
-  color: var(--dsw-alias-state-error-primary);
-  font-weight: 600;
-}
-
-.turnErrorMessage {
-  color: var(--dsw-alias-label-secondary);
-}
-
-.turnErrorCode {
-  color: var(--dsw-alias-label-tertiary);
-  font: var(--dsw-font-markdown-code-block-small);
-}
-
-.maxTokensTitle {
-  margin-right: 6px;
-  color: var(--dsw-alias-state-warn-primary);
-  font-weight: 600;
-}
-
-@keyframes retry-shimmer {
-  from {
-    background-position: 100% 50%;
-  }
-
-  to {
-    background-position: 0 50%;
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .retryRow[data-active] .retryText {
-    background: none;
-    color: inherit;
-    animation: none;
-  }
-}
-
-/* Reference chip projection inside a user bubble (`<skill>name</skill>` model
-   spans render as chips; free geometry — no textarea pairing here). */
-.refChip {
-  display: inline-block;
-  margin: 0 2px;
-  padding: 0 8px;
-  border-radius: 6px;
-  background: rgba(97, 135, 216, 0.22);
-  color: var(--dsw-alias-label-primary);
-  font-size: 0.85em;
-  line-height: 1.6;
-  white-space: nowrap;
-  vertical-align: baseline;
-}
-
-/* Retry-confirmation modal action row. */
-.confirmActions {
-  display: flex;
-  justify-content: flex-end;
-  gap: 8px;
-}

package/src/client/css-modules.d.ts

@@ -1,4 +0,0 @@
-declare module "*.module.css" {
-  const classes: Record<string, string>;
-  export default classes;
-}

package/src/client/import-action.tsx

@@ -1,74 +0,0 @@
-import { useCallback, useRef, useState, type ReactElement } from "react";
-import { Button, IconProps } from "@deepseek-ai/dsh-client-ui-primitives";
-import type { SessionEditorState } from "./controller.ts";
-
-export interface SessionImportActionProps {
-  useSessionEditor: <S>(sel: (s: SessionEditorState) => S) => S;
-
-  importSession: (file: File) => Promise<boolean>;
-}
-
-export const IconUpload = ({ size = 14, className }: IconProps) => (
-  <svg
-    width={size}
-    height={size}
-    className={className}
-    viewBox="0 0 24 24"
-    fill="none"
-    xmlns="http://www.w3.org/2000/svg"
-    stroke="currentColor"
-    stroke-width="2"
-    stroke-linecap="round"
-    stroke-linejoin="round"
-  >
-    <path d="M12 3v12" />
-    <path d="m17 8-5-5-5 5" />
-    <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
-  </svg>
-);
-
-export function SessionImportAction({
-  useSessionEditor,
-  importSession,
-}: SessionImportActionProps): ReactElement {
-  const inputRef = useRef<HTMLInputElement>(null);
-  const importing = useSessionEditor((s) => s.pending === "import");
-  const error = useSessionEditor((s) => s.error);
-  const [busy, setBusy] = useState(false);
-
-  const onPick = useCallback(
-    (file: File | undefined) => {
-      if (file === undefined) return;
-      setBusy(true);
-      void importSession(file).finally(() => setBusy(false));
-    },
-    [importSession],
-  );
-
-  const working = busy || importing;
-  return (
-    <>
-      <Button
-        size="sm"
-        icon={<IconUpload />}
-        disabled={working}
-        aria-busy={working}
-        aria-label={working ? "导入中…" : "导入会话"}
-        title={error ?? "导入会话：用导出的 zip 覆盖当前会话内容"}
-        onClick={() => inputRef.current?.click()}
-      >
-        <input
-          ref={inputRef}
-          type="file"
-          accept=".zip,application/zip"
-          style={{ display: "none" }}
-          onChange={(e) => {
-            const file = e.target.files?.[0];
-            e.target.value = "";
-            onPick(file);
-          }}
-        />
-      </Button>
-    </>
-  );
-}