diff --git a/apps/docs/src/components/Header/AstroLogo.astro b/apps/docs/src/components/Header/AstroLogo.astro deleted file mode 100644 index a533bd3..0000000 --- a/apps/docs/src/components/Header/AstroLogo.astro +++ /dev/null @@ -1,40 +0,0 @@ ---- -type Props = { - size: number; -}; -const { size } = Astro.props as Props; ---- - - - - - - - - diff --git a/apps/docs/src/components/Header/Header.astro b/apps/docs/src/components/Header/Header.astro index 58c4ef1..94f2dae 100644 --- a/apps/docs/src/components/Header/Header.astro +++ b/apps/docs/src/components/Header/Header.astro @@ -1,11 +1,12 @@ --- import { getLanguageFromURL, KNOWN_LANGUAGE_CODES } from "../../languages"; +import ThemeToggleButton from "./ThemeToggleButton"; import * as CONFIG from "../../config"; // import AstroLogo from "./AstroLogo.astro"; import SkipToContent from "./SkipToContent.astro"; import SidebarToggle from "./SidebarToggle"; import LanguageSelect from "./LanguageSelect"; -import Search from "./Search"; +// import Search from "./Search"; type Props = { currentPage: string; @@ -23,7 +24,6 @@ const lang = getLanguageFromURL(currentPage); @@ -34,9 +34,11 @@ const lang = getLanguageFromURL(currentPage); ) } -
+ + + @@ -100,7 +102,7 @@ const lang = getLanguageFromURL(currentPage); gap: 1em; width: 100%; max-width: 82em; - padding: 0 1rem; + padding: 0 2rem; } @media (min-width: 50em) { diff --git a/apps/docs/src/components/RightSidebar/ThemeToggleButton.css b/apps/docs/src/components/Header/ThemeToggleButton.css similarity index 100% rename from apps/docs/src/components/RightSidebar/ThemeToggleButton.css rename to apps/docs/src/components/Header/ThemeToggleButton.css diff --git a/apps/docs/src/components/RightSidebar/ThemeToggleButton.tsx b/apps/docs/src/components/Header/ThemeToggleButton.tsx similarity index 100% rename from apps/docs/src/components/RightSidebar/ThemeToggleButton.tsx rename to apps/docs/src/components/Header/ThemeToggleButton.tsx diff --git a/apps/docs/src/components/LeftSidebar/LeftSidebar.astro b/apps/docs/src/components/LeftSidebar/LeftSidebar.astro index 33af794..7a70be7 100644 --- a/apps/docs/src/components/LeftSidebar/LeftSidebar.astro +++ b/apps/docs/src/components/LeftSidebar/LeftSidebar.astro @@ -1,117 +1,124 @@ --- -import { getLanguageFromURL } from '../../languages'; -import { SIDEBAR } from '../../config'; +import { getLanguageFromURL } from "../../languages"; +import { SIDEBAR } from "../../config"; type Props = { - currentPage: string; + currentPage: string; }; const { currentPage } = Astro.props as Props; -const currentPageMatch = currentPage.endsWith('/') - ? currentPage.slice(1, -1) - : currentPage.slice(1); +const currentPageMatch = currentPage.endsWith("/") + ? currentPage.slice(1, -1) + : currentPage.slice(1); const langCode = getLanguageFromURL(currentPage); const sidebar = SIDEBAR[langCode]; --- diff --git a/apps/docs/src/components/PageContent/PageContent.astro b/apps/docs/src/components/PageContent/PageContent.astro index c7c66c7..0836ac4 100644 --- a/apps/docs/src/components/PageContent/PageContent.astro +++ b/apps/docs/src/components/PageContent/PageContent.astro @@ -1,13 +1,13 @@ --- -import type { Frontmatter } from '../../config'; -import MoreMenu from '../RightSidebar/MoreMenu.astro'; -import TableOfContents from '../RightSidebar/TableOfContents'; -import type { MarkdownHeading } from 'astro'; +import type { Frontmatter } from "../../config"; +import MoreMenu from "../RightSidebar/MoreMenu.astro"; +import TableOfContents from "../RightSidebar/TableOfContents"; +import type { MarkdownHeading } from "astro"; type Props = { - frontmatter: Frontmatter; - headings: MarkdownHeading[]; - githubEditUrl: string; + frontmatter: Frontmatter; + headings: MarkdownHeading[]; + githubEditUrl: string; }; const { frontmatter, headings, githubEditUrl } = Astro.props as Props; @@ -15,39 +15,46 @@ const title = frontmatter.title; ---
-
-

{title}

- - -
- +
+

{title}

+
+ 🛠 Under Construction: This library and the documentation are + undergoing rigorous development. Read and join our discussions for questions, suggestions, or feedback. +
+ + +
+
diff --git a/apps/docs/src/components/RightSidebar/MoreMenu.astro b/apps/docs/src/components/RightSidebar/MoreMenu.astro index 8fcbfa5..57483c5 100644 --- a/apps/docs/src/components/RightSidebar/MoreMenu.astro +++ b/apps/docs/src/components/RightSidebar/MoreMenu.astro @@ -1,9 +1,8 @@ --- -import ThemeToggleButton from './ThemeToggleButton'; -import * as CONFIG from '../../config'; +import * as CONFIG from "../../config"; type Props = { - editHref: string; + editHref: string; }; const { editHref } = Astro.props as Props; @@ -12,64 +11,65 @@ const showMoreSection = CONFIG.COMMUNITY_INVITE_URL; {showMoreSection &&

More

} -
- -
diff --git a/apps/docs/src/config.ts b/apps/docs/src/config.ts index 25072c8..7fb5672 100644 --- a/apps/docs/src/config.ts +++ b/apps/docs/src/config.ts @@ -1,5 +1,5 @@ export const SITE = { - title: "Astro Reactive", + title: "Astro Reactive Docs", description: "Let your data build your UI with native Astro components and architecture.", defaultLanguage: "en_US", @@ -7,12 +7,10 @@ export const SITE = { export const OPEN_GRAPH = { image: { - src: "https://github.com/withastro/astro/blob/main/assets/social/banner.jpg?raw=true", - alt: - "astro logo on a starry expanse of space," + - " with a purple saturn-like planet floating in the right foreground", + src: "https://github.com/ayoayco/astro-reactive-library/blob/main/.github/assets/astro-reactive-library-cover.png?raw=true", + alt: "astro logo and astro reactive library text on a starry expanse of space", }, - twitter: "astrodotbuild", + twitter: "astroreactive", }; // This is the type of the frontmatter you put in the docs markdown files. diff --git a/apps/docs/src/layouts/MainLayout.astro b/apps/docs/src/layouts/MainLayout.astro index 6ab53b5..614875f 100644 --- a/apps/docs/src/layouts/MainLayout.astro +++ b/apps/docs/src/layouts/MainLayout.astro @@ -142,14 +142,6 @@ const githubEditUrl = `${CONFIG.GITHUB_EDIT_URL}/${currentFile}`;
-
- 🛠 Under Construction: This library and the documentation - are undergoing rigorous development. Read and join our Discussions for questions, suggestions, or feedback. -
- ``` ------ +## Installation + +``` +npm i @astro-reactive/form +``` + ## Usage diff --git a/apps/docs/src/pages/en/api/form/form-group.md b/apps/docs/src/pages/en/api/form/form-group.md index a31a2dd..ffe8e8e 100644 --- a/apps/docs/src/pages/en/api/form/form-group.md +++ b/apps/docs/src/pages/en/api/form/form-group.md @@ -6,10 +6,10 @@ description: The FormGroup class represents a group of controls that will be ren layout: ../../../../layouts/MainLayout.astro --- -> **❗ Note:** This documentation is incomplete. - The `FormGroup` class represents a group of controls that will be rendered as a fieldset element in a form. +> **❗ Note:** This documentation is incomplete. + ## Properties | Property | Type | | diff --git a/apps/docs/src/pages/en/introduction.md b/apps/docs/src/pages/en/introduction.md index 13ba7f1..81cc804 100644 --- a/apps/docs/src/pages/en/introduction.md +++ b/apps/docs/src/pages/en/introduction.md @@ -1,45 +1,23 @@ --- -title: Hi, explorer! 🚀 +title: Hi, explorer! description: Astro Reactive Library Docs layout: ../../layouts/MainLayout.astro --- -![Astro Reactive Library](https://user-images.githubusercontent.com/4262489/193419437-6e437743-47bf-482b-8f7e-de3c7f5285f8.png) - Thanks for checking out the Astro Reactive Library! Welcome to a new adventure. This project aims to be a new library of components and utilities for building reactive user interfaces with [Astro](https://astro.build). -We will update this documentation site later with a fun and easy tutorial so you can start building reactive UIs with Astro from scratch using our packages. +We will update this documentation with a fun and easy tutorial so you can start building reactive UIs with Astro from scratch using our packages. > **📝 Note:** See our [API Docs](/en/api) for example usage. -## Installation - -``` -npm i @astro-reactive/form @astro-reactive/validator -``` - ## Packages | Package | Release notes | Description | | --- | --- | --- | -| [form](https://github.com/ayoayco/astro-reactive-library/blob/main/packages/form/README.md) | [![npm](https://img.shields.io/npm/v/@astro-reactive/form)](./packages/form/RELEASE.md) | a dynamic form which can be modified programmatically | +| [form](/en/api/form/form-component) | [![npm](https://img.shields.io/npm/v/@astro-reactive/form)](./packages/form/RELEASE.md) | a dynamic form which can be modified programmatically | | [validator](https://github.com/ayoayco/astro-reactive-library/blob/main/packages/validator/README.md) | [![npm](https://img.shields.io/npm/v/@astro-reactive/validator)](./packages/validator/RELEASE.md) | validators for editable fields | | data-grid | 🛠 | a dynamic data grid of values | | themes | 🛠 | easy-to-use, accessible, consistent cross-browser styles | | viz | 🛠 | data visualization that emits and responds to events | - -## Contributing - -Any contribution is welcome. Feel free to look around our [repository](https://github.com/ayoayco/astro-reactive-library) to find something that interests you. :) - -There's a lot of opportunity to contribute. A good start will be to understand what Astro is, and how to set up a basic Astro project. For this, the [Astro website](https://astro.build) and [documentation](https://docs.astro.build/en/getting-started/) are good places to start. - -The [issues page](https://github.com/ayoayco/astro-reactive-library/issues?q=is%3Aopen+is%3Aissue+label%3A%22accepting+PRs%22) contains some ideas, but they should not limit your contribution. - -If you don't find anything there, I'm happy to help you get your contribution in. - -You can always [create a new issue](https://github.com/ayoayco/astro-reactive-library/issues/new/choose) for your own idea, [email me (ayo@ayco.io)](mailto:ayo@ayco.io) or message me on [Twitter (@ayoayco)](https://twitter.com/ayoayco). - - diff --git a/apps/landing-page/package.json b/apps/landing-page/package.json index 8d270ae..8adb4ec 100644 --- a/apps/landing-page/package.json +++ b/apps/landing-page/package.json @@ -16,7 +16,6 @@ "@astrojs/tailwind": "^2.0.2", "@types/micromodal": "^0.3.3", "astro": "^1.4.7", - "astro-eleventy-img": "^0.5.0", "astro-icon": "^0.8.0", "prettier": "2.7.1", "prettier-plugin-astro": "^0.7.0", diff --git a/apps/landing-page/src/components/copynpm.astro b/apps/landing-page/src/components/copynpm.astro index f1e776e..a50c444 100644 --- a/apps/landing-page/src/components/copynpm.astro +++ b/apps/landing-page/src/components/copynpm.astro @@ -3,10 +3,12 @@ import { Icon } from "astro-icon"; --- @@ -36,10 +38,10 @@ import { Icon } from "astro-icon"; \ No newline at end of file + const copyCommandButton = document.getElementById("copy-command-button"); + const commandText = document.getElementById("command").innerText; + + copyCommandButton.addEventListener("click", () => { + navigator.clipboard.writeText(commandText); + }); + diff --git a/apps/landing-page/src/components/header.astro b/apps/landing-page/src/components/header.astro index a3ca798..9b20abc 100644 --- a/apps/landing-page/src/components/header.astro +++ b/apps/landing-page/src/components/header.astro @@ -8,11 +8,11 @@ const socials = [ url: "https://github.com/ayoayco/astro-reactive-library", icon: "fa-brands:github-alt", }, - { - name: "Twitter", - url: "https://twitter.com/astroreactive", - icon: "fa-brands:twitter", - }, + // { + // name: "Twitter", + // url: "https://twitter.com/astroreactive", + // icon: "fa-brands:twitter", + // }, ]; --- @@ -39,7 +39,7 @@ const socials = [ )) } - - +