Merge pull request #27 from once-ui-system/1.5

Once UI 1.5 release

Author: lorant-one

.github/FUNDING.yml

@@ -0,0 +1 @@
+github: [once-ui-system, lorant-one]

.github/ISSUE_TEMPLATE/bug_report.md

@@ -0,0 +1,45 @@
+---
+name: Bug report
+about: Create a report to help us improve Once UI
+title: '[BUG] '
+labels: 'bug'
+assignees: ''
+---
+
+## Describe the bug
+A clear and concise description of what the bug is.
+
+## To reproduce
+Steps to reproduce the behavior:
+1. Go to '...'
+2. Click on '...'
+3. Scroll down to '...'
+4. See error
+
+## Expected behavior
+A clear and concise description of what you expected to happen.
+
+## Screenshots
+If applicable, add screenshots to help explain your problem.
+
+## Environment
+Please complete the following information:
+- **OS**: [e.g. macOS, Windows, Linux]
+- **Browser**: [e.g. Chrome 120, Safari 17, Firefox 121]
+- **Once UI Version**: [e.g. 1.5.0]
+- **Next.js Version**: [e.g. 14.0.0]
+- **Node.js Version**: [e.g. 18.17.0]
+
+## Code Sample
+```tsx
+// Please provide a minimal code example that reproduces the issue
+```
+
+## Additional context
+Add any other context about the problem here. For example:
+- Does this happen consistently or intermittently?
+- Did this work in a previous version?
+- Are there any console errors or warnings?
+
+## Possible solution
+If you have an idea of what might be causing the issue or how to fix it, please share it here.

.github/ISSUE_TEMPLATE/config.yml

@@ -0,0 +1,11 @@
+blank_issues_enabled: false
+contact_links:
+  - name: 📚 Documentation
+    url: https://docs.once-ui.com
+    about: Check out our documentation for guides and API references
+  - name: 💬 Discord Community
+    url: https://discord.com/invite/5EyAQ4eNdS
+    about: Join our Discord for help, support and discussion with the community
+  - name: 🔍 Discussions
+    url: https://github.com/once-ui-system/core/discussions
+    about: Ask questions and discuss ideas with the community

.github/ISSUE_TEMPLATE/feature_request.md

@@ -0,0 +1,37 @@
+---
+name: Feature request
+about: Suggest an idea for Once UI
+title: '[FEATURE] '
+labels: 'feature request'
+assignees: ''
+---
+
+## Is your feature request related to a problem? Please describe.
+A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]
+
+## Describe the solution you'd like
+A clear and concise description of what you want to happen.
+
+## Describe alternatives you've considered
+A clear and concise description of any alternative solutions or features you've considered.
+
+## Use Case
+Describe the use case for this feature. How would it benefit Once UI users?
+
+## Example API (if applicable)
+```tsx
+// Show how you envision the feature being used
+<Component
+  newProp="value"
+>
+  Content
+</Component>
+```
+
+## Additional context
+Add any other context, screenshots, or examples about the feature request here.
+
+## Would you be willing to contribute?
+- [ ] Yes, I'd like to work on this feature
+- [ ] No, but I can help test it
+- [ ] No, just suggesting the idea

.github/ISSUE_TEMPLATE/question.md

@@ -0,0 +1,31 @@
+---
+name: Question or Help
+about: Ask a question about using Once UI
+title: '[QUESTION] '
+labels: 'question'
+assignees: ''
+---
+
+## Your Question
+A clear and concise description of what you're trying to achieve or understand.
+
+## What I've tried
+Describe what you've already attempted:
+- [ ] Checked the [documentation](https://docs.once-ui.com)
+- [ ] Searched existing issues
+- [ ] Asked in Discord
+
+## Code Example
+```tsx
+// Share relevant code if applicable
+```
+
+## Expected outcome
+What are you trying to accomplish?
+
+## Additional context
+Add any other context, screenshots, or links that might help us understand your question.
+
+---
+
+💡 **Tip**: For faster responses, consider asking in our [Discord community](https://discord.com/invite/5EyAQ4eNdS) where community members can help!

.npmrc

@@ -1,11 +1,5 @@
-# Use symlinks instead of junctions on Windows
-symlink=true
-
 # Disable strict peer dependencies
 strict-peer-dependencies=false
 
-# Hoist all dependencies to the root node_modules
-shamefully-hoist=false
-
-# Use node-linker=hoisted to avoid Windows symlink issues
-node-linker=hoisted
+# Use shamefully-hoist for better Windows compatibility
+shamefully-hoist=true

CONTRIBUTING.md

@@ -51,7 +51,7 @@ Before submitting a PR:
 
 ### Best practices
 
-- Follow our [component conventions](https://docs.once-ui.com/once-ui/components) and file structure.
+- Follow our [component conventions](https://docs.once-ui.com/once-ui/basics/components) and file structure.
 - Use the naming system and design tokens already defined in the project.
 
 ## Join the community

packages/core/LICENSE renamed to LICENSE.md

@@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+SOFTWARE.

README.md

@@ -1,65 +1,54 @@
-## Once UI monorepo
+<br/>
 
-This monorepo hosts the official Once UI package and its internal development sandbox. It is designed for testing, development, and contribution—not for production deployment.
+<div align="center">
+  <picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://docs.once-ui.com/trademark/icon-dark.svg" width="64" height="64">
+    <source media="(prefers-color-scheme: light)" srcset="https://docs.once-ui.com/trademark/icon-light.svg" width="64" height="64">
+    <img alt="Once UI Logo" src="https://docs.once-ui.com/trademark/icon-dark.svg" width="64" height="64">
+  </picture><picture>
+    <source media="(prefers-color-scheme: dark)" srcset="https://docs.once-ui.com/trademark/type-dark.svg" width="200" height="64">
+    <source media="(prefers-color-scheme: light)" srcset="https://docs.once-ui.com/trademark/type-light.svg" width="200" height="64">
+    <img alt="Once UI Wordmark" src="https://docs.once-ui.com/trademark/type-dark.svg" width="200" height="64">
+  </picture>
 
-## Developer notice
+  <br/>
 
-It includes:
+  The indie design system for Next.js apps
 
-- `packages/core`: the published [@once-ui-system/core](https://www.npmjs.com/package/@once-ui-system/core) package
-- `apps/docs`: the official documentation of Once UI and Magic templates built with [Magic Docs](https://once-ui.com/products/magic-docs)
-- `apps/dev`: a simple sandbox app wired via symlink for testing components
+  [![npm version](https://img.shields.io/npm/v/@once-ui-system/core.svg)](https://www.npmjs.com/package/@once-ui-system/core)
+  [![License: MIT](https://img.shields.io/badge/License-MIT-blue.svg)](./LICENSE.md)
+  [![npm downloads](https://img.shields.io/npm/dm/@once-ui-system/core.svg)](https://www.npmjs.com/package/@once-ui-system/core)
+  [![Discord](https://img.shields.io/discord/1083398120035074148?color=7289da&logo=discord&logoColor=white)](https://discord.com/invite/5EyAQ4eNdS)
+</div>
 
-This setup is intended for contributors and maintainers.
-If you're building a real project, we recommend using:
 
-1. [Once UI Starter](https://github.com/once-ui-system/nextjs-starter)
-2. or install via your package manager:
 
-```bash
-npm install @once-ui-system/core
-# or
-yarn add @once-ui-system/core
-# or
-pnpm add @once-ui-system/core
-```
-
-### For contributors
-
-Fork this repo, install dependencies, and run apps:
-
-```bash
-pnpm install
-pnpm dev
-```
-
-The components will update automatically when you make changes to the Core library. If you modify the CSS modules, you'll have to run `pnpm build` in the `packages/core` directory.
+<br/>
 
 ## Documentation
 
-Start here: [docs.once-ui.com](https://docs.once-ui.com/once-ui/quick-start).
-
-## Creators
+Learn how to set up and build with Once UI at [docs.once-ui.com](https://docs.once-ui.com/once-ui/quick-start).
 
-**Lorant One**: [Portfolio](https://lorant.one) / [Threads](https://www.threads.net/@lorant.one) / [LinkedIn](https://www.linkedin.com/in/lorant-one/)
+## Installation
 
-**Collaborators**: [Once UI Frontiers](https://once-ui.com/about)
+```bash
+npm install @once-ui-system/core
+```
 
-## Join the movement
+## Authors
 
-![Design Engineers Club](https://docs.once-ui.com/images/docs/vibe-coding-dark.jpg)
+Built and maintained by [**Lorant One**](https://lorant.one).
 
-Join the [Design Engineers Club](https://discord.com/invite/5EyAQ4eNdS) on Discord. Build with intention. Share with integrity.
+## Community
 
-## Feedback & Bugs
+Join the [Design Engineers Club](https://discord.com/invite/5EyAQ4eNdS) for help, support and discussion.
 
-Found a bug? [Report it](https://github.com/once-ui-system/core/issues/new?labels=bug&template=bug_report.md)
-Got an idea? [Submit a request](https://github.com/once-ui-system/core/issues/new?labels=feature%20request&template=feature_request.md)
+Found a bug? Report it [here](https://github.com/once-ui-system/core/issues/new?labels=bug&template=bug_report.md). Got a feature request? Submit it [here](https://github.com/once-ui-system/core/issues/new?labels=feature%20request&template=feature_request.md).
 
-## Support us
+## Contributing
 
-Once UI is an indie project. [Sponsor us](https://github.com/sponsors/once-ui-system) and get featured on our site!
+Please read our [CONTRIBUTING.md](./CONTRIBUTING.md) for details on our code of conduct, and the process for submitting pull requests to Once UI.
 
-## License
+## Sponsors
 
-Distributed under the MIT License. See `LICENSE.txt`.
+Once UI is an indie project. [Sponsor us](https://github.com/sponsors/once-ui-system) and get featured on our site!

apps/dev/src/app/(main)/page.tsx

@@ -52,7 +52,9 @@ import {
   MasonryGrid,
   TagInput,
   Avatar,
+  Background,
 } from "@once-ui-system/core";
+import { style } from "@/resources/once-ui.config";
 
 export default function Home() {
   const [selectedEmoji, setSelectedEmoji] = React.useState<string>("");
@@ -113,16 +115,39 @@ export default function Home() {
 
   return (
     <Column fill center padding="l" gap="l" maxWidth="m">
+      <Column fillWidth m={{direction: "row"}}>
       <Flex hide l={{hide: false}}>hide by default, show on l</Flex>
-      <Flex hide m={{hide: false}}>hide by default, show on m</Flex>
+      <Flex hide l={{hide: false}}>hide by default, show on l</Flex>
+      <Flex hide m={{hide: false, style: {background: "red"}}}>hide by default, show on m</Flex>
+      <Flex hide m={{hide: false, style: {background: "red"}}}>hide by default, show on m</Flex>
+      <Flex hide s={{hide: false}}>hide by default, show on s</Flex>
       <Flex hide s={{hide: false}}>hide by default, show on s</Flex>
       <Flex hide xs={{hide: false}}>hide by default, show on xs</Flex>
+      <Flex hide xs={{hide: false}}>hide by default, show on xs</Flex>
+      </Column>
       <Feedback icon title="Feedback" description="This is a feedback"></Feedback>
 
       <Column maxWidth="s">
         <Media src="/images/cover-01.jpg" caption="Caption" radius="xl" />
       </Column>
 
+      <DropdownWrapper
+            placement="bottom-end"
+              trigger={
+                <Row>
+                  <IconButton data-border="rounded" variant="secondary" icon="bell"/>
+                  <Row data-solid="inverse" minWidth="8" minHeight="8" radius="full" solid="brand-strong" position="absolute" top="2" right="2"/>
+                </Row>
+              }
+              dropdown={
+                <Column width={20} background="surface" radius="l" gap="2" padding="4" border="neutral-alpha-weak">
+                  <Option value="1">Option 1</Option>
+                  <Option value="2">Option 2</Option>
+                  <Option value="3">Option 3</Option>
+                </Column>
+              }
+            />
+
 
       <CodeBlock
       fullscreenButton