Skip to content

Commit 5b3c012

Browse files
NoelDeMartinNoelDeMartin
authored
Merge pull request #799 from NoelDeMartin/790-restructure-components
#790 Refactor components organization
2 parents 7145a58 + 8a2b643 commit 5b3c012

116 files changed

Lines changed: 363 additions & 354 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.storybook/preview.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import '../src/styles.css'
1+
import '@/styles/theme.css'
22

33
export const tags = ['autodocs']
44
export const parameters = {}

‎README.md‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ And don't forget to also include the CSS, either with a link tag or inside a CSS
5858
```
5959

6060
```html
61-
<link rel="stylesheet" href="https://unpkg.com/solid-ui@^4.0.0/dist/styles.css">
61+
<link rel="stylesheet" href="https://unpkg.com/solid-ui@^4.0.0/dist/theme.css">
6262
```
6363

6464
You can also use some of the helpers exported from the default entry:
@@ -76,7 +76,7 @@ Solid-UI provides **ESM** bundles for direct browser usage. You'll also need to
7676
```html
7777
<html>
7878
<head>
79-
<link rel="stylesheet" href="https://unpkg.com/solid-ui@^4.0.0/dist/styles.css">
79+
<link rel="stylesheet" href="https://unpkg.com/solid-ui@^4.0.0/dist/theme.css">
8080
</head>
8181
<body>
8282
<div id="app"></div>
@@ -98,7 +98,7 @@ You can also use [import maps](https://developer.mozilla.org/en-US/docs/Web/HTML
9898
```html
9999
<html>
100100
<head>
101-
<link rel="stylesheet" href="https://unpkg.com/solid-ui@^4.0.0/dist/styles.css">
101+
<link rel="stylesheet" href="https://unpkg.com/solid-ui@^4.0.0/dist/theme.css">
102102
</head>
103103
<body>
104104
<div id="app"></div>
@@ -165,7 +165,7 @@ The build configuration uses [Vite](https://vite.dev/) and is centralized in the
165165
The config can be invoked with 4 different modes:
166166

167167
- Default: This is the one used to generate ESM and CJS files to be consumed through npm (generates `*.cjs.js` and `*.esm.js` files respectively). It's also used to run Vitest tests and the Storybook.
168-
- `styles`: This mode generates the `styles.css` file that includes global styles (CSS variables for the Design System Tokens).
168+
- `styles`: This mode generates the `theme.css` file that includes global styles (CSS variables for the Design System Tokens).
169169
- `cdn`: This generates the ESM bundle to be consumed through CDNs, which has no external dependencies.
170170
- `cdn-legacy`: This generates the legacy UMD bundle to be consumed by legacy CDNs that externalize `rdflib` and `solid-logic` (no longer recommended).
171171

‎examples/header/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<head>
55
<meta charset='UTF-8'>
66
<title>solid-ui UI.widgets.header examples page</title>
7-
<link rel="stylesheet" href="../../dist/styles.css">
7+
<link rel="stylesheet" href="../../dist/theme.css">
88
<script src="https://unpkg.com/rdflib/dist/rdflib.min.js"></script>
99
<script src="https://unpkg.com/solid-logic/dist/solid-logic.min.js"></script>
1010
<script src="../../dist/solid-ui.js"></script>

‎examples/matrix/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<head>
44
<meta charset='UTF-8'>
55
<title>Test matrix.js</title>
6-
<link rel="stylesheet" href="../../dist/styles.css">
6+
<link rel="stylesheet" href="../../dist/theme.css">
77
<!-- <link type="text/css" rel="stylesheet"
88
href="https://linkeddata.github.io/tabulator-firefox/content/tabbedtab.css" /> -->
99
<style>

‎package-lock.json‎

Lines changed: 25 additions & 4 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
"types": "dist/index.d.ts",
77
"exports": {
88
".": {
9-
"style": "./dist/styles.css",
9+
"style": "./dist/theme.css",
1010
"types": "./dist/index.d.ts",
1111
"import": "./dist/index.esm.js",
1212
"require": "./dist/index.cjs.js"
@@ -109,7 +109,7 @@
109109
"rdflib": "2.3.9",
110110
"solid-logic": "4.0.8-0",
111111
"solid-namespace": "^0.5.4",
112-
"tailwindcss": "^4.3.0",
112+
"tailwindcss": "4.3.0",
113113
"uuid": "^14.0.0"
114114
},
115115
"devDependencies": {

src/design-system/components/account/Account.stories.ts renamed to src/components/account/Account.stories.ts

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,10 @@
11
import { html } from 'lit'
2+
import { USER_OPTIONS, defineAuthStoryRender } from '@/storybook'
23

34
import './Account'
4-
import { USER_OPTIONS } from '../../../storybook/stubs'
5-
import { defineAuthStoryRender } from '../../../storybook'
65

76
const meta = {
8-
title: 'Design System/Account',
7+
title: 'Account',
98
args: {
109
user: 'Alice',
1110
},

src/design-system/components/account/Account.styles.css renamed to src/components/account/Account.styles.css

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
@import '../../styles/common.styles.css';
2-
31
:host {
42
display: inline-flex;
53
flex-direction: row;
@@ -21,7 +19,7 @@
2119
border-radius: calc((var(--image-size) + 2 * var(--padding) + 2 * var(--border-width)) / 2);
2220
color: var(--solid-ui-color-white);
2321

24-
solid-avatar {
22+
solid-ui-avatar {
2523
width: var(--image-size);
2624
height: var(--image-size);
2725
border: var(--border-width) solid var(--solid-ui-color-white);

src/design-system/components/account/Account.ts renamed to src/components/account/Account.ts

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,21 @@
11
import { consume } from '@lit/context'
22
import { html } from 'lit'
3-
import { customElement } from '../../../primitives/lib/customElement'
4-
import WebComponent from '../../../primitives/lib/WebComponent'
5-
import { authContext, AuthContext, DEFAULT_AUTH_CONTEXT } from '../../../primitives/lib/auth/context'
3+
import { customElement, WebComponent } from '@/lib/components'
4+
import { authContext, AuthContext, DEFAULT_AUTH_CONTEXT } from '@/lib/auth'
65

7-
import '../../../design-system/components/button'
8-
import '../../../primitives/components/avatar'
9-
import '../../../primitives/components/login-button'
10-
import '../../../primitives/components/signup-button'
11-
import '../../../primitives/components/logout-button'
12-
import '../menu'
13-
import '../menu-items'
14-
import '../menu-item'
15-
import '~icons/lucide/user'
16-
import '~icons/lucide/log-in'
6+
import '@/components/avatar'
7+
import '@/components/button'
8+
import '@/components/login-button'
9+
import '@/components/logout-button'
10+
import '@/components/menu-item'
11+
import '@/components/menu-items'
12+
import '@/components/menu'
13+
import '@/components/signup-button'
1714
import '~icons/lucide/chevron-down'
15+
import '~icons/lucide/log-in'
1816
import '~icons/lucide/log-out'
17+
import '~icons/lucide/user'
18+
1919
import styles from './Account.styles.css'
2020

2121
@customElement('solid-ui-account')
@@ -45,35 +45,35 @@ export default class Account extends WebComponent {
4545
protected render () {
4646
if (!this.auth.account) {
4747
return html`
48-
<solid-login-button>
48+
<solid-ui-login-button>
4949
<solid-ui-button slot="trigger">
5050
<icon-lucide-user slot="left-icon"></icon-lucide-user>
5151
Log In
5252
</solid-ui-button>
53-
</solid-login-button>
54-
<solid-signup-button>
53+
</solid-ui-login-button>
54+
<solid-ui-signup-button>
5555
<solid-ui-button slot="trigger" variant="outline">
5656
<icon-lucide-log-in slot="left-icon"></icon-lucide-log-in>
5757
Sign Up
5858
</solid-ui-button>
59-
</solid-signup-button>
59+
</solid-ui-signup-button>
6060
`
6161
}
6262

6363
return html`
6464
<solid-ui-menu>
6565
<button type="button" slot="trigger">
66-
<solid-avatar></solid-avatar>
66+
<solid-ui-avatar></solid-ui-avatar>
6767
<icon-lucide-chevron-down slot="right-icon"></icon-lucide-chevron-down>
6868
</button>
6969
7070
<solid-ui-menu-items>
71-
<solid-logout-button>
71+
<solid-ui-logout-button>
7272
<solid-ui-menu-item slot="trigger">
7373
<icon-lucide-log-out slot="left-icon"></icon-lucide-log-out>
7474
Sign out
7575
</solid-ui-menu-item>
76-
</solid-logout-button>
76+
</solid-ui-logout-button>
7777
</solid-ui-menu-items>
7878
</solid-ui-menu>
7979
`

src/design-system/components/account/index.ts renamed to src/components/account/index.ts

File renamed without changes.

0 commit comments

Comments
 (0)