kiso 0.1.0.pre
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +7 -0
- data/CHANGELOG.md +27 -0
- data/MIT-LICENSE +20 -0
- data/README.md +117 -0
- data/Rakefile +5 -0
- data/app/assets/fonts/kiso/GeistMonoVF.woff2 +0 -0
- data/app/assets/fonts/kiso/GeistVF.woff2 +0 -0
- data/app/assets/fonts/kiso/OFL.txt +93 -0
- data/app/assets/tailwind/kiso/engine.css +32 -0
- data/app/helpers/kiso/component_helper.rb +47 -0
- data/app/helpers/kiso/icon_helper.rb +48 -0
- data/app/views/kiso/components/_alert.html.erb +8 -0
- data/app/views/kiso/components/_badge.html.erb +7 -0
- data/app/views/kiso/components/_button.html.erb +19 -0
- data/app/views/kiso/components/_card.html.erb +7 -0
- data/app/views/kiso/components/_empty_state.html.erb +7 -0
- data/app/views/kiso/components/_separator.html.erb +7 -0
- data/app/views/kiso/components/_stats_card.html.erb +7 -0
- data/app/views/kiso/components/_stats_grid.html.erb +7 -0
- data/app/views/kiso/components/_table.html.erb +8 -0
- data/app/views/kiso/components/alert/_description.html.erb +7 -0
- data/app/views/kiso/components/alert/_title.html.erb +7 -0
- data/app/views/kiso/components/card/_content.html.erb +7 -0
- data/app/views/kiso/components/card/_description.html.erb +7 -0
- data/app/views/kiso/components/card/_footer.html.erb +7 -0
- data/app/views/kiso/components/card/_header.html.erb +7 -0
- data/app/views/kiso/components/card/_title.html.erb +7 -0
- data/app/views/kiso/components/empty_state/_content.html.erb +7 -0
- data/app/views/kiso/components/empty_state/_description.html.erb +7 -0
- data/app/views/kiso/components/empty_state/_header.html.erb +7 -0
- data/app/views/kiso/components/empty_state/_media.html.erb +7 -0
- data/app/views/kiso/components/empty_state/_title.html.erb +7 -0
- data/app/views/kiso/components/stats_card/_description.html.erb +7 -0
- data/app/views/kiso/components/stats_card/_header.html.erb +7 -0
- data/app/views/kiso/components/stats_card/_label.html.erb +7 -0
- data/app/views/kiso/components/stats_card/_value.html.erb +7 -0
- data/app/views/kiso/components/table/_body.html.erb +7 -0
- data/app/views/kiso/components/table/_caption.html.erb +7 -0
- data/app/views/kiso/components/table/_cell.html.erb +7 -0
- data/app/views/kiso/components/table/_footer.html.erb +7 -0
- data/app/views/kiso/components/table/_head.html.erb +7 -0
- data/app/views/kiso/components/table/_header.html.erb +7 -0
- data/app/views/kiso/components/table/_row.html.erb +7 -0
- data/lib/kiso/cli/base.rb +37 -0
- data/lib/kiso/cli/icons.rb +6 -0
- data/lib/kiso/cli/main.rb +14 -0
- data/lib/kiso/cli/make.rb +369 -0
- data/lib/kiso/cli.rb +14 -0
- data/lib/kiso/engine.rb +26 -0
- data/lib/kiso/themes/alert.rb +65 -0
- data/lib/kiso/themes/badge.rb +66 -0
- data/lib/kiso/themes/button.rb +90 -0
- data/lib/kiso/themes/card.rb +44 -0
- data/lib/kiso/themes/empty_state.rb +42 -0
- data/lib/kiso/themes/separator.rb +17 -0
- data/lib/kiso/themes/stats_card.rb +57 -0
- data/lib/kiso/themes/table.rb +48 -0
- data/lib/kiso/version.rb +3 -0
- data/lib/kiso.rb +17 -0
- metadata +175 -0
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
module Kiso
|
|
2
|
+
module Themes
|
|
3
|
+
Button = ClassVariants.build(
|
|
4
|
+
base: "inline-flex items-center justify-center gap-2 font-medium whitespace-nowrap shrink-0 " \
|
|
5
|
+
"transition-all " \
|
|
6
|
+
"focus-visible:outline-2 focus-visible:outline-offset-2 " \
|
|
7
|
+
"disabled:pointer-events-none disabled:opacity-50 " \
|
|
8
|
+
"aria-disabled:cursor-not-allowed aria-disabled:opacity-50 " \
|
|
9
|
+
"[&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
|
10
|
+
variants: {
|
|
11
|
+
variant: {
|
|
12
|
+
solid: "",
|
|
13
|
+
outline: "ring ring-inset",
|
|
14
|
+
soft: "",
|
|
15
|
+
subtle: "ring ring-inset",
|
|
16
|
+
ghost: "",
|
|
17
|
+
link: "underline-offset-4"
|
|
18
|
+
},
|
|
19
|
+
size: {
|
|
20
|
+
xs: "h-7 px-2 py-1 text-xs rounded-md gap-1 has-[>svg]:px-1.5 [&_svg:not([class*='size-'])]:size-3",
|
|
21
|
+
sm: "h-8 px-3 py-1.5 text-xs rounded-md gap-1.5 has-[>svg]:px-2.5",
|
|
22
|
+
md: "h-9 px-4 py-2 text-sm rounded-md gap-2 has-[>svg]:px-3",
|
|
23
|
+
lg: "h-10 px-5 py-2.5 text-sm rounded-md gap-2 has-[>svg]:px-4",
|
|
24
|
+
xl: "h-11 px-6 py-3 text-base rounded-lg gap-2.5 has-[>svg]:px-5 [&_svg:not([class*='size-'])]:size-5"
|
|
25
|
+
},
|
|
26
|
+
color: COLORS.index_with { "" },
|
|
27
|
+
block: {
|
|
28
|
+
true => "w-full",
|
|
29
|
+
false => ""
|
|
30
|
+
}
|
|
31
|
+
},
|
|
32
|
+
compound_variants: [
|
|
33
|
+
# == solid (base: bg-{color} text-{color}-foreground) ==
|
|
34
|
+
{color: :primary, variant: :solid, class: "bg-primary text-primary-foreground hover:bg-primary/90 active:bg-primary/80 focus-visible:outline-primary"},
|
|
35
|
+
{color: :secondary, variant: :solid, class: "bg-secondary text-secondary-foreground hover:bg-secondary/90 active:bg-secondary/80 focus-visible:outline-secondary"},
|
|
36
|
+
{color: :success, variant: :solid, class: "bg-success text-success-foreground hover:bg-success/90 active:bg-success/80 focus-visible:outline-success"},
|
|
37
|
+
{color: :info, variant: :solid, class: "bg-info text-info-foreground hover:bg-info/90 active:bg-info/80 focus-visible:outline-info"},
|
|
38
|
+
{color: :warning, variant: :solid, class: "bg-warning text-warning-foreground hover:bg-warning/90 active:bg-warning/80 focus-visible:outline-warning"},
|
|
39
|
+
{color: :error, variant: :solid, class: "bg-error text-error-foreground hover:bg-error/90 active:bg-error/80 focus-visible:outline-error"},
|
|
40
|
+
{color: :neutral, variant: :solid, class: "bg-inverted text-inverted-foreground hover:bg-inverted/90 active:bg-inverted/80 focus-visible:outline-inverted"},
|
|
41
|
+
|
|
42
|
+
# == outline (base: text-{color} ring-{color}/50) ==
|
|
43
|
+
{color: :primary, variant: :outline, class: "text-primary ring-primary/50 hover:bg-primary/10 active:bg-primary/15 focus-visible:ring-2 focus-visible:ring-primary"},
|
|
44
|
+
{color: :secondary, variant: :outline, class: "text-secondary ring-secondary/50 hover:bg-secondary/10 active:bg-secondary/15 focus-visible:ring-2 focus-visible:ring-secondary"},
|
|
45
|
+
{color: :success, variant: :outline, class: "text-success ring-success/50 hover:bg-success/10 active:bg-success/15 focus-visible:ring-2 focus-visible:ring-success"},
|
|
46
|
+
{color: :info, variant: :outline, class: "text-info ring-info/50 hover:bg-info/10 active:bg-info/15 focus-visible:ring-2 focus-visible:ring-info"},
|
|
47
|
+
{color: :warning, variant: :outline, class: "text-warning ring-warning/50 hover:bg-warning/10 active:bg-warning/15 focus-visible:ring-2 focus-visible:ring-warning"},
|
|
48
|
+
{color: :error, variant: :outline, class: "text-error ring-error/50 hover:bg-error/10 active:bg-error/15 focus-visible:ring-2 focus-visible:ring-error"},
|
|
49
|
+
{color: :neutral, variant: :outline, class: "text-foreground bg-background ring-accented hover:bg-elevated active:bg-elevated focus-visible:ring-2 focus-visible:ring-inverted"},
|
|
50
|
+
|
|
51
|
+
# == soft (base: bg-{color}/10 text-{color}) ==
|
|
52
|
+
{color: :primary, variant: :soft, class: "bg-primary/10 text-primary hover:bg-primary/15 active:bg-primary/20 focus-visible:outline-primary"},
|
|
53
|
+
{color: :secondary, variant: :soft, class: "bg-secondary/10 text-secondary hover:bg-secondary/15 active:bg-secondary/20 focus-visible:outline-secondary"},
|
|
54
|
+
{color: :success, variant: :soft, class: "bg-success/10 text-success hover:bg-success/15 active:bg-success/20 focus-visible:outline-success"},
|
|
55
|
+
{color: :info, variant: :soft, class: "bg-info/10 text-info hover:bg-info/15 active:bg-info/20 focus-visible:outline-info"},
|
|
56
|
+
{color: :warning, variant: :soft, class: "bg-warning/10 text-warning hover:bg-warning/15 active:bg-warning/20 focus-visible:outline-warning"},
|
|
57
|
+
{color: :error, variant: :soft, class: "bg-error/10 text-error hover:bg-error/15 active:bg-error/20 focus-visible:outline-error"},
|
|
58
|
+
{color: :neutral, variant: :soft, class: "text-foreground bg-elevated hover:bg-accented/75 active:bg-accented focus-visible:outline-inverted"},
|
|
59
|
+
|
|
60
|
+
# == subtle (base: bg-{color}/10 text-{color} ring-{color}/25) ==
|
|
61
|
+
{color: :primary, variant: :subtle, class: "bg-primary/10 text-primary ring-primary/25 hover:bg-primary/15 active:bg-primary/20 focus-visible:ring-2 focus-visible:ring-primary"},
|
|
62
|
+
{color: :secondary, variant: :subtle, class: "bg-secondary/10 text-secondary ring-secondary/25 hover:bg-secondary/15 active:bg-secondary/20 focus-visible:ring-2 focus-visible:ring-secondary"},
|
|
63
|
+
{color: :success, variant: :subtle, class: "bg-success/10 text-success ring-success/25 hover:bg-success/15 active:bg-success/20 focus-visible:ring-2 focus-visible:ring-success"},
|
|
64
|
+
{color: :info, variant: :subtle, class: "bg-info/10 text-info ring-info/25 hover:bg-info/15 active:bg-info/20 focus-visible:ring-2 focus-visible:ring-info"},
|
|
65
|
+
{color: :warning, variant: :subtle, class: "bg-warning/10 text-warning ring-warning/25 hover:bg-warning/15 active:bg-warning/20 focus-visible:ring-2 focus-visible:ring-warning"},
|
|
66
|
+
{color: :error, variant: :subtle, class: "bg-error/10 text-error ring-error/25 hover:bg-error/15 active:bg-error/20 focus-visible:ring-2 focus-visible:ring-error"},
|
|
67
|
+
{color: :neutral, variant: :subtle, class: "text-foreground bg-elevated ring-accented hover:bg-accented/75 active:bg-accented focus-visible:ring-2 focus-visible:ring-inverted"},
|
|
68
|
+
|
|
69
|
+
# == ghost (no background until hover) ==
|
|
70
|
+
{color: :primary, variant: :ghost, class: "text-primary hover:bg-primary/10 active:bg-primary/15 focus-visible:outline-primary"},
|
|
71
|
+
{color: :secondary, variant: :ghost, class: "text-secondary hover:bg-secondary/10 active:bg-secondary/15 focus-visible:outline-secondary"},
|
|
72
|
+
{color: :success, variant: :ghost, class: "text-success hover:bg-success/10 active:bg-success/15 focus-visible:outline-success"},
|
|
73
|
+
{color: :info, variant: :ghost, class: "text-info hover:bg-info/10 active:bg-info/15 focus-visible:outline-info"},
|
|
74
|
+
{color: :warning, variant: :ghost, class: "text-warning hover:bg-warning/10 active:bg-warning/15 focus-visible:outline-warning"},
|
|
75
|
+
{color: :error, variant: :ghost, class: "text-error hover:bg-error/10 active:bg-error/15 focus-visible:outline-error"},
|
|
76
|
+
{color: :neutral, variant: :ghost, class: "text-foreground hover:bg-elevated active:bg-accented/75 focus-visible:outline-inverted"},
|
|
77
|
+
|
|
78
|
+
# == link (text color + underline on hover) ==
|
|
79
|
+
{color: :primary, variant: :link, class: "text-primary hover:text-primary/75 active:text-primary/75 hover:underline focus-visible:outline-primary"},
|
|
80
|
+
{color: :secondary, variant: :link, class: "text-secondary hover:text-secondary/75 active:text-secondary/75 hover:underline focus-visible:outline-secondary"},
|
|
81
|
+
{color: :success, variant: :link, class: "text-success hover:text-success/75 active:text-success/75 hover:underline focus-visible:outline-success"},
|
|
82
|
+
{color: :info, variant: :link, class: "text-info hover:text-info/75 active:text-info/75 hover:underline focus-visible:outline-info"},
|
|
83
|
+
{color: :warning, variant: :link, class: "text-warning hover:text-warning/75 active:text-warning/75 hover:underline focus-visible:outline-warning"},
|
|
84
|
+
{color: :error, variant: :link, class: "text-error hover:text-error/75 active:text-error/75 hover:underline focus-visible:outline-error"},
|
|
85
|
+
{color: :neutral, variant: :link, class: "text-muted-foreground hover:text-foreground active:text-foreground hover:underline focus-visible:outline-inverted"}
|
|
86
|
+
],
|
|
87
|
+
defaults: {color: :primary, variant: :solid, size: :md, block: false}
|
|
88
|
+
)
|
|
89
|
+
end
|
|
90
|
+
end
|
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
module Kiso
|
|
2
|
+
module Themes
|
|
3
|
+
# shadcn base: bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm
|
|
4
|
+
# We use variant: instead of hardcoded border + shadow, and our semantic tokens.
|
|
5
|
+
Card = ClassVariants.build(
|
|
6
|
+
base: "flex flex-col gap-6 rounded-xl py-6 text-foreground",
|
|
7
|
+
variants: {
|
|
8
|
+
variant: {
|
|
9
|
+
outline: "bg-background ring ring-inset ring-border shadow-sm",
|
|
10
|
+
soft: "bg-elevated/50",
|
|
11
|
+
subtle: "bg-elevated/50 ring ring-inset ring-border"
|
|
12
|
+
}
|
|
13
|
+
},
|
|
14
|
+
defaults: {variant: :outline}
|
|
15
|
+
)
|
|
16
|
+
|
|
17
|
+
# shadcn: @container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-2 px-6
|
|
18
|
+
# has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6
|
|
19
|
+
# Simplified: we don't have CardAction yet, so flex-col instead of grid.
|
|
20
|
+
CardHeader = ClassVariants.build(
|
|
21
|
+
base: "flex flex-col gap-1.5 px-6"
|
|
22
|
+
)
|
|
23
|
+
|
|
24
|
+
# shadcn: leading-none font-semibold
|
|
25
|
+
CardTitle = ClassVariants.build(
|
|
26
|
+
base: "font-semibold leading-none"
|
|
27
|
+
)
|
|
28
|
+
|
|
29
|
+
# shadcn: text-muted-foreground text-sm
|
|
30
|
+
CardDescription = ClassVariants.build(
|
|
31
|
+
base: "text-sm text-muted-foreground"
|
|
32
|
+
)
|
|
33
|
+
|
|
34
|
+
# shadcn: px-6
|
|
35
|
+
CardContent = ClassVariants.build(
|
|
36
|
+
base: "px-6"
|
|
37
|
+
)
|
|
38
|
+
|
|
39
|
+
# shadcn: flex items-center px-6 [.border-t]:pt-6
|
|
40
|
+
CardFooter = ClassVariants.build(
|
|
41
|
+
base: "flex items-center px-6"
|
|
42
|
+
)
|
|
43
|
+
end
|
|
44
|
+
end
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
module Kiso
|
|
2
|
+
module Themes
|
|
3
|
+
# shadcn base: flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12
|
|
4
|
+
# border-dashed pre-sets the style — no visible border unless user adds `border` via css_classes.
|
|
5
|
+
EmptyState = ClassVariants.build(
|
|
6
|
+
base: "flex min-w-0 flex-1 flex-col items-center justify-center gap-6 rounded-lg border-dashed p-6 text-center text-balance md:p-12"
|
|
7
|
+
)
|
|
8
|
+
|
|
9
|
+
# shadcn: flex max-w-sm flex-col items-center gap-2 text-center
|
|
10
|
+
EmptyStateHeader = ClassVariants.build(
|
|
11
|
+
base: "flex max-w-sm flex-col items-center gap-2 text-center"
|
|
12
|
+
)
|
|
13
|
+
|
|
14
|
+
# shadcn: flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0
|
|
15
|
+
# variant: default (transparent bg) | icon (muted background + rounded container)
|
|
16
|
+
EmptyStateMedia = ClassVariants.build(
|
|
17
|
+
base: "flex shrink-0 items-center justify-center mb-2 [&_svg]:pointer-events-none [&_svg]:shrink-0",
|
|
18
|
+
variants: {
|
|
19
|
+
variant: {
|
|
20
|
+
default: "bg-transparent",
|
|
21
|
+
icon: "bg-muted text-foreground size-10 rounded-lg [&_svg:not([class*='size-'])]:size-6"
|
|
22
|
+
}
|
|
23
|
+
},
|
|
24
|
+
defaults: {variant: :default}
|
|
25
|
+
)
|
|
26
|
+
|
|
27
|
+
# shadcn: text-lg font-medium tracking-tight
|
|
28
|
+
EmptyStateTitle = ClassVariants.build(
|
|
29
|
+
base: "text-lg font-medium tracking-tight"
|
|
30
|
+
)
|
|
31
|
+
|
|
32
|
+
# shadcn: text-muted-foreground text-sm/relaxed [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4
|
|
33
|
+
EmptyStateDescription = ClassVariants.build(
|
|
34
|
+
base: "text-muted-foreground text-sm/relaxed [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4"
|
|
35
|
+
)
|
|
36
|
+
|
|
37
|
+
# shadcn: flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance
|
|
38
|
+
EmptyStateContent = ClassVariants.build(
|
|
39
|
+
base: "flex w-full max-w-sm min-w-0 flex-col items-center gap-4 text-sm text-balance"
|
|
40
|
+
)
|
|
41
|
+
end
|
|
42
|
+
end
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
module Kiso
|
|
2
|
+
module Themes
|
|
3
|
+
# shadcn base: bg-border shrink-0
|
|
4
|
+
# Horizontal: h-px w-full
|
|
5
|
+
# Vertical: h-full w-px
|
|
6
|
+
Separator = ClassVariants.build(
|
|
7
|
+
base: "bg-border shrink-0",
|
|
8
|
+
variants: {
|
|
9
|
+
orientation: {
|
|
10
|
+
horizontal: "h-px w-full",
|
|
11
|
+
vertical: "h-full w-px"
|
|
12
|
+
}
|
|
13
|
+
},
|
|
14
|
+
defaults: {orientation: :horizontal}
|
|
15
|
+
)
|
|
16
|
+
end
|
|
17
|
+
end
|
|
@@ -0,0 +1,57 @@
|
|
|
1
|
+
module Kiso
|
|
2
|
+
module Themes
|
|
3
|
+
# Stats card — specialized Card layout for dashboard metrics.
|
|
4
|
+
# Same variant axis as Card (outline/soft/subtle) with tighter spacing.
|
|
5
|
+
# shadcn ref: section-cards.tsx (Card + CardDescription + CardTitle + CardAction)
|
|
6
|
+
# Maquina ref: stats/_stats_card.html.erb
|
|
7
|
+
StatsCard = ClassVariants.build(
|
|
8
|
+
base: "flex flex-col gap-2 rounded-xl p-4 text-foreground",
|
|
9
|
+
variants: {
|
|
10
|
+
variant: {
|
|
11
|
+
outline: "bg-background ring ring-inset ring-border shadow-sm",
|
|
12
|
+
soft: "bg-elevated/50",
|
|
13
|
+
subtle: "bg-elevated/50 ring ring-inset ring-border"
|
|
14
|
+
}
|
|
15
|
+
},
|
|
16
|
+
defaults: {variant: :outline}
|
|
17
|
+
)
|
|
18
|
+
|
|
19
|
+
# shadcn: CardHeader with CardDescription + CardAction in a row
|
|
20
|
+
# Flex row for label on left, optional icon/badge on right.
|
|
21
|
+
StatsCardHeader = ClassVariants.build(
|
|
22
|
+
base: "flex items-center justify-between gap-2"
|
|
23
|
+
)
|
|
24
|
+
|
|
25
|
+
# shadcn: CardDescription — text-sm text-muted-foreground
|
|
26
|
+
# The metric name ("Total Revenue", "New Customers").
|
|
27
|
+
StatsCardLabel = ClassVariants.build(
|
|
28
|
+
base: "text-sm font-medium text-muted-foreground"
|
|
29
|
+
)
|
|
30
|
+
|
|
31
|
+
# shadcn: CardTitle overridden to text-2xl font-semibold tabular-nums
|
|
32
|
+
# The big metric number ("$1,250.00", "45,678").
|
|
33
|
+
StatsCardValue = ClassVariants.build(
|
|
34
|
+
base: "text-2xl font-semibold tabular-nums"
|
|
35
|
+
)
|
|
36
|
+
|
|
37
|
+
# shadcn: CardFooter description — text-xs text-muted-foreground
|
|
38
|
+
# Trend text, subtitle, or additional context.
|
|
39
|
+
StatsCardDescription = ClassVariants.build(
|
|
40
|
+
base: "text-xs text-muted-foreground"
|
|
41
|
+
)
|
|
42
|
+
|
|
43
|
+
# Responsive grid wrapper for stats cards.
|
|
44
|
+
# Maquina ref: stats/_stats_grid.html.erb
|
|
45
|
+
StatsGrid = ClassVariants.build(
|
|
46
|
+
base: "grid grid-cols-1 gap-4",
|
|
47
|
+
variants: {
|
|
48
|
+
columns: {
|
|
49
|
+
2 => "sm:grid-cols-2",
|
|
50
|
+
3 => "sm:grid-cols-3",
|
|
51
|
+
4 => "sm:grid-cols-2 lg:grid-cols-4"
|
|
52
|
+
}
|
|
53
|
+
},
|
|
54
|
+
defaults: {columns: 4}
|
|
55
|
+
)
|
|
56
|
+
end
|
|
57
|
+
end
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
module Kiso
|
|
2
|
+
module Themes
|
|
3
|
+
# shadcn wraps <table> in a scrollable container div.
|
|
4
|
+
# Container: relative w-full overflow-x-auto
|
|
5
|
+
# Table: w-full caption-bottom text-sm
|
|
6
|
+
Table = ClassVariants.build(
|
|
7
|
+
base: "w-full caption-bottom text-sm"
|
|
8
|
+
)
|
|
9
|
+
|
|
10
|
+
# shadcn: [&_tr]:border-b
|
|
11
|
+
# border-border explicit — TW4 defaults border color to currentColor
|
|
12
|
+
TableHeader = ClassVariants.build(
|
|
13
|
+
base: "[&_tr]:border-b [&_tr]:border-border"
|
|
14
|
+
)
|
|
15
|
+
|
|
16
|
+
# shadcn: [&_tr:last-child]:border-0
|
|
17
|
+
TableBody = ClassVariants.build(
|
|
18
|
+
base: "[&_tr:last-child]:border-0"
|
|
19
|
+
)
|
|
20
|
+
|
|
21
|
+
# shadcn: bg-muted/50 border-t font-medium [&>tr]:last:border-b-0
|
|
22
|
+
TableFooter = ClassVariants.build(
|
|
23
|
+
base: "bg-muted/50 border-t border-border font-medium [&>tr]:last:border-b-0"
|
|
24
|
+
)
|
|
25
|
+
|
|
26
|
+
# shadcn: hover:bg-muted/50 data-[state=selected]:bg-muted border-b transition-colors
|
|
27
|
+
TableRow = ClassVariants.build(
|
|
28
|
+
base: "hover:bg-muted/50 data-[state=selected]:bg-muted border-b border-border transition-colors"
|
|
29
|
+
)
|
|
30
|
+
|
|
31
|
+
# shadcn: text-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap
|
|
32
|
+
# [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]
|
|
33
|
+
TableHead = ClassVariants.build(
|
|
34
|
+
base: "text-muted-foreground h-10 px-2 text-left align-middle font-medium whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]"
|
|
35
|
+
)
|
|
36
|
+
|
|
37
|
+
# shadcn: p-2 align-middle whitespace-nowrap
|
|
38
|
+
# [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]
|
|
39
|
+
TableCell = ClassVariants.build(
|
|
40
|
+
base: "p-2 align-middle whitespace-nowrap [&:has([role=checkbox])]:pr-0 [&>[role=checkbox]]:translate-y-[2px]"
|
|
41
|
+
)
|
|
42
|
+
|
|
43
|
+
# shadcn: text-muted-foreground mt-4 text-sm
|
|
44
|
+
TableCaption = ClassVariants.build(
|
|
45
|
+
base: "text-muted-foreground mt-4 text-sm"
|
|
46
|
+
)
|
|
47
|
+
end
|
|
48
|
+
end
|
data/lib/kiso/version.rb
ADDED
data/lib/kiso.rb
ADDED
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
require "tailwindcss-rails"
|
|
2
|
+
require "class_variants"
|
|
3
|
+
require "tailwind_merge"
|
|
4
|
+
require "kiso/version"
|
|
5
|
+
require "kiso/engine"
|
|
6
|
+
require "kiso/themes/badge"
|
|
7
|
+
require "kiso/themes/alert"
|
|
8
|
+
require "kiso/themes/button"
|
|
9
|
+
require "kiso/themes/card"
|
|
10
|
+
require "kiso/themes/separator"
|
|
11
|
+
require "kiso/themes/empty_state"
|
|
12
|
+
require "kiso/themes/stats_card"
|
|
13
|
+
require "kiso/themes/table"
|
|
14
|
+
require "kiso/icons"
|
|
15
|
+
|
|
16
|
+
module Kiso
|
|
17
|
+
end
|
metadata
ADDED
|
@@ -0,0 +1,175 @@
|
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
|
2
|
+
name: kiso
|
|
3
|
+
version: !ruby/object:Gem::Version
|
|
4
|
+
version: 0.1.0.pre
|
|
5
|
+
platform: ruby
|
|
6
|
+
authors:
|
|
7
|
+
- Steve Clarke
|
|
8
|
+
bindir: bin
|
|
9
|
+
cert_chain: []
|
|
10
|
+
date: 1980-01-02 00:00:00.000000000 Z
|
|
11
|
+
dependencies:
|
|
12
|
+
- !ruby/object:Gem::Dependency
|
|
13
|
+
name: rails
|
|
14
|
+
requirement: !ruby/object:Gem::Requirement
|
|
15
|
+
requirements:
|
|
16
|
+
- - ">="
|
|
17
|
+
- !ruby/object:Gem::Version
|
|
18
|
+
version: '8.0'
|
|
19
|
+
type: :runtime
|
|
20
|
+
prerelease: false
|
|
21
|
+
version_requirements: !ruby/object:Gem::Requirement
|
|
22
|
+
requirements:
|
|
23
|
+
- - ">="
|
|
24
|
+
- !ruby/object:Gem::Version
|
|
25
|
+
version: '8.0'
|
|
26
|
+
- !ruby/object:Gem::Dependency
|
|
27
|
+
name: tailwindcss-rails
|
|
28
|
+
requirement: !ruby/object:Gem::Requirement
|
|
29
|
+
requirements:
|
|
30
|
+
- - ">="
|
|
31
|
+
- !ruby/object:Gem::Version
|
|
32
|
+
version: '0'
|
|
33
|
+
type: :runtime
|
|
34
|
+
prerelease: false
|
|
35
|
+
version_requirements: !ruby/object:Gem::Requirement
|
|
36
|
+
requirements:
|
|
37
|
+
- - ">="
|
|
38
|
+
- !ruby/object:Gem::Version
|
|
39
|
+
version: '0'
|
|
40
|
+
- !ruby/object:Gem::Dependency
|
|
41
|
+
name: class_variants
|
|
42
|
+
requirement: !ruby/object:Gem::Requirement
|
|
43
|
+
requirements:
|
|
44
|
+
- - "~>"
|
|
45
|
+
- !ruby/object:Gem::Version
|
|
46
|
+
version: '1.1'
|
|
47
|
+
type: :runtime
|
|
48
|
+
prerelease: false
|
|
49
|
+
version_requirements: !ruby/object:Gem::Requirement
|
|
50
|
+
requirements:
|
|
51
|
+
- - "~>"
|
|
52
|
+
- !ruby/object:Gem::Version
|
|
53
|
+
version: '1.1'
|
|
54
|
+
- !ruby/object:Gem::Dependency
|
|
55
|
+
name: tailwind_merge
|
|
56
|
+
requirement: !ruby/object:Gem::Requirement
|
|
57
|
+
requirements:
|
|
58
|
+
- - "~>"
|
|
59
|
+
- !ruby/object:Gem::Version
|
|
60
|
+
version: '1.0'
|
|
61
|
+
type: :runtime
|
|
62
|
+
prerelease: false
|
|
63
|
+
version_requirements: !ruby/object:Gem::Requirement
|
|
64
|
+
requirements:
|
|
65
|
+
- - "~>"
|
|
66
|
+
- !ruby/object:Gem::Version
|
|
67
|
+
version: '1.0'
|
|
68
|
+
- !ruby/object:Gem::Dependency
|
|
69
|
+
name: kiso-icons
|
|
70
|
+
requirement: !ruby/object:Gem::Requirement
|
|
71
|
+
requirements:
|
|
72
|
+
- - ">="
|
|
73
|
+
- !ruby/object:Gem::Version
|
|
74
|
+
version: '0'
|
|
75
|
+
type: :runtime
|
|
76
|
+
prerelease: false
|
|
77
|
+
version_requirements: !ruby/object:Gem::Requirement
|
|
78
|
+
requirements:
|
|
79
|
+
- - ">="
|
|
80
|
+
- !ruby/object:Gem::Version
|
|
81
|
+
version: '0'
|
|
82
|
+
description: Accessible, themeable UI components for Rails + Hotwire. ERB partials,
|
|
83
|
+
data-attribute CSS, progressive Stimulus.
|
|
84
|
+
email:
|
|
85
|
+
- steve@sevenview.ca
|
|
86
|
+
executables: []
|
|
87
|
+
extensions: []
|
|
88
|
+
extra_rdoc_files: []
|
|
89
|
+
files:
|
|
90
|
+
- CHANGELOG.md
|
|
91
|
+
- MIT-LICENSE
|
|
92
|
+
- README.md
|
|
93
|
+
- Rakefile
|
|
94
|
+
- app/assets/fonts/kiso/GeistMonoVF.woff2
|
|
95
|
+
- app/assets/fonts/kiso/GeistVF.woff2
|
|
96
|
+
- app/assets/fonts/kiso/OFL.txt
|
|
97
|
+
- app/assets/tailwind/kiso/engine.css
|
|
98
|
+
- app/helpers/kiso/component_helper.rb
|
|
99
|
+
- app/helpers/kiso/icon_helper.rb
|
|
100
|
+
- app/views/kiso/components/_alert.html.erb
|
|
101
|
+
- app/views/kiso/components/_badge.html.erb
|
|
102
|
+
- app/views/kiso/components/_button.html.erb
|
|
103
|
+
- app/views/kiso/components/_card.html.erb
|
|
104
|
+
- app/views/kiso/components/_empty_state.html.erb
|
|
105
|
+
- app/views/kiso/components/_separator.html.erb
|
|
106
|
+
- app/views/kiso/components/_stats_card.html.erb
|
|
107
|
+
- app/views/kiso/components/_stats_grid.html.erb
|
|
108
|
+
- app/views/kiso/components/_table.html.erb
|
|
109
|
+
- app/views/kiso/components/alert/_description.html.erb
|
|
110
|
+
- app/views/kiso/components/alert/_title.html.erb
|
|
111
|
+
- app/views/kiso/components/card/_content.html.erb
|
|
112
|
+
- app/views/kiso/components/card/_description.html.erb
|
|
113
|
+
- app/views/kiso/components/card/_footer.html.erb
|
|
114
|
+
- app/views/kiso/components/card/_header.html.erb
|
|
115
|
+
- app/views/kiso/components/card/_title.html.erb
|
|
116
|
+
- app/views/kiso/components/empty_state/_content.html.erb
|
|
117
|
+
- app/views/kiso/components/empty_state/_description.html.erb
|
|
118
|
+
- app/views/kiso/components/empty_state/_header.html.erb
|
|
119
|
+
- app/views/kiso/components/empty_state/_media.html.erb
|
|
120
|
+
- app/views/kiso/components/empty_state/_title.html.erb
|
|
121
|
+
- app/views/kiso/components/stats_card/_description.html.erb
|
|
122
|
+
- app/views/kiso/components/stats_card/_header.html.erb
|
|
123
|
+
- app/views/kiso/components/stats_card/_label.html.erb
|
|
124
|
+
- app/views/kiso/components/stats_card/_value.html.erb
|
|
125
|
+
- app/views/kiso/components/table/_body.html.erb
|
|
126
|
+
- app/views/kiso/components/table/_caption.html.erb
|
|
127
|
+
- app/views/kiso/components/table/_cell.html.erb
|
|
128
|
+
- app/views/kiso/components/table/_footer.html.erb
|
|
129
|
+
- app/views/kiso/components/table/_head.html.erb
|
|
130
|
+
- app/views/kiso/components/table/_header.html.erb
|
|
131
|
+
- app/views/kiso/components/table/_row.html.erb
|
|
132
|
+
- lib/kiso.rb
|
|
133
|
+
- lib/kiso/cli.rb
|
|
134
|
+
- lib/kiso/cli/base.rb
|
|
135
|
+
- lib/kiso/cli/icons.rb
|
|
136
|
+
- lib/kiso/cli/main.rb
|
|
137
|
+
- lib/kiso/cli/make.rb
|
|
138
|
+
- lib/kiso/engine.rb
|
|
139
|
+
- lib/kiso/themes/alert.rb
|
|
140
|
+
- lib/kiso/themes/badge.rb
|
|
141
|
+
- lib/kiso/themes/button.rb
|
|
142
|
+
- lib/kiso/themes/card.rb
|
|
143
|
+
- lib/kiso/themes/empty_state.rb
|
|
144
|
+
- lib/kiso/themes/separator.rb
|
|
145
|
+
- lib/kiso/themes/stats_card.rb
|
|
146
|
+
- lib/kiso/themes/table.rb
|
|
147
|
+
- lib/kiso/version.rb
|
|
148
|
+
homepage: https://github.com/steveclarke/kiso
|
|
149
|
+
licenses:
|
|
150
|
+
- MIT
|
|
151
|
+
metadata:
|
|
152
|
+
homepage_uri: https://github.com/steveclarke/kiso
|
|
153
|
+
source_code_uri: https://github.com/steveclarke/kiso
|
|
154
|
+
changelog_uri: https://github.com/steveclarke/kiso/blob/master/CHANGELOG.md
|
|
155
|
+
bug_tracker_uri: https://github.com/steveclarke/kiso/issues
|
|
156
|
+
rubygems_mfa_required: 'true'
|
|
157
|
+
allowed_push_host: https://rubygems.org
|
|
158
|
+
rdoc_options: []
|
|
159
|
+
require_paths:
|
|
160
|
+
- lib
|
|
161
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
|
162
|
+
requirements:
|
|
163
|
+
- - ">="
|
|
164
|
+
- !ruby/object:Gem::Version
|
|
165
|
+
version: '3.3'
|
|
166
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
|
167
|
+
requirements:
|
|
168
|
+
- - ">="
|
|
169
|
+
- !ruby/object:Gem::Version
|
|
170
|
+
version: '0'
|
|
171
|
+
requirements: []
|
|
172
|
+
rubygems_version: 3.6.9
|
|
173
|
+
specification_version: 4
|
|
174
|
+
summary: A Rails component library inspired by shadcn/ui
|
|
175
|
+
test_files: []
|