From 59303ebb3cb03b654394094ee8e8069eea1c3114 Mon Sep 17 00:00:00 2001 From: Dominik Kundel Date: Mon, 9 Jun 2025 13:52:33 -0700 Subject: [PATCH 1/7] docs: reset search buttons --- docs/src/styles/global.css | 48 +++++++++++++++++++++----------------- 1 file changed, 27 insertions(+), 21 deletions(-) diff --git a/docs/src/styles/global.css b/docs/src/styles/global.css index db364975..1b4aba48 100644 --- a/docs/src/styles/global.css +++ b/docs/src/styles/global.css @@ -251,29 +251,35 @@ } site-search { - button { - border: 0 !important; - color: var(--openai-search-text) !important; - background-color: var(--openai-search-field-background) !important; - > kbd { - display: inline-flex; - gap: 0.25rem; - padding: 0 !important; - background-color: transparent !important; - - kbd { - padding-inline-start: 0.4rem !important; - padding-inline-end: 0.4rem !important; - border-radius: 4px !important; - background-color: var(--openai-search-button-color) !important; - color: var(--openai-search-text) !important; - } + > dialog { + background-color: var(--openai-code-background) !important; + } + + > button { + @media (min-width: 50rem) { + border: 0 !important; + color: var(--openai-search-text) !important; + background-color: var(--openai-search-field-background) !important; + > kbd { + display: inline-flex; + gap: 0.25rem; + padding: 0 !important; + background-color: transparent !important; - &:hover { kbd { - background-color: var( - --openai-search-button-hover-color - ) !important; + padding-inline-start: 0.4rem !important; + padding-inline-end: 0.4rem !important; + border-radius: 4px !important; + background-color: var(--openai-search-button-color) !important; + color: var(--openai-search-text) !important; + } + + &:hover { + kbd { + background-color: var( + --openai-search-button-hover-color + ) !important; + } } } } From 7b2f1481939cf4105b911ab256c645a51e6443be Mon Sep 17 00:00:00 2001 From: Dominik Kundel Date: Mon, 9 Jun 2025 14:21:06 -0700 Subject: [PATCH 2/7] docs: fix title link --- docs/src/components/Title.astro | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/docs/src/components/Title.astro b/docs/src/components/Title.astro index cad959d8..1ac6ba8f 100644 --- a/docs/src/components/Title.astro +++ b/docs/src/components/Title.astro @@ -1,5 +1,8 @@ --- import Logo from './Logo.astro'; +const { siteTitle, siteTitleHref } = Astro.locals.starlightRoute; --- - + + + From d6dae5004424ab9542f501a185aecc4f9267349f Mon Sep 17 00:00:00 2001 From: Dominik Kundel Date: Mon, 9 Jun 2025 14:21:44 -0700 Subject: [PATCH 3/7] docs: change line-height of code snippets --- docs/src/styles/global.css | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/docs/src/styles/global.css b/docs/src/styles/global.css index 1b4aba48..04bb17c0 100644 --- a/docs/src/styles/global.css +++ b/docs/src/styles/global.css @@ -412,6 +412,12 @@ } } + .sl-markdown-content { + .expressive-code .ec-line { + line-height: 1.2rem; + } + } + .sl-markdown-content .openai-hero { background-color: var(--openai-hero-background); border-radius: 24px; From fc08d6bb212d42a7432a7c7c99700f685a40c0ec Mon Sep 17 00:00:00 2001 From: Dominik Kundel Date: Mon, 9 Jun 2025 14:21:56 -0700 Subject: [PATCH 4/7] docs: color typescript on landing page --- docs/astro.config.mjs | 1 + docs/src/components/PageTitle.astro | 47 +++++++++++++++++++++++++++++ 2 files changed, 48 insertions(+) create mode 100644 docs/src/components/PageTitle.astro diff --git a/docs/astro.config.mjs b/docs/astro.config.mjs index cecdc99a..90547a03 100644 --- a/docs/astro.config.mjs +++ b/docs/astro.config.mjs @@ -317,6 +317,7 @@ export default defineConfig({ title: 'OpenAI Agents SDK', components: { SiteTitle: './src/components/Title.astro', + PageTitle: './src/components/PageTitle.astro', }, // defaultLocale: 'root', locales: { diff --git a/docs/src/components/PageTitle.astro b/docs/src/components/PageTitle.astro new file mode 100644 index 00000000..5c2a091b --- /dev/null +++ b/docs/src/components/PageTitle.astro @@ -0,0 +1,47 @@ +--- +import Default from '@astrojs/starlight/components/PageTitle.astro'; + +const isHomepage = + Astro.locals.starlightRoute.id === '' || + Astro.locals.starlightRoute.id === Astro.locals.starlightRoute.lang; +const rawTitle = Astro.locals.starlightRoute.entry.data.title; +const keyword = 'TypeScript'; +const idx = rawTitle.indexOf(keyword); +let beforeKeyword = rawTitle; +let afterKeyword = ''; +let hasKeyword = false; + +if (isHomepage && idx !== -1) { + beforeKeyword = rawTitle.slice(0, idx); + afterKeyword = rawTitle.slice(idx + keyword.length); + hasKeyword = true; +} +--- + +{ + isHomepage ? ( +

+ {beforeKeyword} + {hasKeyword ? {keyword} : ''} + {afterKeyword} +

+ ) : ( + + ) +} + + From 0e86bc31b33f9f45a8d103657cd67a901530b01c Mon Sep 17 00:00:00 2001 From: Dominik Kundel Date: Mon, 9 Jun 2025 14:38:21 -0700 Subject: [PATCH 5/7] docs: change navbar icons to contain text --- docs/astro.config.mjs | 10 ++---- docs/src/components/SocialIcons.astro | 45 +++++++++++++++++++++++++++ 2 files changed, 48 insertions(+), 7 deletions(-) create mode 100644 docs/src/components/SocialIcons.astro diff --git a/docs/astro.config.mjs b/docs/astro.config.mjs index 90547a03..137c289a 100644 --- a/docs/astro.config.mjs +++ b/docs/astro.config.mjs @@ -318,6 +318,7 @@ export default defineConfig({ components: { SiteTitle: './src/components/Title.astro', PageTitle: './src/components/PageTitle.astro', + SocialIcons: './src/components/SocialIcons.astro', }, // defaultLocale: 'root', locales: { @@ -331,20 +332,15 @@ export default defineConfig({ }, }, social: [ - { - icon: 'x.com', - href: 'https://x.com/OpenAIDevs', - label: 'OpenAI on X', - }, { icon: 'github', href: 'https://github.com/openai/openai-agents-js', - label: 'Agents SDK on GitHub', + label: 'openai-agents-js', }, { icon: 'seti:python', href: 'https://github.com/openai/openai-agents-python', - label: 'Agents SDK for Python', + label: 'Python SDK', }, ], editLink: { diff --git a/docs/src/components/SocialIcons.astro b/docs/src/components/SocialIcons.astro new file mode 100644 index 00000000..4f03bf4f --- /dev/null +++ b/docs/src/components/SocialIcons.astro @@ -0,0 +1,45 @@ +--- +import config from 'virtual:starlight/user-config'; +import { Icon } from '@astrojs/starlight/components'; + +const links = config.social || []; +--- + +{ + links.length > 0 && ( + <> + {links.map(({ label, href, icon }) => ( + + + {label} + + ))} + + ) +} + + From bb09e977a14a1cd5fd73f045e36eb3d9cbe907dd Mon Sep 17 00:00:00 2001 From: Dominik Kundel Date: Mon, 9 Jun 2025 15:35:35 -0700 Subject: [PATCH 6/7] docs: further design revisions --- docs/astro.config.mjs | 7 +------ docs/src/components/PageTitle.astro | 2 +- docs/src/components/SocialIcons.astro | 2 +- docs/src/content/docs/index.mdx | 4 +++- docs/src/content/docs/ja/index.mdx | 2 +- docs/src/styles/global.css | 29 ++++++++++++++++++++++----- examples/docs/toppage/textAgent.ts | 1 + 7 files changed, 32 insertions(+), 15 deletions(-) diff --git a/docs/astro.config.mjs b/docs/astro.config.mjs index 137c289a..e849bdce 100644 --- a/docs/astro.config.mjs +++ b/docs/astro.config.mjs @@ -332,11 +332,6 @@ export default defineConfig({ }, }, social: [ - { - icon: 'github', - href: 'https://github.com/openai/openai-agents-js', - label: 'openai-agents-js', - }, { icon: 'seti:python', href: 'https://github.com/openai/openai-agents-python', @@ -349,7 +344,7 @@ export default defineConfig({ plugins, sidebar, expressiveCode: { - themes: ['dracula', 'one-light'], + themes: ['houston', 'one-light'], }, customCss: ['./src/styles/global.css'], }), diff --git a/docs/src/components/PageTitle.astro b/docs/src/components/PageTitle.astro index 5c2a091b..4035080f 100644 --- a/docs/src/components/PageTitle.astro +++ b/docs/src/components/PageTitle.astro @@ -20,7 +20,7 @@ if (isHomepage && idx !== -1) { { isHomepage ? ( -

+

{beforeKeyword} {hasKeyword ? {keyword} : ''} {afterKeyword} diff --git a/docs/src/components/SocialIcons.astro b/docs/src/components/SocialIcons.astro index 4f03bf4f..e4999cbe 100644 --- a/docs/src/components/SocialIcons.astro +++ b/docs/src/components/SocialIcons.astro @@ -9,7 +9,7 @@ const links = config.social || []; links.length > 0 && ( <> {links.map(({ label, href, icon }) => ( - + {label} diff --git a/docs/src/content/docs/index.mdx b/docs/src/content/docs/index.mdx index 964f38cb..c6490314 100644 --- a/docs/src/content/docs/index.mdx +++ b/docs/src/content/docs/index.mdx @@ -1,5 +1,5 @@ --- -title: OpenAI Agents SDK for TypeScript +title: OpenAI Agents SDK TypeScript description: The OpenAI Agents SDK for TypeScript enables you to build agentic AI apps in a lightweight, easy-to-use package with very few abstractions. --- @@ -15,6 +15,8 @@ import helloWorldExample from '../../../../examples/docs/hello-world.ts?raw'; Let's build +## Overview + The [OpenAI Agents SDK for TypeScript](https://github.com/openai/openai-agents-js) enables you to build agentic AI apps in a lightweight, easy-to-use package with very few abstractions. It's a production-ready upgrade of our previous diff --git a/docs/src/content/docs/ja/index.mdx b/docs/src/content/docs/ja/index.mdx index f84959a1..35b76785 100644 --- a/docs/src/content/docs/ja/index.mdx +++ b/docs/src/content/docs/ja/index.mdx @@ -1,5 +1,5 @@ --- -title: OpenAI Agents SDK for TypeScript +title: OpenAI Agents SDK TypeScript description: The OpenAI Agents SDK for TypeScript enables you to build agentic AI apps in a lightweight, easy-to-use package with very few abstractions. --- diff --git a/docs/src/styles/global.css b/docs/src/styles/global.css index 04bb17c0..c332298b 100644 --- a/docs/src/styles/global.css +++ b/docs/src/styles/global.css @@ -183,7 +183,8 @@ } .content-panel:first-of-type { - padding-top: var(--sl-content-pad-x) !important; + /* padding-top: var(--sl-content-pad-x) !important; */ + padding-top: 1.5rem !important; } .content-panel { @@ -205,6 +206,10 @@ color: var(--openai-title-color) !important; } + .social-icons::after { + border: none !important; + } + .main-pane { background-color: var(--openai-background); border-top-left-radius: 8px; @@ -292,7 +297,8 @@ } .right-sidebar-panel { - padding-top: var(--sl-content-pad-x) !important; + /* padding-top: var(--sl-content-pad-x) !important; */ + padding-top: 2.5rem !important; } starlight-toc { @@ -326,6 +332,11 @@ .sidebar { --sl-color-hairline-shade: rgba(0, 0, 0, 0) !important; + + .sidebar-content { + padding-top: 2rem; + } + a[aria-current='page'] { color: var(--openai-primary) !important; font-weight: 500 !important; @@ -357,8 +368,11 @@ } ul.top-level > li > details > summary { + justify-content: flex-start !important; + svg { color: var(--openai-nav-category-text) !important; + align-self: flex-end; } span { @@ -414,7 +428,11 @@ .sl-markdown-content { .expressive-code .ec-line { - line-height: 1.2rem; + line-height: 0.5rem; + + &:has(.code *:is(span)) { + line-height: 1.2rem; + } } } @@ -442,7 +460,6 @@ .openai-hero-code { margin-bottom: var(--hero-padding); margin-inline-start: calc(var(--hero-padding) - 1rem); - margin-inline-end: var(--hero-padding); @media (min-width: 72rem) { margin-bottom: 0rem; @@ -456,7 +473,8 @@ font-size: var(--sl-text-xs); border-radius: 0; &[aria-selected='true'] { - color: var(--openai-primary); + color: var(--openai-text-primary); + /* color: var(--openai-primary); */ font-weight: 500; border-bottom: 0; } @@ -476,6 +494,7 @@ min-width: 15rem; @media (min-width: 72rem) { + padding-inline-end: 0; max-width: 20rem; } color: var(--openai-title-color) !important; diff --git a/examples/docs/toppage/textAgent.ts b/examples/docs/toppage/textAgent.ts index 673b8522..8520142a 100644 --- a/examples/docs/toppage/textAgent.ts +++ b/examples/docs/toppage/textAgent.ts @@ -9,4 +9,5 @@ const result = await run( agent, 'Write a haiku about recursion in programming.', ); + console.log(result.finalOutput); From 572f36cfd7917a930a561067ed51bff2f768014d Mon Sep 17 00:00:00 2001 From: Dominik Kundel Date: Mon, 9 Jun 2025 16:05:10 -0700 Subject: [PATCH 7/7] docs: add github and npm link --- docs/astro.config.mjs | 2 + docs/src/components/MobileFooter.astro | 80 ++++++++++++++++++++++++++ docs/src/components/Sidebar.astro | 26 +++++++++ docs/src/styles/global.css | 20 +++++++ 4 files changed, 128 insertions(+) create mode 100644 docs/src/components/MobileFooter.astro create mode 100644 docs/src/components/Sidebar.astro diff --git a/docs/astro.config.mjs b/docs/astro.config.mjs index e849bdce..38715268 100644 --- a/docs/astro.config.mjs +++ b/docs/astro.config.mjs @@ -319,6 +319,8 @@ export default defineConfig({ SiteTitle: './src/components/Title.astro', PageTitle: './src/components/PageTitle.astro', SocialIcons: './src/components/SocialIcons.astro', + Sidebar: './src/components/Sidebar.astro', + MobileMenuFooter: './src/components/MobileFooter.astro', }, // defaultLocale: 'root', locales: { diff --git a/docs/src/components/MobileFooter.astro b/docs/src/components/MobileFooter.astro new file mode 100644 index 00000000..c5ce5f0e --- /dev/null +++ b/docs/src/components/MobileFooter.astro @@ -0,0 +1,80 @@ +--- +import { Icon } from '@astrojs/starlight/components'; +import LanguageSelect from '@astrojs/starlight/components/LanguageSelect.astro'; +import SocialIcons from '@astrojs/starlight/components/SocialIcons.astro'; +import ThemeSelect from '@astrojs/starlight/components/ThemeSelect.astro'; +import { ParseStatus } from 'astro:schema'; + +const additionalLinks = [ + { + label: 'View on GitHub', + href: 'https://github.com/openai/openai-agents-js', + icon: 'github' as const, + }, + { + label: 'View on npm', + href: 'https://www.npmjs.com/package/@openai/agents', + icon: 'npm' as const, + }, +]; +--- + +
+ + + +
+ + diff --git a/docs/src/components/Sidebar.astro b/docs/src/components/Sidebar.astro new file mode 100644 index 00000000..45b6b501 --- /dev/null +++ b/docs/src/components/Sidebar.astro @@ -0,0 +1,26 @@ +--- +import { Icon } from '@astrojs/starlight/components'; +import Default from '@astrojs/starlight/components/Sidebar.astro'; +// const { sidebar } = Astro.locals.starlightRoute; +--- + + + + diff --git a/docs/src/styles/global.css b/docs/src/styles/global.css index c332298b..082663f9 100644 --- a/docs/src/styles/global.css +++ b/docs/src/styles/global.css @@ -536,6 +536,26 @@ } } + .openai-github-link { + margin-top: 1rem; + --sl-sidebar-item-padding-inline: 0.5rem; + + a { + display: flex; + align-items: center; + color: var(--openai-text-primary); + text-decoration: none; + margin-inline-start: var(--sl-sidebar-item-padding-inline); + margin-bottom: var(--sl-sidebar-item-padding-inline); + font-size: var(--sl-text-lg); + + span { + font-size: var(--sl-text-sm); + margin-inline-start: var(--sl-sidebar-item-padding-inline); + } + } + } + .sl-markdown-content .expressive-code { .frame.has-title:not(.is-terminal) .header { background: none;