logosphere-ui 0.0.0-alpha.91 → 0.0.0-alpha.97

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.
Files changed (203) hide show
  1. package/README.md +22 -38
  2. package/dist/{Badge → atoms/Badge}/badge.d.ts +4 -5
  3. package/dist/{Button → atoms/Button}/button.d.ts +4 -4
  4. package/dist/{Checkbox → atoms/Checkbox}/checkbox.d.ts +4 -2
  5. package/dist/{FormField → atoms/FormField}/formfield.d.ts +2 -1
  6. package/dist/{Switch → atoms/Switch}/switch.d.ts +1 -1
  7. package/dist/badge-BbhaO73N.cjs +13 -0
  8. package/dist/badge-DE7Tgd8Z.js +71 -0
  9. package/dist/badge.cjs +1 -0
  10. package/dist/badge.js +4 -0
  11. package/dist/breadcrumb-B-4yqoJZ.js +41 -0
  12. package/dist/breadcrumb-Cop-B1J7.cjs +12 -0
  13. package/dist/breadcrumb.cjs +1 -1
  14. package/dist/breadcrumb.js +1 -1
  15. package/dist/button-C1EwOosO.js +58 -0
  16. package/dist/button-CDRccsk9.cjs +10 -0
  17. package/dist/button.cjs +1 -1
  18. package/dist/button.js +1 -1
  19. package/dist/card-CUhlTJyJ.js +97 -0
  20. package/dist/card-n8ka8Zk-.cjs +43 -0
  21. package/dist/card.cjs +1 -1
  22. package/dist/card.js +1 -1
  23. package/dist/chatbot-Ces7Xveb.js +496 -0
  24. package/dist/chatbot-oRwt64d8.cjs +160 -0
  25. package/dist/chatbot.cjs +1 -1
  26. package/dist/chatbot.js +1 -1
  27. package/dist/checkbox-7Rb3WKGx.js +119 -0
  28. package/dist/checkbox-CdDTRdKV.cjs +37 -0
  29. package/dist/checkbox.cjs +1 -1
  30. package/dist/checkbox.js +1 -1
  31. package/dist/combobox-BJbI-Tgi.js +268 -0
  32. package/dist/combobox-pmE7bgEL.cjs +99 -0
  33. package/dist/combobox.cjs +1 -1
  34. package/dist/combobox.js +1 -1
  35. package/dist/datepicker-DFJx45C-.js +750 -0
  36. package/dist/datepicker-b9JGTTMx.cjs +115 -0
  37. package/dist/datepicker.cjs +1 -1
  38. package/dist/datepicker.js +1 -1
  39. package/dist/directive-Z_rhNYWK.js +240 -0
  40. package/dist/directive-ekjitgzi.cjs +3 -0
  41. package/dist/download-manager-A4fOxGWJ.js +381 -0
  42. package/dist/download-manager-BSIMTGaK.cjs +97 -0
  43. package/dist/download-manager.cjs +1 -1
  44. package/dist/download-manager.js +1 -1
  45. package/dist/formfield-D_7NFFoe.cjs +27 -0
  46. package/dist/formfield-d8fp9FTV.js +118 -0
  47. package/dist/formfield.cjs +1 -1
  48. package/dist/formfield.js +1 -1
  49. package/dist/index.cjs +1 -24
  50. package/dist/index.d.ts +16 -14
  51. package/dist/index.js +32 -124
  52. package/dist/index.umd.js +656 -892
  53. package/dist/{input-Ct7_-vam.js → input-ByllRq9M.js} +61 -97
  54. package/dist/input-DsIOQPGV.cjs +46 -0
  55. package/dist/input.cjs +1 -0
  56. package/dist/input.js +4 -0
  57. package/dist/live-BX-yBGvT.cjs +1 -0
  58. package/dist/live-WTVSYE2F.js +24 -0
  59. package/dist/modal-Bfc6WQSL.js +110 -0
  60. package/dist/modal-DQ8VFL-P.cjs +39 -0
  61. package/dist/modal.cjs +1 -1
  62. package/dist/modal.js +1 -1
  63. package/dist/{Breadcrumb → molecules/Breadcrumb}/breadcrumb.d.ts +1 -1
  64. package/dist/molecules/Card/card.d.ts +16 -0
  65. package/dist/{Input → molecules/Input}/input.d.ts +3 -2
  66. package/dist/molecules/Popover/index.d.ts +1 -0
  67. package/dist/molecules/Popover/popover.d.ts +33 -0
  68. package/dist/{Textarea → molecules/Textarea}/text-area.d.ts +4 -2
  69. package/dist/{Chatbot → organisms/Chatbot}/chatbot.d.ts +13 -12
  70. package/dist/organisms/Combobox/combobox.d.ts +49 -0
  71. package/dist/{DatePicker → organisms/DatePicker}/datepicker.d.ts +42 -32
  72. package/dist/{DownloadManager → organisms/DownloadManager}/download-manager.d.ts +5 -5
  73. package/dist/{Modal → organisms/Modal}/modal.d.ts +1 -1
  74. package/dist/organisms/Tab/index.d.ts +1 -0
  75. package/dist/organisms/Tab/tab.d.ts +33 -0
  76. package/dist/popover-C_Ob86CJ.cjs +30 -0
  77. package/dist/popover-D-FXdEdS.js +1040 -0
  78. package/dist/popover.cjs +1 -0
  79. package/dist/popover.js +4 -0
  80. package/dist/shared/icons/icon-map.d.ts +1 -0
  81. package/dist/shared/icons/ui-icon.d.ts +15 -0
  82. package/dist/styles/main.css +247 -0
  83. package/dist/switch-Cpl53nRW.js +64 -0
  84. package/dist/switch-Rnnn10bn.cjs +17 -0
  85. package/dist/switch.cjs +1 -1
  86. package/dist/switch.js +1 -1
  87. package/dist/tab-BKdN4xAz.js +176 -0
  88. package/dist/tab-DcjAlXzU.cjs +40 -0
  89. package/dist/tab.cjs +1 -0
  90. package/dist/tab.js +4 -0
  91. package/dist/text-area-CtZY3yLA.js +204 -0
  92. package/dist/text-area-DFDF5oos.cjs +44 -0
  93. package/dist/textarea.cjs +1 -1
  94. package/dist/textarea.js +1 -1
  95. package/dist/vite.svg +0 -0
  96. package/package.json +33 -143
  97. package/dist/Card/card.d.ts +0 -9
  98. package/dist/Combobox/combobox.d.ts +0 -30
  99. package/dist/angular/README.md +0 -775
  100. package/dist/angular/breadcrumb.d.ts +0 -7
  101. package/dist/angular/button.d.ts +0 -7
  102. package/dist/angular/card.d.ts +0 -7
  103. package/dist/angular/chatbot.d.ts +0 -15
  104. package/dist/angular/checkbox.d.ts +0 -19
  105. package/dist/angular/combobox.d.ts +0 -19
  106. package/dist/angular/datepicker.d.ts +0 -23
  107. package/dist/angular/download-manager.d.ts +0 -15
  108. package/dist/angular/fesm2022/logosphere-ui.mjs +0 -508
  109. package/dist/angular/fesm2022/logosphere-ui.mjs.map +0 -1
  110. package/dist/angular/formfield.d.ts +0 -7
  111. package/dist/angular/index.d.ts +0 -5
  112. package/dist/angular/modal.d.ts +0 -7
  113. package/dist/angular/public-api.d.ts +0 -12
  114. package/dist/angular/switch.d.ts +0 -19
  115. package/dist/angular/textarea.d.ts +0 -19
  116. package/dist/breadcrumb-B3SE-L47.js +0 -43
  117. package/dist/breadcrumb-DCZ5osDp.cjs +0 -16
  118. package/dist/button-BC3KVuTR.cjs +0 -13
  119. package/dist/button-BIx-2Flb.js +0 -57
  120. package/dist/card-DBCQQydI.js +0 -60
  121. package/dist/card-DicvR8K4.cjs +0 -24
  122. package/dist/chatbot-BLbRfNyA.cjs +0 -215
  123. package/dist/chatbot-DDnAKgXN.js +0 -542
  124. package/dist/checkbox-Cx-0mUgN.js +0 -101
  125. package/dist/checkbox-X6kzQ4dF.cjs +0 -28
  126. package/dist/combobox-BqX-d0Ox.cjs +0 -106
  127. package/dist/combobox-Ok1Lslvg.js +0 -223
  128. package/dist/datepicker-Cufvaek1.cjs +0 -158
  129. package/dist/datepicker-dZwy6sVi.js +0 -789
  130. package/dist/download-manager-BsXBTw_N.cjs +0 -191
  131. package/dist/download-manager-vQQrAz-6.js +0 -574
  132. package/dist/formfield-CfCWou5r.cjs +0 -72
  133. package/dist/formfield-QVp3YNt9.js +0 -437
  134. package/dist/frameworks/angular/breadcrumb.d.ts +0 -2
  135. package/dist/frameworks/angular/button.d.ts +0 -2
  136. package/dist/frameworks/angular/card.d.ts +0 -2
  137. package/dist/frameworks/angular/chatbot.d.ts +0 -12
  138. package/dist/frameworks/angular/checkbox.d.ts +0 -12
  139. package/dist/frameworks/angular/combobox.d.ts +0 -12
  140. package/dist/frameworks/angular/datepicker.d.ts +0 -20
  141. package/dist/frameworks/angular/download-manager.d.ts +0 -12
  142. package/dist/frameworks/angular/formfield.d.ts +0 -2
  143. package/dist/frameworks/angular/input.d.ts +0 -61
  144. package/dist/frameworks/angular/modal.d.ts +0 -2
  145. package/dist/frameworks/angular/public-api.d.ts +0 -12
  146. package/dist/frameworks/angular/switch.d.ts +0 -12
  147. package/dist/frameworks/angular/textarea.d.ts +0 -12
  148. package/dist/frameworks/react/index.d.ts +0 -56
  149. package/dist/frameworks/vue/index.d.ts +0 -44
  150. package/dist/frameworks/vue/input.d.ts +0 -337
  151. package/dist/input-CLCXy6gs.cjs +0 -46
  152. package/dist/live-BAtTYwxk.js +0 -34
  153. package/dist/live-CeFvobhW.cjs +0 -9
  154. package/dist/logosphere-base.css +0 -5895
  155. package/dist/logosphere-scoped.css +0 -5890
  156. package/dist/modal-9fXUUyhJ.cjs +0 -57
  157. package/dist/modal-DyGC1vWT.js +0 -131
  158. package/dist/react/index.cjs +0 -1
  159. package/dist/react/index.js +0 -123
  160. package/dist/shared/utils/tailwind-importer.d.ts +0 -2
  161. package/dist/switch-B_8PrmDJ.cjs +0 -27
  162. package/dist/switch-CkXwSX6t.js +0 -73
  163. package/dist/tailwind-importer-ByZDZ17M.cjs +0 -1
  164. package/dist/tailwind-importer-X02bCzIZ.js +0 -7
  165. package/dist/text-area-CQxdeOIa.cjs +0 -44
  166. package/dist/text-area-CVi4IGfs.js +0 -247
  167. package/dist/unicons/unicons-0.ttf +0 -0
  168. package/dist/unicons/unicons-1.ttf +0 -0
  169. package/dist/unicons/unicons-10.ttf +0 -0
  170. package/dist/unicons/unicons-11.ttf +0 -0
  171. package/dist/unicons/unicons-12.ttf +0 -0
  172. package/dist/unicons/unicons-13.ttf +0 -0
  173. package/dist/unicons/unicons-14.ttf +0 -0
  174. package/dist/unicons/unicons-15.ttf +0 -0
  175. package/dist/unicons/unicons-16.ttf +0 -0
  176. package/dist/unicons/unicons-17.ttf +0 -0
  177. package/dist/unicons/unicons-18.ttf +0 -0
  178. package/dist/unicons/unicons-19.ttf +0 -0
  179. package/dist/unicons/unicons-2.ttf +0 -0
  180. package/dist/unicons/unicons-20.ttf +0 -0
  181. package/dist/unicons/unicons-3.ttf +0 -0
  182. package/dist/unicons/unicons-4.ttf +0 -0
  183. package/dist/unicons/unicons-5.ttf +0 -0
  184. package/dist/unicons/unicons-6.ttf +0 -0
  185. package/dist/unicons/unicons-7.ttf +0 -0
  186. package/dist/unicons/unicons-8.ttf +0 -0
  187. package/dist/unicons/unicons-9.ttf +0 -0
  188. package/dist/vue/index.cjs +0 -1
  189. package/dist/vue/index.js +0 -173
  190. /package/dist/{Badge → atoms/Badge}/index.d.ts +0 -0
  191. /package/dist/{Button → atoms/Button}/index.d.ts +0 -0
  192. /package/dist/{Checkbox → atoms/Checkbox}/index.d.ts +0 -0
  193. /package/dist/{FormField → atoms/FormField}/index.d.ts +0 -0
  194. /package/dist/{Switch → atoms/Switch}/index.d.ts +0 -0
  195. /package/dist/{Breadcrumb → molecules/Breadcrumb}/index.d.ts +0 -0
  196. /package/dist/{Card → molecules/Card}/index.d.ts +0 -0
  197. /package/dist/{Input → molecules/Input}/index.d.ts +0 -0
  198. /package/dist/{Textarea → molecules/Textarea}/index.d.ts +0 -0
  199. /package/dist/{Chatbot → organisms/Chatbot}/index.d.ts +0 -0
  200. /package/dist/{Combobox → organisms/Combobox}/index.d.ts +0 -0
  201. /package/dist/{DatePicker → organisms/DatePicker}/index.d.ts +0 -0
  202. /package/dist/{DownloadManager → organisms/DownloadManager}/index.d.ts +0 -0
  203. /package/dist/{Modal → organisms/Modal}/index.d.ts +0 -0
package/README.md CHANGED
@@ -7,7 +7,8 @@ A modern, framework-agnostic UI component library built with Lit and Web Compone
7
7
  - 🔧 **Framework Agnostic**: Works with React, Angular, Vue, and Vanilla JS
8
8
  - 🌳 **Tree-shakable**: Import only what you need
9
9
  - 📦 **Monolith Package**: Single npm package with granular imports
10
- - 🎨 **Tailwind CSS**: Built-in design system with Tailwind CSS
10
+ - 🎨 **Modern CSS**: Enterprise-grade CSS architecture with custom design system
11
+ - 🚀 **Zero Dependencies**: No utility framework bloat - pure, optimized CSS
11
12
  - 🔄 **TypeScript**: Full TypeScript support with type declarations
12
13
  - 📱 **Responsive**: Mobile-first design
13
14
  - ♿ **Accessible**: Built with accessibility in mind
@@ -22,59 +23,42 @@ npm install logosphere-ui
22
23
 
23
24
  ### 📦 CSS Import (Required)
24
25
 
25
- Logosphere UI provides two CSS variants to suit different integration needs:
26
-
27
- #### Option 1: Scoped CSS (Recommended) ✨
28
- Perfect for web components, Shadow DOM, and avoiding style conflicts with custom scoped reset:
26
+ Logosphere UI uses a modern, enterprise-grade CSS architecture. Simply import the main CSS file:
29
27
 
30
28
  **In CSS files:**
31
29
  ```css
32
- @import 'logosphere-ui/css/scoped';
30
+ @import 'logosphere-ui/css';
33
31
  ```
34
32
 
35
33
  **In JavaScript/TypeScript:**
36
34
  ```javascript
37
- import 'logosphere-ui/css/scoped';
35
+ import 'logosphere-ui/css';
38
36
  ```
39
37
 
40
38
  **In HTML:**
41
39
  ```html
42
- <link rel="stylesheet" href="node_modules/logosphere-ui/dist/logosphere-scoped.css">
43
- ```
44
-
45
- #### Option 2: Base CSS (Full Tailwind)
46
- Includes Tailwind's complete base styles and color system for full applications:
47
-
48
- **In CSS files:**
49
- ```css
50
- @import 'logosphere-ui/css/base';
51
- ```
52
-
53
- **In JavaScript/TypeScript:**
54
- ```javascript
55
- import 'logosphere-ui/css/base';
40
+ <link rel="stylesheet" href="node_modules/logosphere-ui/dist/logosphere.css">
56
41
  ```
57
42
 
58
- **In HTML:**
59
- ```html
60
- <link rel="stylesheet" href="node_modules/logosphere-ui/dist/logosphere-base.css">
61
- ```
43
+ #### Features of our CSS Architecture
62
44
 
63
- > 💡 **Which to choose?**
64
- > - **Scoped CSS**: For most projects, component libraries, or when integrating into existing apps
65
- > - **Base CSS**: For new full applications where you want complete Tailwind experience
45
+ - ✅ **Modern CSS Variables** - Theme-based design tokens
46
+ - ✅ **Scoped Reset** - Custom reset for web components (`.logoui-wrapper`)
47
+ - ✅ **No Framework Dependencies** - Pure, optimized CSS
48
+ - ✅ **Tree-shakable** - Import only what you use
49
+ - ✅ **Dark Mode Support** - Built-in dark theme via `[data-theme="dark"]`
50
+ - ✅ **Utility Classes** - Common utilities for rapid development
51
+ - ✅ **Icon Font Included** - Unicons icon set bundled
66
52
 
67
53
  #### Quick Import Reference
68
54
 
69
55
  | Framework | Import Method | Example |
70
56
  |-----------|--------------|---------|
71
- | **Vanilla JS** | HTML Link | `<link rel="stylesheet" href="node_modules/logosphere-ui/dist/logosphere-scoped.css">` |
72
- | **React** | ES Import | `import 'logosphere-ui/css/scoped';` |
73
- | **Angular** | styles.css | `@import 'logosphere-ui/css/scoped';` |
74
- | **Vue 3** | main.ts | `import 'logosphere-ui/css/scoped';` |
75
- | **Any CSS** | CSS Import | `@import 'logosphere-ui/css/scoped';` |
76
-
77
- 📖 **Learn more:** See [CSS_VARIANTS.md](./CSS_VARIANTS.md) for detailed comparison and guidance.
57
+ | **Vanilla JS** | HTML Link | `<link rel="stylesheet" href="node_modules/logosphere-ui/dist/logosphere.css">` |
58
+ | **React** | ES Import | `import 'logosphere-ui/css';` |
59
+ | **Angular** | styles.css | `@import 'logosphere-ui/css';` |
60
+ | **Vue 3** | main.ts | `import 'logosphere-ui/css';` |
61
+ | **Any CSS** | CSS Import | `@import 'logosphere-ui/css';` |
78
62
 
79
63
  ### Vanilla JavaScript / HTML
80
64
 
@@ -82,8 +66,8 @@ import 'logosphere-ui/css/base';
82
66
  <!DOCTYPE html>
83
67
  <html>
84
68
  <head>
85
- <!-- Import CSS: Choose scoped (recommended) or base -->
86
- <link rel="stylesheet" href="node_modules/logosphere-ui/dist/logosphere-scoped.css">
69
+ <!-- Import CSS -->
70
+ <link rel="stylesheet" href="node_modules/logosphere-ui/dist/logosphere.css">
87
71
  </head>
88
72
  <body>
89
73
  <logosphere-button variant="primary">Click me!</logosphere-button>
@@ -772,4 +756,4 @@ npm pkg fix
772
756
  # Check build output
773
757
  npm run build
774
758
  ls -la dist/
775
- ```
759
+ ```
package/dist/{Badge → atoms/Badge}/badge.d.ts RENAMED
@@ -1,8 +1,9 @@
1
1
  import { LitElement } from "lit";
2
- export type BadgeVariant = "default" | "warning" | "success" | "info" | "danger";
2
+ import "../../shared/icons/ui-icon";
3
+ export type BadgeVariant = "default" | "warning" | "success" | "info" | "danger" | "purple";
3
4
  export type BadgeSize = "default" | "small";
4
5
  export declare class LogosphereBadge extends LitElement {
5
- static styles: CSSStyleSheet[];
6
+ static styles: import("lit").CSSResult[];
6
7
  variant: BadgeVariant;
7
8
  size: BadgeSize;
8
9
  text: string;
@@ -10,9 +11,7 @@ export declare class LogosphereBadge extends LitElement {
10
11
  isRound: boolean;
11
12
  onClose?: () => void;
12
13
  private handleClose;
13
- private getVariantClasses;
14
- private getSizeClasses;
15
- private getBorderRadiusClass;
14
+ private getBadgeClasses;
16
15
  render(): import("lit-html").TemplateResult<1>;
17
16
  }
18
17
  declare global {
package/dist/{Button → atoms/Button}/button.d.ts RENAMED
@@ -1,11 +1,11 @@
1
1
  import { LitElement } from "lit";
2
2
  export declare class Button extends LitElement {
3
- static styles: CSSStyleSheet[];
3
+ static styles: import("lit").CSSResult[];
4
4
  variant: "solid" | "outline" | "text";
5
5
  size: "sm" | "md" | "lg";
6
- theme: string;
6
+ theme: "primary" | "success" | "danger" | "info" | "warning" | "light" | "dark";
7
7
  iconOnly: boolean;
8
- private getPaddingClasses;
9
- private getVariantClass;
8
+ disabled: boolean;
9
+ private getButtonClasses;
10
10
  render(): import("lit-html").TemplateResult<1>;
11
11
  }
package/dist/{Checkbox → atoms/Checkbox}/checkbox.d.ts RENAMED
@@ -1,6 +1,6 @@
1
1
  import { LitElement } from "lit";
2
2
  export declare class Checkbox extends LitElement {
3
- static styles: (CSSStyleSheet | import("lit").CSSResult)[];
3
+ static styles: import("lit").CSSResult[];
4
4
  label: string;
5
5
  value: string;
6
6
  checked: boolean;
@@ -11,8 +11,10 @@ export declare class Checkbox extends LitElement {
11
11
  private inputElement?;
12
12
  connectedCallback(): void;
13
13
  firstUpdated(): void;
14
- updated(changedProps: Map<string, any>): void;
14
+ updated(changedProps: Map<string, unknown>): void;
15
15
  private setIndeterminate;
16
16
  private toggleChecked;
17
+ private renderCheckbox;
18
+ private renderSwitch;
17
19
  render(): import("lit-html").TemplateResult<1>;
18
20
  }
package/dist/{FormField → atoms/FormField}/formfield.d.ts RENAMED
@@ -2,7 +2,7 @@ import { LitElement } from "lit";
2
2
  export type FormFieldSize = "default" | "large";
3
3
  export type FormFieldVariant = "default" | "subtle";
4
4
  export declare class FormField extends LitElement {
5
- static styles: (CSSStyleSheet | import("lit").CSSResult)[];
5
+ static styles: import("lit").CSSResult[];
6
6
  label: string;
7
7
  helper: string;
8
8
  error: string;
@@ -18,6 +18,7 @@ export declare class FormField extends LitElement {
18
18
  private handleSlotBlur;
19
19
  private handleMouseEnter;
20
20
  private handleMouseLeave;
21
+ private handleContainerClick;
21
22
  connectedCallback(): void;
22
23
  disconnectedCallback(): void;
23
24
  render(): import("lit-html").TemplateResult<1>;
package/dist/{Switch → atoms/Switch}/switch.d.ts RENAMED
@@ -1,6 +1,6 @@
1
1
  import { LitElement } from "lit";
2
2
  export declare class Switch extends LitElement {
3
- static styles: (CSSStyleSheet | import("lit").CSSResult)[];
3
+ static styles: import("lit").CSSResult[];
4
4
  checked: boolean;
5
5
  disabled: boolean;
6
6
  size: "sm" | "md";
package/dist/badge-BbhaO73N.cjs ADDED
@@ -0,0 +1,13 @@
1
+ "use strict";const e=require("lit"),a=require("lit/decorators.js"),c=".badge{display:inline-flex;align-items:center;gap:var(--spacing-1);font-family:var(--font-family-base);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);border-radius:var(--radius-base);white-space:nowrap;-webkit-user-select:none;user-select:none}.badge--default-size{padding:var(--spacing-1) var(--spacing-2)}.badge--small{padding:0 var(--spacing-1)}.badge--round{border-radius:var(--radius-md)}.badge--default{background-color:var(--color-tertiary-bg);color:var(--color-secondary)}.badge--warning{background-color:var(--color-warning-rgb);color:var(--color-warning-text-emphasis)}.badge--success{background-color:var(--color-success-rgb);color:var(--color-success)}.badge--info{background-color:var(--color-info-rgb);color:var(--color-info-text-emphasis)}.badge--danger{background-color:var(--color-danger-rgb);color:var(--color-danger)}.badge--purple{background-color:var(--color-purple-rgb);color:var(--color-purple)}.badge__close{display:inline-flex;align-items:center;justify-content:center;margin-left:var(--spacing-1);padding:0;background:none;border:none;cursor:pointer;color:inherit;opacity:.75;transition:opacity var(--transition-speed-fast) var(--transition-timing);line-height:1}.badge__close:hover{opacity:1}.badge__close:focus{outline:none;opacity:1}";var d=Object.defineProperty,p=Object.getOwnPropertyDescriptor,s=(n,o,i,t)=>{for(var r=t>1?void 0:t?p(o,i):o,l=n.length-1,g;l>=0;l--)(g=n[l])&&(r=(t?g(o,i,r):g(r))||r);return t&&r&&d(o,i,r),r};exports.LogosphereBadge=class extends e.LitElement{constructor(){super(...arguments),this.variant="default",this.size="default",this.text="",this.closeable=!1,this.isRound=!1}handleClose(){this.onClose&&this.onClose(),this.dispatchEvent(new CustomEvent("close",{bubbles:!0,composed:!0}))}getBadgeClasses(){const o=["badge",`badge--${this.variant}`,this.size==="small"?"badge--small":"badge--default-size"];return this.isRound&&o.push("badge--round"),o.join(" ")}render(){return e.html`
2
+ <div class="${this.getBadgeClasses()}">
3
+ <slot></slot>
4
+ ${this.text?e.html`<span>${this.text}</span>`:e.nothing}
5
+ ${this.closeable?e.html`
6
+ <button class="badge__close" @click=${this.handleClose} aria-label="Close">
7
+ <ui-icon name="uil-times"></ui-icon>
8
+ </button>
9
+ `:e.nothing}
10
+ </div>
11
+ `}};exports.LogosphereBadge.styles=[e.css`
12
+ ${e.unsafeCSS(c)}
13
+ `];s([a.property({type:String})],exports.LogosphereBadge.prototype,"variant",2);s([a.property({type:String})],exports.LogosphereBadge.prototype,"size",2);s([a.property({type:String})],exports.LogosphereBadge.prototype,"text",2);s([a.property({type:Boolean})],exports.LogosphereBadge.prototype,"closeable",2);s([a.property({type:Boolean})],exports.LogosphereBadge.prototype,"isRound",2);s([a.property({attribute:!1})],exports.LogosphereBadge.prototype,"onClose",2);exports.LogosphereBadge=s([a.customElement("logosphere-badge")],exports.LogosphereBadge);
package/dist/badge-DE7Tgd8Z.js ADDED
@@ -0,0 +1,71 @@
1
+ import { LitElement as p, nothing as d, html as g, unsafeCSS as u, css as b } from "lit";
2
+ import { property as a, customElement as v } from "lit/decorators.js";
3
+ const h = ".badge{display:inline-flex;align-items:center;gap:var(--spacing-1);font-family:var(--font-family-base);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);line-height:var(--line-height-normal);border-radius:var(--radius-base);white-space:nowrap;-webkit-user-select:none;user-select:none}.badge--default-size{padding:var(--spacing-1) var(--spacing-2)}.badge--small{padding:0 var(--spacing-1)}.badge--round{border-radius:var(--radius-md)}.badge--default{background-color:var(--color-tertiary-bg);color:var(--color-secondary)}.badge--warning{background-color:var(--color-warning-rgb);color:var(--color-warning-text-emphasis)}.badge--success{background-color:var(--color-success-rgb);color:var(--color-success)}.badge--info{background-color:var(--color-info-rgb);color:var(--color-info-text-emphasis)}.badge--danger{background-color:var(--color-danger-rgb);color:var(--color-danger)}.badge--purple{background-color:var(--color-purple-rgb);color:var(--color-purple)}.badge__close{display:inline-flex;align-items:center;justify-content:center;margin-left:var(--spacing-1);padding:0;background:none;border:none;cursor:pointer;color:inherit;opacity:.75;transition:opacity var(--transition-speed-fast) var(--transition-timing);line-height:1}.badge__close:hover{opacity:1}.badge__close:focus{outline:none;opacity:1}";
4
+ var f = Object.defineProperty, m = Object.getOwnPropertyDescriptor, r = (t, s, i, n) => {
5
+ for (var o = n > 1 ? void 0 : n ? m(s, i) : s, l = t.length - 1, c; l >= 0; l--)
6
+ (c = t[l]) && (o = (n ? c(s, i, o) : c(o)) || o);
7
+ return n && o && f(s, i, o), o;
8
+ };
9
+ let e = class extends p {
10
+ constructor() {
11
+ super(...arguments), this.variant = "default", this.size = "default", this.text = "", this.closeable = !1, this.isRound = !1;
12
+ }
13
+ handleClose() {
14
+ this.onClose && this.onClose(), this.dispatchEvent(
15
+ new CustomEvent("close", {
16
+ bubbles: !0,
17
+ composed: !0
18
+ })
19
+ );
20
+ }
21
+ getBadgeClasses() {
22
+ const t = [
23
+ "badge",
24
+ `badge--${this.variant}`,
25
+ this.size === "small" ? "badge--small" : "badge--default-size"
26
+ ];
27
+ return this.isRound && t.push("badge--round"), t.join(" ");
28
+ }
29
+ render() {
30
+ return g`
31
+ <div class="${this.getBadgeClasses()}">
32
+ <slot></slot>
33
+ ${this.text ? g`<span>${this.text}</span>` : d}
34
+ ${this.closeable ? g`
35
+ <button class="badge__close" @click=${this.handleClose} aria-label="Close">
36
+ <ui-icon name="uil-times"></ui-icon>
37
+ </button>
38
+ ` : d}
39
+ </div>
40
+ `;
41
+ }
42
+ };
43
+ e.styles = [
44
+ b`
45
+ ${u(h)}
46
+ `
47
+ ];
48
+ r([
49
+ a({ type: String })
50
+ ], e.prototype, "variant", 2);
51
+ r([
52
+ a({ type: String })
53
+ ], e.prototype, "size", 2);
54
+ r([
55
+ a({ type: String })
56
+ ], e.prototype, "text", 2);
57
+ r([
58
+ a({ type: Boolean })
59
+ ], e.prototype, "closeable", 2);
60
+ r([
61
+ a({ type: Boolean })
62
+ ], e.prototype, "isRound", 2);
63
+ r([
64
+ a({ attribute: !1 })
65
+ ], e.prototype, "onClose", 2);
66
+ e = r([
67
+ v("logosphere-badge")
68
+ ], e);
69
+ export {
70
+ e as L
71
+ };
package/dist/badge.cjs ADDED
@@ -0,0 +1 @@
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./badge-BbhaO73N.cjs");Object.defineProperty(exports,"LogosphereBadge",{enumerable:!0,get:()=>e.LogosphereBadge});
package/dist/badge.js ADDED
@@ -0,0 +1,4 @@
1
+ import { L as r } from "./badge-DE7Tgd8Z.js";
2
+ export {
3
+ r as LogosphereBadge
4
+ };
package/dist/breadcrumb-B-4yqoJZ.js ADDED
@@ -0,0 +1,41 @@
1
+ import { LitElement as b, html as t, unsafeCSS as m, css as p } from "lit";
2
+ import { property as v, customElement as u } from "lit/decorators.js";
3
+ const f = ".breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:var(--spacing-2);font-family:var(--font-family-base);font-size:var(--font-size-sm);line-height:var(--line-height-normal);list-style:none;margin:0;padding:0}.breadcrumb__item{display:inline-flex;align-items:center;gap:var(--spacing-2)}.breadcrumb__link{color:var(--color-primary);text-decoration:none;font-weight:var(--font-weight-regular);transition:color var(--transition-speed-fast) var(--transition-timing),text-decoration var(--transition-speed-fast) var(--transition-timing)}.breadcrumb__link:hover{color:var(--color-primary-hover);text-decoration:underline}.breadcrumb__label{color:var(--color-tertiary);font-weight:var(--font-weight-regular)}.breadcrumb__label--active{color:var(--color-emphasis);font-weight:var(--font-weight-medium)}.breadcrumb__separator{color:var(--color-gray-400);-webkit-user-select:none;user-select:none;flex-shrink:0}";
4
+ var _ = Object.defineProperty, d = Object.getOwnPropertyDescriptor, c = (r, a, o, s) => {
5
+ for (var e = s > 1 ? void 0 : s ? d(a, o) : a, i = r.length - 1, l; i >= 0; i--)
6
+ (l = r[i]) && (e = (s ? l(a, o, e) : l(e)) || e);
7
+ return s && e && _(a, o, e), e;
8
+ };
9
+ let n = class extends b {
10
+ constructor() {
11
+ super(...arguments), this.items = [];
12
+ }
13
+ render() {
14
+ return t`
15
+ <nav>
16
+ <ol class="breadcrumb">
17
+ ${this.items.map(
18
+ (r, a) => t`
19
+ <li class="breadcrumb__item">
20
+ ${r.href && !r.active ? t`<a href="${r.href}" class="breadcrumb__link">${r.label}</a>` : t`<span class="breadcrumb__label ${r.active ? "breadcrumb__label--active" : ""}">${r.label}</span>`}
21
+ ${a < this.items.length - 1 ? t`<span class="breadcrumb__separator">/</span>` : ""}
22
+ </li>
23
+ `
24
+ )}
25
+ </ol>
26
+ </nav>
27
+ `;
28
+ }
29
+ };
30
+ n.styles = [
31
+ p`${m(f)}`
32
+ ];
33
+ c([
34
+ v({ type: Array })
35
+ ], n.prototype, "items", 2);
36
+ n = c([
37
+ u("logosphere-breadcrumb")
38
+ ], n);
39
+ export {
40
+ n as B
41
+ };
package/dist/breadcrumb-Cop-B1J7.cjs ADDED
@@ -0,0 +1,12 @@
1
+ "use strict";const e=require("lit"),o=require("lit/decorators.js"),b=".breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:var(--spacing-2);font-family:var(--font-family-base);font-size:var(--font-size-sm);line-height:var(--line-height-normal);list-style:none;margin:0;padding:0}.breadcrumb__item{display:inline-flex;align-items:center;gap:var(--spacing-2)}.breadcrumb__link{color:var(--color-primary);text-decoration:none;font-weight:var(--font-weight-regular);transition:color var(--transition-speed-fast) var(--transition-timing),text-decoration var(--transition-speed-fast) var(--transition-timing)}.breadcrumb__link:hover{color:var(--color-primary-hover);text-decoration:underline}.breadcrumb__label{color:var(--color-tertiary);font-weight:var(--font-weight-regular)}.breadcrumb__label--active{color:var(--color-emphasis);font-weight:var(--font-weight-medium)}.breadcrumb__separator{color:var(--color-gray-400);-webkit-user-select:none;user-select:none;flex-shrink:0}";var m=Object.defineProperty,u=Object.getOwnPropertyDescriptor,c=(l,r,t,s)=>{for(var a=s>1?void 0:s?u(r,t):r,n=l.length-1,i;n>=0;n--)(i=l[n])&&(a=(s?i(r,t,a):i(a))||a);return s&&a&&m(r,t,a),a};exports.Breadcrumb=class extends e.LitElement{constructor(){super(...arguments),this.items=[]}render(){return e.html`
2
+ <nav>
3
+ <ol class="breadcrumb">
4
+ ${this.items.map((r,t)=>e.html`
5
+ <li class="breadcrumb__item">
6
+ ${r.href&&!r.active?e.html`<a href="${r.href}" class="breadcrumb__link">${r.label}</a>`:e.html`<span class="breadcrumb__label ${r.active?"breadcrumb__label--active":""}">${r.label}</span>`}
7
+ ${t<this.items.length-1?e.html`<span class="breadcrumb__separator">/</span>`:""}
8
+ </li>
9
+ `)}
10
+ </ol>
11
+ </nav>
12
+ `}};exports.Breadcrumb.styles=[e.css`${e.unsafeCSS(b)}`];c([o.property({type:Array})],exports.Breadcrumb.prototype,"items",2);exports.Breadcrumb=c([o.customElement("logosphere-breadcrumb")],exports.Breadcrumb);
package/dist/breadcrumb.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./breadcrumb-DCZ5osDp.cjs");Object.defineProperty(exports,"Breadcrumb",{enumerable:!0,get:()=>e.Breadcrumb});
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./breadcrumb-Cop-B1J7.cjs");Object.defineProperty(exports,"Breadcrumb",{enumerable:!0,get:()=>e.Breadcrumb});
package/dist/breadcrumb.js CHANGED
@@ -1,4 +1,4 @@
1
- import { B as e } from "./breadcrumb-B3SE-L47.js";
1
+ import { B as e } from "./breadcrumb-B-4yqoJZ.js";
2
2
  export {
3
3
  e as Breadcrumb
4
4
  };
package/dist/button-C1EwOosO.js ADDED
@@ -0,0 +1,58 @@
1
+ import { LitElement as u, html as b, unsafeCSS as d, css as v } from "lit";
2
+ import { property as a, customElement as g } from "lit/decorators.js";
3
+ const p = '.button{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-family-base);font-weight:var(--font-weight-semibold);border:none;border-radius:var(--radius-base);cursor:pointer;transition:all var(--transition-speed-base) var(--transition-timing);gap:var(--spacing-2);white-space:nowrap;-webkit-user-select:none;user-select:none;outline:none;text-decoration:none;line-height:1}.button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.button:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.button ::slotted(*){display:inline-flex;align-items:center;vertical-align:middle}.button ::slotted(i),.button ::slotted([class^="uil-"]),.button ::slotted([class*=" uil-"]){font-size:inherit;line-height:1;flex-shrink:0}.button--sm{font-size:var(--font-size-sm);padding:var(--spacing-1) var(--spacing-2)}.button--sm.button--icon-only{padding:var(--spacing-1);line-height:16px}.button--md{font-size:var(--font-size-sm);padding:var(--spacing-2) var(--spacing-3)}.button--md.button--icon-only{padding:var(--spacing-2);line-height:16px}.button--lg{font-size:var(--font-size-base);padding:var(--spacing-3) var(--spacing-4)}.button--lg.button--icon-only{padding:var(--spacing-3);line-height:16px}.button--solid.button--primary{background-color:var(--color-primary);color:#fff}.button--solid.button--primary:hover:not(:disabled){background-color:var(--color-primary-hover)}.button--solid.button--primary:active:not(:disabled){background-color:var(--color-primary-active)}.button--solid.button--secondary{background-color:var(--color-secondary);color:#fff}.button--solid.button--secondary:hover:not(:disabled){background-color:var(--color-secondary-hover)}.button--solid.button-secondary:active:not(:disabled){background-color:var(--color-secondary-active)}.button--text.button--secondary{background-color:transparent;color:var(--color-secondary)}.button--solid.button--success{background-color:var(--color-success);color:var(--color-success-text-emphasis)}.button--solid.button--success:hover:not(:disabled){background-color:var(--color-success-hover);color:var(--color-success-text-emphasis)}.button--solid.button--success:active:not(:disabled){background-color:var(--color-success-active);color:var(--color-success-text-emphasis)}.button--solid.button--danger{background-color:var(--color-danger);color:var(--color-danger-text-emphasis)}.button--solid.button--danger:hover:not(:disabled){background-color:var(--color-danger-hover);color:var(--color-danger-text-emphasis)}.button--solid.button--danger:active:not(:disabled){background-color:var(--color-danger-active);color:var(--color-danger-text-emphasis)}.button--solid.button--info{background-color:var(--color-info);color:var(--color-info-text-emphasis)}.button--solid.button--info:hover:not(:disabled){background-color:var(--color-info-hover);color:var(--color-info-text-emphasis)}.button--solid.button--info:active:not(:disabled){background-color:var(--color-info-active);color:var(--color-info-text-emphasis)}.button--solid.button--warning{background-color:var(--color-warning);color:var(--color-warning-text-emphasis)}.button--solid.button--warning:hover:not(:disabled){background-color:var(--color-warning-hover);color:var(--color-warning-text-emphasis)}.button--solid.button--warning:active:not(:disabled){background-color:var(--color-warning-active);color:var(--color-warning-text-emphasis)}.button--outline{border-width:2px;border-style:solid}.button--outline.button--sm{padding:calc(var(--spacing-1) - 2px) calc(var(--spacing-2) - 2px)}.button--outline.button--sm.button--icon-only{padding:calc(var(--spacing-1) - 2px)}.button--outline.button--md{padding:calc(var(--spacing-2) - 2px) calc(var(--spacing-3) - 2px)}.button--outline.button--md.button--icon-only{padding:calc(var(--spacing-2) - 2px)}.button--outline.button--lg{padding:calc(var(--spacing-3) - 2px) calc(var(--spacing-4) - 2px)}.button--outline.button--lg.button--icon-only{padding:calc(var(--spacing-3) - 2px)}.button--outline.button--primary{background-color:transparent;color:var(--color-primary-text-emphasis);border-color:var(--color-border)}.button--outline.button--primary:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-primary)}.button--outline.button--secondary{background-color:transparent;color:var(--color-secondary-text-emphasis);border-color:var(--color-border)}.button--outline.button--secondary:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-secondary)}.button--outline.button--success{background-color:transparent;color:var(--color-success-outline-text-emphasis);border-color:var(--color-border-success)}.button--outline.button--success:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-success-outline-text-emphasis)}.button--outline.button--danger{background-color:transparent;color:var(--color-danger-outline-text-emphasis);border-color:var(--color-border-danger)}.button--outline.button--danger:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-danger-outline-text-emphasis)}.button--outline.button--info{background-color:transparent;color:var(--color-info-outline-text-emphasis);border-color:var(--color-border-info)}.button--outline.button--info:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-info-outline-text-emphasis)}.button--outline.button--warning{background-color:transparent;color:var(--color-warning-text-emphasis);border-color:var(--color-border-warning)}.button--outline.button--warning:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-warning-text-emphasis)}.button--text.button--primary{background-color:transparent;color:var(--color-primary)}.button--text.button--primary:hover:not(:disabled){background-color:var(--color-primary-bg-subtle)}.button--text.button--success{background-color:transparent;color:var(--color-success)}.button--text.button--success:hover:not(:disabled){background-color:var(--color-success-bg-subtle)}.button--text.button--danger{background-color:transparent;color:var(--color-danger)}.button--text.button--danger:hover:not(:disabled){background-color:var(--color-danger-bg-subtle)}.button--text.button--info{background-color:transparent;color:var(--color-info)}.button--text.button--info:hover:not(:disabled){background-color:var(--color-info-bg-subtle)}.button--text.button--warning{background-color:transparent;color:var(--color-warning)}.button--text.button--warning:hover:not(:disabled){background-color:var(--color-warning-bg-subtle)}';
4
+ var h = Object.defineProperty, m = Object.getOwnPropertyDescriptor, r = (n, e, l, c) => {
5
+ for (var t = c > 1 ? void 0 : c ? m(e, l) : e, s = n.length - 1, i; s >= 0; s--)
6
+ (i = n[s]) && (t = (c ? i(e, l, t) : i(t)) || t);
7
+ return c && t && h(e, l, t), t;
8
+ };
9
+ let o = class extends u {
10
+ constructor() {
11
+ super(...arguments), this.variant = "solid", this.size = "md", this.theme = "primary", this.iconOnly = !1, this.disabled = !1;
12
+ }
13
+ getButtonClasses() {
14
+ const n = [
15
+ "button",
16
+ `button--${this.variant}`,
17
+ `button--${this.size}`,
18
+ `button--${this.theme}`
19
+ ];
20
+ return this.iconOnly && n.push("button--icon-only"), n.join(" ");
21
+ }
22
+ render() {
23
+ return b`
24
+ <button
25
+ class="${this.getButtonClasses()}"
26
+ ?disabled="${this.disabled}"
27
+ >
28
+ <slot name="prefix"></slot>
29
+ <slot></slot>
30
+ <slot name="suffix"></slot>
31
+ </button>
32
+ `;
33
+ }
34
+ };
35
+ o.styles = [
36
+ v`${d(p)}`
37
+ ];
38
+ r([
39
+ a({ type: String })
40
+ ], o.prototype, "variant", 2);
41
+ r([
42
+ a({ type: String })
43
+ ], o.prototype, "size", 2);
44
+ r([
45
+ a({ type: String })
46
+ ], o.prototype, "theme", 2);
47
+ r([
48
+ a({ type: Boolean })
49
+ ], o.prototype, "iconOnly", 2);
50
+ r([
51
+ a({ type: Boolean })
52
+ ], o.prototype, "disabled", 2);
53
+ o = r([
54
+ g("logosphere-button")
55
+ ], o);
56
+ export {
57
+ o as B
58
+ };
package/dist/button-CDRccsk9.cjs ADDED
@@ -0,0 +1,10 @@
1
+ "use strict";const a=require("lit"),r=require("lit/decorators.js"),u='.button{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-family-base);font-weight:var(--font-weight-semibold);border:none;border-radius:var(--radius-base);cursor:pointer;transition:all var(--transition-speed-base) var(--transition-timing);gap:var(--spacing-2);white-space:nowrap;-webkit-user-select:none;user-select:none;outline:none;text-decoration:none;line-height:1}.button:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.button:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.button ::slotted(*){display:inline-flex;align-items:center;vertical-align:middle}.button ::slotted(i),.button ::slotted([class^="uil-"]),.button ::slotted([class*=" uil-"]){font-size:inherit;line-height:1;flex-shrink:0}.button--sm{font-size:var(--font-size-sm);padding:var(--spacing-1) var(--spacing-2)}.button--sm.button--icon-only{padding:var(--spacing-1);line-height:16px}.button--md{font-size:var(--font-size-sm);padding:var(--spacing-2) var(--spacing-3)}.button--md.button--icon-only{padding:var(--spacing-2);line-height:16px}.button--lg{font-size:var(--font-size-base);padding:var(--spacing-3) var(--spacing-4)}.button--lg.button--icon-only{padding:var(--spacing-3);line-height:16px}.button--solid.button--primary{background-color:var(--color-primary);color:#fff}.button--solid.button--primary:hover:not(:disabled){background-color:var(--color-primary-hover)}.button--solid.button--primary:active:not(:disabled){background-color:var(--color-primary-active)}.button--solid.button--secondary{background-color:var(--color-secondary);color:#fff}.button--solid.button--secondary:hover:not(:disabled){background-color:var(--color-secondary-hover)}.button--solid.button-secondary:active:not(:disabled){background-color:var(--color-secondary-active)}.button--text.button--secondary{background-color:transparent;color:var(--color-secondary)}.button--solid.button--success{background-color:var(--color-success);color:var(--color-success-text-emphasis)}.button--solid.button--success:hover:not(:disabled){background-color:var(--color-success-hover);color:var(--color-success-text-emphasis)}.button--solid.button--success:active:not(:disabled){background-color:var(--color-success-active);color:var(--color-success-text-emphasis)}.button--solid.button--danger{background-color:var(--color-danger);color:var(--color-danger-text-emphasis)}.button--solid.button--danger:hover:not(:disabled){background-color:var(--color-danger-hover);color:var(--color-danger-text-emphasis)}.button--solid.button--danger:active:not(:disabled){background-color:var(--color-danger-active);color:var(--color-danger-text-emphasis)}.button--solid.button--info{background-color:var(--color-info);color:var(--color-info-text-emphasis)}.button--solid.button--info:hover:not(:disabled){background-color:var(--color-info-hover);color:var(--color-info-text-emphasis)}.button--solid.button--info:active:not(:disabled){background-color:var(--color-info-active);color:var(--color-info-text-emphasis)}.button--solid.button--warning{background-color:var(--color-warning);color:var(--color-warning-text-emphasis)}.button--solid.button--warning:hover:not(:disabled){background-color:var(--color-warning-hover);color:var(--color-warning-text-emphasis)}.button--solid.button--warning:active:not(:disabled){background-color:var(--color-warning-active);color:var(--color-warning-text-emphasis)}.button--outline{border-width:2px;border-style:solid}.button--outline.button--sm{padding:calc(var(--spacing-1) - 2px) calc(var(--spacing-2) - 2px)}.button--outline.button--sm.button--icon-only{padding:calc(var(--spacing-1) - 2px)}.button--outline.button--md{padding:calc(var(--spacing-2) - 2px) calc(var(--spacing-3) - 2px)}.button--outline.button--md.button--icon-only{padding:calc(var(--spacing-2) - 2px)}.button--outline.button--lg{padding:calc(var(--spacing-3) - 2px) calc(var(--spacing-4) - 2px)}.button--outline.button--lg.button--icon-only{padding:calc(var(--spacing-3) - 2px)}.button--outline.button--primary{background-color:transparent;color:var(--color-primary-text-emphasis);border-color:var(--color-border)}.button--outline.button--primary:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-primary)}.button--outline.button--secondary{background-color:transparent;color:var(--color-secondary-text-emphasis);border-color:var(--color-border)}.button--outline.button--secondary:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-secondary)}.button--outline.button--success{background-color:transparent;color:var(--color-success-outline-text-emphasis);border-color:var(--color-border-success)}.button--outline.button--success:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-success-outline-text-emphasis)}.button--outline.button--danger{background-color:transparent;color:var(--color-danger-outline-text-emphasis);border-color:var(--color-border-danger)}.button--outline.button--danger:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-danger-outline-text-emphasis)}.button--outline.button--info{background-color:transparent;color:var(--color-info-outline-text-emphasis);border-color:var(--color-border-info)}.button--outline.button--info:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-info-outline-text-emphasis)}.button--outline.button--warning{background-color:transparent;color:var(--color-warning-text-emphasis);border-color:var(--color-border-warning)}.button--outline.button--warning:hover:not(:disabled){background-color:var(--color-outline-hover);color:var(--color-warning-text-emphasis)}.button--text.button--primary{background-color:transparent;color:var(--color-primary)}.button--text.button--primary:hover:not(:disabled){background-color:var(--color-primary-bg-subtle)}.button--text.button--success{background-color:transparent;color:var(--color-success)}.button--text.button--success:hover:not(:disabled){background-color:var(--color-success-bg-subtle)}.button--text.button--danger{background-color:transparent;color:var(--color-danger)}.button--text.button--danger:hover:not(:disabled){background-color:var(--color-danger-bg-subtle)}.button--text.button--info{background-color:transparent;color:var(--color-info)}.button--text.button--info:hover:not(:disabled){background-color:var(--color-info-bg-subtle)}.button--text.button--warning{background-color:transparent;color:var(--color-warning)}.button--text.button--warning:hover:not(:disabled){background-color:var(--color-warning-bg-subtle)}';var b=Object.defineProperty,d=Object.getOwnPropertyDescriptor,n=(c,o,l,e)=>{for(var t=e>1?void 0:e?d(o,l):o,s=c.length-1,i;s>=0;s--)(i=c[s])&&(t=(e?i(o,l,t):i(t))||t);return e&&t&&b(o,l,t),t};exports.Button=class extends a.LitElement{constructor(){super(...arguments),this.variant="solid",this.size="md",this.theme="primary",this.iconOnly=!1,this.disabled=!1}getButtonClasses(){const o=["button",`button--${this.variant}`,`button--${this.size}`,`button--${this.theme}`];return this.iconOnly&&o.push("button--icon-only"),o.join(" ")}render(){return a.html`
2
+ <button
3
+ class="${this.getButtonClasses()}"
4
+ ?disabled="${this.disabled}"
5
+ >
6
+ <slot name="prefix"></slot>
7
+ <slot></slot>
8
+ <slot name="suffix"></slot>
9
+ </button>
10
+ `}};exports.Button.styles=[a.css`${a.unsafeCSS(u)}`];n([r.property({type:String})],exports.Button.prototype,"variant",2);n([r.property({type:String})],exports.Button.prototype,"size",2);n([r.property({type:String})],exports.Button.prototype,"theme",2);n([r.property({type:Boolean})],exports.Button.prototype,"iconOnly",2);n([r.property({type:Boolean})],exports.Button.prototype,"disabled",2);exports.Button=n([r.customElement("logosphere-button")],exports.Button);
package/dist/button.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./button-BC3KVuTR.cjs");Object.defineProperty(exports,"Button",{enumerable:!0,get:()=>e.Button});
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./button-CDRccsk9.cjs");Object.defineProperty(exports,"Button",{enumerable:!0,get:()=>e.Button});
package/dist/button.js CHANGED
@@ -1,4 +1,4 @@
1
- import { B as r } from "./button-BIx-2Flb.js";
1
+ import { B as r } from "./button-C1EwOosO.js";
2
2
  export {
3
3
  r as Button
4
4
  };
package/dist/card-CUhlTJyJ.js ADDED
@@ -0,0 +1,97 @@
1
+ import { LitElement as h, nothing as s, html as a, unsafeCSS as v, css as b } from "lit";
2
+ import { property as o, customElement as f } from "lit/decorators.js";
3
+ const m = ".card{width:100%;border-radius:var(--radius-base);border:1px solid var(--color-border);overflow:hidden;box-shadow:var(--shadow-base);display:grid;grid-template-rows:auto 1fr auto}.card__header{padding:var(--spacing-4);border-bottom:1px solid var(--color-border)}.card__header--hidden{display:none}.card__title{margin:0;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-body-text);font-family:var(--font-family-base)}.card__body{padding:var(--spacing-4);font-size:var(--font-size-sm);line-height:var(--line-height-normal);font-family:var(--font-family-base)}.card__description{margin:0;color:var(--color-tertiary);font-size:var(--font-size-xs);line-height:var(--line-height-normal)}.card__footer{padding:var(--spacing-4);display:flex;justify-content:flex-end;flex-wrap:wrap;gap:var(--spacing-2);background-color:var(--color-body-bg);border-top:1px solid var(--color-border)}.card__footer--hidden{display:none}";
4
+ var g = Object.defineProperty, u = Object.getOwnPropertyDescriptor, t = (p, i, l, n) => {
5
+ for (var r = n > 1 ? void 0 : n ? u(i, l) : i, d = p.length - 1, c; d >= 0; d--)
6
+ (c = p[d]) && (r = (n ? c(i, l, r) : c(r)) || r);
7
+ return n && r && g(i, l, r), r;
8
+ };
9
+ let e = class extends h {
10
+ constructor() {
11
+ super(...arguments), this.title = "", this.description = "", this.header = !0, this.footer = !0, this.okLabel = "Tamam", this.cancelLabel = "İptal";
12
+ }
13
+ handleOk() {
14
+ this.onOk?.(), this.dispatchEvent(new CustomEvent("ok", { bubbles: !0, composed: !0 }));
15
+ }
16
+ handleCancel() {
17
+ this.onCancel?.(), this.dispatchEvent(new CustomEvent("cancel", { bubbles: !0, composed: !0 }));
18
+ }
19
+ render() {
20
+ return a`
21
+ <div class="card">
22
+ ${this.header ? a`
23
+ <div class="card__header">
24
+ ${this.title ? a`<h3 class="card__title">${this.title}</h3>` : s}
25
+ ${this.description ? a`<p class="card__description">${this.description}</p>` : s}
26
+ <slot name="header"></slot>
27
+ </div>
28
+ ` : s}
29
+
30
+ <div class="card__body">
31
+ <slot></slot>
32
+ </div>
33
+
34
+ ${this.footer ? a`
35
+ <div class="card__footer">
36
+ <slot name="footer"></slot>
37
+ ${this.onOk ? a`
38
+ <logosphere-button
39
+ variant="solid"
40
+ theme="success"
41
+ size="md"
42
+ @click=${this.handleOk}
43
+ >
44
+ ${this.okLabel}
45
+ </logosphere-button>
46
+ ` : s}
47
+ ${this.onCancel ? a`
48
+ <logosphere-button
49
+ variant="solid"
50
+ theme="danger"
51
+ size="md"
52
+ @click=${this.handleCancel}
53
+ >
54
+ ${this.cancelLabel}
55
+ </logosphere-button>
56
+ ` : s}
57
+ </div>
58
+ ` : s}
59
+ </div>
60
+ `;
61
+ }
62
+ };
63
+ e.styles = [
64
+ b`
65
+ ${v(m)}
66
+ `
67
+ ];
68
+ t([
69
+ o({ type: String })
70
+ ], e.prototype, "title", 2);
71
+ t([
72
+ o({ type: String })
73
+ ], e.prototype, "description", 2);
74
+ t([
75
+ o({ type: Boolean })
76
+ ], e.prototype, "header", 2);
77
+ t([
78
+ o({ type: Boolean })
79
+ ], e.prototype, "footer", 2);
80
+ t([
81
+ o({ attribute: !1 })
82
+ ], e.prototype, "onOk", 2);
83
+ t([
84
+ o({ attribute: !1 })
85
+ ], e.prototype, "onCancel", 2);
86
+ t([
87
+ o({ type: String })
88
+ ], e.prototype, "okLabel", 2);
89
+ t([
90
+ o({ type: String })
91
+ ], e.prototype, "cancelLabel", 2);
92
+ e = t([
93
+ f("logosphere-card")
94
+ ], e);
95
+ export {
96
+ e as C
97
+ };
package/dist/card-n8ka8Zk-.cjs ADDED
@@ -0,0 +1,43 @@
1
+ "use strict";const e=require("lit"),t=require("lit/decorators.js"),p=".card{width:100%;border-radius:var(--radius-base);border:1px solid var(--color-border);overflow:hidden;box-shadow:var(--shadow-base);display:grid;grid-template-rows:auto 1fr auto}.card__header{padding:var(--spacing-4);border-bottom:1px solid var(--color-border)}.card__header--hidden{display:none}.card__title{margin:0;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);color:var(--color-body-text);font-family:var(--font-family-base)}.card__body{padding:var(--spacing-4);font-size:var(--font-size-sm);line-height:var(--line-height-normal);font-family:var(--font-family-base)}.card__description{margin:0;color:var(--color-tertiary);font-size:var(--font-size-xs);line-height:var(--line-height-normal)}.card__footer{padding:var(--spacing-4);display:flex;justify-content:flex-end;flex-wrap:wrap;gap:var(--spacing-2);background-color:var(--color-body-bg);border-top:1px solid var(--color-border)}.card__footer--hidden{display:none}";var c=Object.defineProperty,h=Object.getOwnPropertyDescriptor,r=(i,a,n,s)=>{for(var o=s>1?void 0:s?h(a,n):a,d=i.length-1,l;d>=0;d--)(l=i[d])&&(o=(s?l(a,n,o):l(o))||o);return s&&o&&c(a,n,o),o};exports.Card=class extends e.LitElement{constructor(){super(...arguments),this.title="",this.description="",this.header=!0,this.footer=!0,this.okLabel="Tamam",this.cancelLabel="İptal"}handleOk(){this.onOk?.(),this.dispatchEvent(new CustomEvent("ok",{bubbles:!0,composed:!0}))}handleCancel(){this.onCancel?.(),this.dispatchEvent(new CustomEvent("cancel",{bubbles:!0,composed:!0}))}render(){return e.html`
2
+ <div class="card">
3
+ ${this.header?e.html`
4
+ <div class="card__header">
5
+ ${this.title?e.html`<h3 class="card__title">${this.title}</h3>`:e.nothing}
6
+ ${this.description?e.html`<p class="card__description">${this.description}</p>`:e.nothing}
7
+ <slot name="header"></slot>
8
+ </div>
9
+ `:e.nothing}
10
+
11
+ <div class="card__body">
12
+ <slot></slot>
13
+ </div>
14
+
15
+ ${this.footer?e.html`
16
+ <div class="card__footer">
17
+ <slot name="footer"></slot>
18
+ ${this.onOk?e.html`
19
+ <logosphere-button
20
+ variant="solid"
21
+ theme="success"
22
+ size="md"
23
+ @click=${this.handleOk}
24
+ >
25
+ ${this.okLabel}
26
+ </logosphere-button>
27
+ `:e.nothing}
28
+ ${this.onCancel?e.html`
29
+ <logosphere-button
30
+ variant="solid"
31
+ theme="danger"
32
+ size="md"
33
+ @click=${this.handleCancel}
34
+ >
35
+ ${this.cancelLabel}
36
+ </logosphere-button>
37
+ `:e.nothing}
38
+ </div>
39
+ `:e.nothing}
40
+ </div>
41
+ `}};exports.Card.styles=[e.css`
42
+ ${e.unsafeCSS(p)}
43
+ `];r([t.property({type:String})],exports.Card.prototype,"title",2);r([t.property({type:String})],exports.Card.prototype,"description",2);r([t.property({type:Boolean})],exports.Card.prototype,"header",2);r([t.property({type:Boolean})],exports.Card.prototype,"footer",2);r([t.property({attribute:!1})],exports.Card.prototype,"onOk",2);r([t.property({attribute:!1})],exports.Card.prototype,"onCancel",2);r([t.property({type:String})],exports.Card.prototype,"okLabel",2);r([t.property({type:String})],exports.Card.prototype,"cancelLabel",2);exports.Card=r([t.customElement("logosphere-card")],exports.Card);
package/dist/card.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./card-DicvR8K4.cjs");Object.defineProperty(exports,"Card",{enumerable:!0,get:()=>e.Card});
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./card-n8ka8Zk-.cjs");Object.defineProperty(exports,"Card",{enumerable:!0,get:()=>e.Card});
package/dist/card.js CHANGED
@@ -1,4 +1,4 @@
1
- import { C as o } from "./card-DBCQQydI.js";
1
+ import { C as o } from "./card-CUhlTJyJ.js";
2
2
  export {
3
3
  o as Card
4
4
  };