sunpeak 0.1.4 → 0.1.16

package/dist/index.css

@@ -1,4 +1,5 @@
 /* src/styles/themes.css */
+@layer properties;
 .sp-antialiased {
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
@@ -191,6 +192,375 @@
 .sp-text-tertiary {
   color: var(--sp-color-text-tertiary);
 }
+.absolute {
+  position: absolute;
+}
+.fixed {
+  position: fixed;
+}
+.relative {
+  position: relative;
+}
+.container {
+  width: 100%;
+}
+.mx-auto {
+  margin-inline: auto;
+}
+.contents {
+  display: contents;
+}
+.flex {
+  display: flex;
+}
+.grid {
+  display: grid;
+}
+.hidden {
+  display: none;
+}
+.inline {
+  display: inline;
+}
+.aspect-square {
+  aspect-ratio: 1 / 1;
+}
+.w-full {
+  width: 100%;
+}
+.max-w-\[var\(--thread-content-max-width\)\] {
+  max-width: var(--thread-content-max-width);
+}
+.max-w-full {
+  max-width: 100%;
+}
+.flex-1 {
+  flex: 1;
+}
+.grow {
+  flex-grow: 1;
+}
+.resize {
+  resize: both;
+}
+.flex-col {
+  flex-direction: column;
+}
+.items-end {
+  align-items: flex-end;
+}
+.overflow-hidden {
+  overflow: hidden;
+}
+.border {
+  border-style: var(--tw-border-style);
+  border-width: 1px;
+}
+.text-start {
+  text-align: start;
+}
+.break-words {
+  overflow-wrap: break-word;
+}
+.whitespace-normal {
+  white-space: normal;
+}
+.transition {
+  transition-property:
+    color,
+    background-color,
+    border-color,
+    outline-color,
+    text-decoration-color,
+    fill,
+    stroke,
+    --tw-gradient-from,
+    --tw-gradient-via,
+    --tw-gradient-to,
+    opacity,
+    box-shadow,
+    transform,
+    translate,
+    scale,
+    rotate,
+    filter,
+    backdrop-filter,
+    display,
+    content-visibility,
+    overlay,
+    pointer-events;
+  transition-timing-function: var(--tw-ease, ease);
+  transition-duration: var(--tw-duration, 0s);
+}
+.\[--thread-content-max-width\:40rem\] {
+  --thread-content-max-width: 40rem;
+}
+.first\:pt-\[1px\] {
+  &:first-child {
+    padding-top: 1px;
+  }
+}
+.empty\:hidden {
+  &:empty {
+    display: none;
+  }
+}
+.chatgpt-simulator {
+  min-height: 100vh;
+  display: flex;
+  font-family: var(--sp-font-family);
+}
+.chatgpt-simulator--light {
+  background-color: var(--sp-light-color-bg-primary);
+  color: var(--sp-light-color-text-primary);
+}
+.chatgpt-simulator--light .chatgpt-simulator__sidebar {
+  background-color: var(--sp-light-color-bg-tertiary);
+  border-right: 1px solid var(--sp-light-color-border);
+}
+.chatgpt-simulator--light .chatgpt-simulator__message--user .chatgpt-simulator__message-content {
+  background-color: var(--sp-light-color-bg-tertiary);
+  color: var(--sp-light-color-text-primary);
+}
+.chatgpt-simulator--dark {
+  background-color: var(--sp-dark-color-bg-primary);
+  color: var(--sp-dark-color-text-primary);
+}
+.chatgpt-simulator--dark .chatgpt-simulator__sidebar {
+  background-color: var(--sp-dark-color-bg-secondary);
+  border-right: 1px solid var(--sp-dark-color-border);
+}
+.chatgpt-simulator--dark .chatgpt-simulator__sidebar select {
+  background-color: var(--sp-dark-color-bg-tertiary);
+  color: var(--sp-dark-color-text-primary);
+  border-color: var(--sp-dark-color-border);
+}
+.chatgpt-simulator--dark .chatgpt-simulator__message--user .chatgpt-simulator__message-content {
+  background-color: var(--sp-dark-color-bg-tertiary);
+  color: var(--sp-dark-color-text-primary);
+}
+.chatgpt-simulator__sidebar {
+  width: 250px;
+  min-width: 250px;
+  padding: var(--sp-spacing-5);
+  display: flex;
+  flex-direction: column;
+  gap: var(--sp-spacing-5);
+  overflow-y: auto;
+}
+.chatgpt-simulator__sidebar-header h2 {
+  margin: 0;
+  font-size: var(--sp-font-size-lg);
+  font-weight: var(--sp-font-weight-semibold);
+}
+.chatgpt-simulator__control-group {
+  display: flex;
+  flex-direction: column;
+  gap: var(--sp-spacing-4);
+}
+.chatgpt-simulator__control-group label {
+  display: flex;
+  flex-direction: column;
+  gap: var(--sp-spacing-2);
+  font-size: var(--sp-font-size-xs);
+  font-weight: var(--sp-font-weight-medium);
+}
+.chatgpt-simulator__control-group select {
+  padding: var(--sp-spacing-2) var(--sp-spacing-3);
+  border-radius: var(--sp-radius-sm);
+  border: 1px solid var(--sp-light-color-border);
+  font-size: var(--sp-font-size-sm);
+  background-color: var(--sp-light-color-bg-primary);
+  color: var(--sp-light-color-text-primary);
+  cursor: pointer;
+  width: 100%;
+}
+.chatgpt-simulator__control-group select:focus {
+  outline: 2px solid var(--sp-info);
+  outline-offset: 2px;
+}
+.chatgpt-simulator__main {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  margin: 0 auto;
+  overflow-y: auto;
+  padding: var(--sp-spacing-4) 0 var(--sp-spacing-4) var(--sp-spacing-6);
+  position: relative;
+}
+.chatgpt-simulator[data-display-mode=fullscreen] .chatgpt-simulator__main {
+  padding: 0;
+  height: 100vh;
+}
+.chatgpt-simulator__header h1 {
+  margin: 0 0 var(--sp-spacing-4) 0;
+  font-size: var(--sp-font-size-xl);
+  font-weight: var(--sp-font-weight-semibold);
+  color: inherit;
+}
+.chatgpt-simulator__close-button {
+  position: absolute;
+  top: var(--sp-spacing-4);
+  left: var(--sp-spacing-4);
+  width: 40px;
+  height: 40px;
+  border-radius: 50%;
+  border: none;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  z-index: 10;
+  transition: background-color 0.2s ease;
+}
+.chatgpt-simulator--light .chatgpt-simulator__close-button {
+  background-color: var(--sp-light-color-bg-secondary);
+  color: var(--sp-light-color-text-primary);
+}
+.chatgpt-simulator--light .chatgpt-simulator__close-button:hover {
+  background-color: var(--sp-light-color-bg-tertiary);
+}
+.chatgpt-simulator--dark .chatgpt-simulator__close-button {
+  background-color: var(--sp-dark-color-bg-tertiary);
+  color: var(--sp-dark-color-text-primary);
+}
+.chatgpt-simulator--dark .chatgpt-simulator__close-button:hover {
+  background-color: var(--sp-dark-color-bg-secondary);
+}
+.chatgpt-simulator__fullscreen-content {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  height: 100%;
+  overflow-y: auto;
+  padding-bottom: 80px;
+}
+.chatgpt-simulator__input-container {
+  position: absolute;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  padding: var(--sp-spacing-4) var(--sp-spacing-6);
+  display: flex;
+  justify-content: center;
+  pointer-events: none;
+}
+.chatgpt-simulator__input-container input {
+  pointer-events: auto;
+}
+.chatgpt-simulator__input {
+  width: 100%;
+  max-width: 800px;
+  padding: var(--sp-spacing-3) var(--sp-spacing-4);
+  font-size: var(--sp-font-size-base);
+  font-family: var(--sp-font-family);
+  border-radius: var(--sp-radius-2xl);
+  border: 1px solid;
+  outline: none;
+  transition: border-color 0.2s ease;
+}
+.chatgpt-simulator--light .chatgpt-simulator__input {
+  background-color: var(--sp-light-color-bg-tertiary);
+  border-color: var(--sp-light-color-border-subtle);
+  color: var(--sp-light-color-text-primary);
+}
+.chatgpt-simulator--light .chatgpt-simulator__input::-moz-placeholder {
+  color: var(--sp-light-color-text-tertiary);
+}
+.chatgpt-simulator--light .chatgpt-simulator__input::placeholder {
+  color: var(--sp-light-color-text-tertiary);
+}
+.chatgpt-simulator--dark .chatgpt-simulator__input {
+  background-color: var(--sp-dark-color-bg-tertiary);
+  border-color: var(--sp-dark-color-border-subtle);
+  color: var(--sp-dark-color-text-primary);
+}
+.chatgpt-simulator--dark .chatgpt-simulator__input::-moz-placeholder {
+  color: var(--sp-dark-color-text-tertiary);
+}
+.chatgpt-simulator--dark .chatgpt-simulator__input::placeholder {
+  color: var(--sp-dark-color-text-tertiary);
+}
+.chatgpt-simulator__input:disabled {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+.chatgpt-simulator__message {
+  display: flex;
+  align-items: flex-start;
+}
+.chatgpt-simulator__message--user {
+  justify-content: flex-end;
+  margin-left: auto;
+  margin-right: var(--sp-spacing-6);
+  max-width: 70%;
+}
+.chatgpt-simulator__message--assistant {
+  max-width: 100%;
+}
+.chatgpt-simulator__message-content {
+  flex: 1;
+  padding: var(--sp-spacing-2) var(--sp-spacing-4);
+  border-radius: var(--sp-radius-2xl);
+  line-height: var(--sp-line-height-normal);
+  font-size: var(--sp-font-size-base);
+  overflow: hidden;
+  min-width: 100px;
+}
+.chatgpt-simulator__message--user .chatgpt-simulator__message-content {
+  flex: 0 1 auto;
+  max-width: none;
+}
+.chatgpt-simulator__message--assistant .chatgpt-simulator__message-content {
+  background: transparent;
+  padding: 0;
+  flex: 1;
+  min-width: 0;
+}
+.chatgpt-simulator__app-title {
+  color: var(--sp-color-text-secondary);
+  display: flex;
+  align-items: center;
+  gap: var(--sp-spacing-2);
+  margin-top: var(--sp-spacing-2);
+  font-size: var(--sp-font-size-sm);
+  font-weight: var(--sp-font-weight-medium);
+  opacity: 0.7;
+}
+.chatgpt-simulator__app-icon {
+  font-size: var(--sp-font-size-base);
+  line-height: 1;
+}
+.chatgpt-simulator__app-name {
+  line-height: 1;
+}
+.chatgpt-simulator__component-slot {
+  overflow: hidden;
+  min-width: 300px;
+  max-width: 100%;
+}
+@media (max-width: 768px) {
+  .chatgpt-simulator {
+    flex-direction: column;
+  }
+  .chatgpt-simulator__sidebar {
+    width: 100%;
+    min-width: unset;
+    border-right: none;
+    border-bottom: 1px solid var(--sp-light-color-border);
+    padding: var(--sp-spacing-4);
+  }
+  .chatgpt-simulator--dark .chatgpt-simulator__sidebar {
+    border-bottom-color: var(--sp-dark-color-border);
+  }
+  .chatgpt-simulator__message--user {
+    max-width: 85%;
+  }
+  .chatgpt-simulator__component-slot {
+    min-width: 200px;
+  }
+}
 :root {
   --sp-font-family:
     -apple-system,
@@ -340,5 +710,16 @@
   --sp-color-border: var(--sp-dark-color-border);
   --sp-color-border-subtle: var(--sp-dark-color-border-subtle);
 }
+@property --tw-border-style { syntax: "*"; inherits: false; initial-value: solid; }
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *,
+    ::before,
+    ::after,
+    ::backdrop {
+      --tw-border-style: solid;
+    }
+  }
+}
 /*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
 /*# sourceMappingURL=themes.css.map */