react-ui89 0.4.1 → 0.5.0
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.
- package/dist/esm/components/Ui89Card.d.ts +6 -0
- package/dist/esm/components/Ui89Card.stories.d.ts +6 -0
- package/dist/esm/components/Ui89Scene.d.ts +6 -0
- package/dist/esm/components/Ui89Scene.stories.d.ts +7 -0
- package/dist/esm/components/Ui89Shortcut.d.ts +6 -0
- package/dist/esm/components/Ui89Shortcut.stories.d.ts +6 -0
- package/dist/esm/components/Ui89SpaceVertical.d.ts +4 -0
- package/dist/esm/components/Ui89SpaceVertical.stories.d.ts +6 -0
- package/dist/esm/components/Ui89TabbedCard.d.ts +12 -0
- package/dist/esm/components/Ui89TabbedCard.stories.d.ts +7 -0
- package/dist/esm/components/Ui89Tabs.d.ts +9 -0
- package/dist/esm/components/Ui89Tabs.stories.d.ts +7 -0
- package/dist/esm/components/Ui89TagBox.d.ts +6 -0
- package/dist/esm/components/Ui89TagBox.stories.d.ts +11 -0
- package/dist/esm/index.css +1 -1
- package/dist/esm/index.css.map +1 -1
- package/dist/esm/index.d.ts +4 -1
- package/dist/esm/index.js +70 -27
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/storybook/BackgroundDecorator.d.ts +2 -0
- package/dist/esm/storybook/SceneDecorator.d.ts +2 -0
- package/package.json +4 -2
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { Ui89Scene } from "./Ui89Scene";
|
|
3
|
+
declare const meta: Meta<typeof Ui89Scene>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof meta>;
|
|
6
|
+
export declare const LookMain: Story;
|
|
7
|
+
export declare const LookSide: Story;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import React from "react";
|
|
2
|
+
export interface Ui89TabbedCardProps {
|
|
3
|
+
selected?: string;
|
|
4
|
+
onChange?: (value: string) => void;
|
|
5
|
+
items?: Ui89TabbedCardPropsItem[];
|
|
6
|
+
}
|
|
7
|
+
export interface Ui89TabbedCardPropsItem {
|
|
8
|
+
value: string;
|
|
9
|
+
label: string;
|
|
10
|
+
render: () => React.JSX.Element;
|
|
11
|
+
}
|
|
12
|
+
export declare function Ui89TabbedCard({ selected, onChange, items, }: Ui89TabbedCardProps): React.JSX.Element;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { Ui89TabbedCard } from "./Ui89TabbedCard";
|
|
3
|
+
declare const meta: Meta<typeof Ui89TabbedCard>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof meta>;
|
|
6
|
+
export declare const NothingSelected: Story;
|
|
7
|
+
export declare const Selected: Story;
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { Ui89Tabs } from "./Ui89Tabs";
|
|
3
|
+
declare const meta: Meta<typeof Ui89Tabs>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof meta>;
|
|
6
|
+
export declare const NothingSelected: Story;
|
|
7
|
+
export declare const Selected: Story;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import type { Meta, StoryObj } from "@storybook/react";
|
|
2
|
+
import { Ui89TagBox } from "./Ui89TagBox";
|
|
3
|
+
declare const meta: Meta<typeof Ui89TagBox>;
|
|
4
|
+
export default meta;
|
|
5
|
+
type Story = StoryObj<typeof meta>;
|
|
6
|
+
export declare const ThemePrimary: Story;
|
|
7
|
+
export declare const ThemeSecondary: Story;
|
|
8
|
+
export declare const ThemeSuccess: Story;
|
|
9
|
+
export declare const ThemeDanger: Story;
|
|
10
|
+
export declare const ThemeInfo: Story;
|
|
11
|
+
export declare const ThemeWarning: Story;
|
package/dist/esm/index.css
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
:root{--ui89-palette-black:#000;--ui89-palette-dark-blue:#00a;--ui89-palette-dark-green:#0a0;--ui89-palette-dark-cyan:#0aa;--ui89-palette-dark-red:#a00;--ui89-palette-dark-pink:#a0a;--ui89-palette-dark-yellow:#a50;--ui89-palette-light-gray:#aaa;--ui89-palette-dark-gray:#555;--ui89-palette-light-blue:#5454ff;--ui89-palette-light-green:#5f5;--ui89-palette-light-cyan:#5ff;--ui89-palette-light-red:#f55;--ui89-palette-light-pink:#f5f;--ui89-palette-light-yellow:#ff5;--ui89-palette-white:#fff;--ui89-theme-primary-text-color:var(--ui89-palette-black);--ui89-theme-primary-bg-color:var(--ui89-palette-light-yellow);--ui89-theme-secondary-text-color:var(--ui89-palette-black);--ui89-theme-secondary-bg-color:var(--ui89-palette-white);--ui89-theme-success-text-color:var(--ui89-palette-white);--ui89-theme-success-bg-color:var(--ui89-palette-dark-green);--ui89-theme-info-text-color:var(--ui89-palette-white);--ui89-theme-info-bg-color:var(--ui89-palette-light-blue);--ui89-theme-warning-text-color:var(--ui89-palette-white);--ui89-theme-warning-bg-color:var(--ui89-palette-dark-yellow);--ui89-theme-danger-text-color:var(--ui89-palette-white);--ui89-theme-danger-bg-color:var(--ui89-palette-dark-red);--ui89-safe-space:8px;--ui89-input-height:32px;--ui89-font-size-huge:32px;--ui89-font-size-big:20px;--ui89-font-size-normal:16px;--ui89-font-size-small:14px;--ui89-font-size-tiny:10px;--ui89-input-bg-color:var(--ui89-palette-black);--ui89-input-text-color:var(--ui89-palette-light-yellow);--ui89-animation-speed:100ms}.
|
|
1
|
+
:root{--ui89-palette-black:#000;--ui89-palette-dark-blue:#00a;--ui89-palette-dark-green:#0a0;--ui89-palette-dark-cyan:#0aa;--ui89-palette-dark-red:#a00;--ui89-palette-dark-pink:#a0a;--ui89-palette-dark-yellow:#a50;--ui89-palette-light-gray:#aaa;--ui89-palette-dark-gray:#555;--ui89-palette-light-blue:#5454ff;--ui89-palette-light-green:#5f5;--ui89-palette-light-cyan:#5ff;--ui89-palette-light-red:#f55;--ui89-palette-light-pink:#f5f;--ui89-palette-light-yellow:#ff5;--ui89-palette-white:#fff;--ui89-theme-primary-text-color:var(--ui89-palette-black);--ui89-theme-primary-bg-color:var(--ui89-palette-light-yellow);--ui89-theme-secondary-text-color:var(--ui89-palette-black);--ui89-theme-secondary-bg-color:var(--ui89-palette-white);--ui89-theme-success-text-color:var(--ui89-palette-white);--ui89-theme-success-bg-color:var(--ui89-palette-dark-green);--ui89-theme-info-text-color:var(--ui89-palette-white);--ui89-theme-info-bg-color:var(--ui89-palette-light-blue);--ui89-theme-warning-text-color:var(--ui89-palette-white);--ui89-theme-warning-bg-color:var(--ui89-palette-dark-yellow);--ui89-theme-danger-text-color:var(--ui89-palette-white);--ui89-theme-danger-bg-color:var(--ui89-palette-dark-red);--ui89-safe-space:8px;--ui89-input-height:32px;--ui89-font-size-huge:32px;--ui89-font-size-big:20px;--ui89-font-size-normal:16px;--ui89-font-size-small:14px;--ui89-font-size-tiny:10px;--ui89-input-bg-color:var(--ui89-palette-black);--ui89-input-text-color:var(--ui89-palette-light-yellow);--ui89-animation-speed:100ms}.Ui89Scene-module_container__J1AN5{background-color:var(--ui89-scene-bg-color);color:var(--ui89-scene-text-color)}.look-module_main__dCtZk{--ui89-scene-text-color:var(--ui89-palette-white);--ui89-scene-text-subtle-color:var(--ui89-palette-light-gray);--ui89-scene-bg-color:var(--ui89-palette-dark-blue);--ui89-scene-highlight-color:#fff3;--ui89-scene-card-bg-color:var(--ui89-palette-dark-blue);--ui89-scene-card-text-color:var(--ui89-palette-white);--ui89-theme-primary-text-color:var(--ui89-palette-white);--ui89-theme-primary-bg-color:var(--ui89-palette-light-blue);--ui89-theme-secondary-text-color:var(--ui89-palette-black);--ui89-theme-secondary-bg-color:var(--ui89-palette-light-gray)}.look-module_side__bCbry{--ui89-scene-text-color:var(--ui89-palette-white);--ui89-scene-text-subtle-color:var(--ui89-palette-dark-gray);--ui89-scene-bg-color:var(--ui89-palette-light-gray);--ui89-scene-highlight-color:#fff3;--ui89-scene-card-bg-color:var(--ui89-palette-light-gray);--ui89-scene-card-text-color:var(--ui89-palette-white);--ui89-theme-primary-text-color:var(--ui89-palette-white);--ui89-theme-primary-bg-color:var(--ui89-palette-light-blue);--ui89-theme-secondary-text-color:var(--ui89-palette-black);--ui89-theme-secondary-bg-color:var(--ui89-palette-white)}.typo-module_big__NWXQv{font-family:monospace;font-size:var(--ui89-font-size-big);line-height:25px}.typo-module_normalBold__6Mx0C,.typo-module_normal__a1-s-{font-family:monospace;font-size:var(--ui89-font-size-normal);line-height:24px}.typo-module_normalBold__6Mx0C{font-weight:700}.typo-module_smallBold__BRDCu,.typo-module_small__cdnMc{font-family:monospace;font-size:var(--ui89-font-size-small);line-height:16px}.typo-module_smallBold__BRDCu{font-weight:700}.typo-module_special__PiPuc{font-family:monospace;font-size:var(--ui89-font-size-small);font-weight:700}.Ui89Button-module_container__V4tWM{display:inline-block}.Ui89Button-module_button__wl9cp{align-items:center;background-color:var(--ui89-chosen-theme-bg-color);border:1px solid #00000010;border-radius:1px;box-sizing:border-box;color:var(--ui89-chosen-theme-text-color);cursor:pointer;display:inline-flex;font-weight:700;justify-content:center;min-width:60px;padding:0 16px;position:relative;text-align:center;transition:transform var(--ui89-animation-speed);user-select:none}.Ui89Button-module_button__wl9cp:before{inset:0;position:absolute}.Ui89Button-module_block__3sGjT{display:flex}.Ui89Button-module_button__wl9cp:hover:not(.Ui89Button-module_disabled__I5nOu):not(.Ui89Button-module_active__ZN0AN):before{background-color:#ffffff40;content:"";cursor:pointer}.Ui89Button-module_active__ZN0AN,.Ui89Button-module_button__wl9cp:active:not(.Ui89Button-module_disabled__I5nOu){transform:translate3d(calc(var(--ui89-safe-space)/2),calc(var(--ui89-safe-space)/2),0)}.Ui89Button-module_button__wl9cp:active:not(.Ui89Button-module_disabled__I5nOu):not(.Ui89Button-module_active__ZN0AN):before{background-color:#00000040;content:none;cursor:pointer}.Ui89Button-module_disabled__I5nOu{cursor:default;opacity:.5}.Ui89Button-module_size--normal__Pht3J{height:22px}.Ui89Button-module_size--small__-4-4v{height:24px}.Ui89Button-module_click__INMSh{inset:0;position:absolute}.Ui89Button-module_active__ZN0AN>.Ui89Button-module_click__INMSh,.Ui89Button-module_button__wl9cp:active:not(.Ui89Button-module_disabled__I5nOu)>.Ui89Button-module_click__INMSh{transform:translate3d(calc(var(--ui89-safe-space)/2*-1),calc(var(--ui89-safe-space)/2*-1),0)}.chosen-theme-module_primary__GwEqU{--ui89-chosen-theme-text-color:var(--ui89-theme-primary-text-color);--ui89-chosen-theme-bg-color:var(--ui89-theme-primary-bg-color)}.chosen-theme-module_secondary__DI5Gk{--ui89-chosen-theme-text-color:var(--ui89-theme-secondary-text-color);--ui89-chosen-theme-bg-color:var(--ui89-theme-secondary-bg-color)}.chosen-theme-module_info__KYP2h{--ui89-chosen-theme-text-color:var(--ui89-theme-info-text-color);--ui89-chosen-theme-bg-color:var(--ui89-theme-info-bg-color)}.chosen-theme-module_success__l3hFS{--ui89-chosen-theme-text-color:var(--ui89-theme-success-text-color);--ui89-chosen-theme-bg-color:var(--ui89-theme-success-bg-color)}.chosen-theme-module_warning__A7IOL{--ui89-chosen-theme-text-color:var(--ui89-theme-warning-text-color);--ui89-chosen-theme-bg-color:var(--ui89-theme-warning-bg-color)}.chosen-theme-module_danger__CZ3Iq{--ui89-chosen-theme-text-color:var(--ui89-theme-danger-text-color);--ui89-chosen-theme-bg-color:var(--ui89-theme-danger-bg-color)}.HoverShadow-module_container__4noUA{display:block;padding-bottom:var(--ui89-safe-space);padding-right:var(--ui89-safe-space);position:relative}.HoverShadow-module_right__p6LK8{height:calc(100% - var(--ui89-safe-space));width:var(--ui89-safe-space)}.HoverShadow-module_bottom__7Hhnr,.HoverShadow-module_right__p6LK8{background:#000;bottom:0;box-sizing:border-box;display:block;position:absolute;right:0;z-index:0}.HoverShadow-module_bottom__7Hhnr{height:var(--ui89-safe-space);width:calc(100% - var(--ui89-safe-space))}.Ui89Shortcut-module_container__L07CL{display:inline-block;height:200px;position:relative;width:200px}.Ui89Shortcut-module_image__f4Hsg{height:160px;width:150px}.Ui89Shortcut-module_shortcutIcon__SjZkr{height:24px;left:130px;position:absolute;top:140px;width:24px}.Ui89TagBox-module_container__2GXMj{background-color:var(--ui89-chosen-theme-bg-color);border-radius:var(--box-border-radius);color:var(--ui89-chosen-theme-text-color);display:inline-block;line-height:1;padding:calc(var(--ui89-safe-space)/2) calc(var(--ui89-safe-space)*2)}
|
|
2
2
|
/*# sourceMappingURL=index.css.map */
|
package/dist/esm/index.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["global.css","Ui89Background.module.css","look.module.css","Ui89Button.module.css","typo.module.css","chosen-theme.module.css","HoverShadow.module.css"],"names":[],"mappings":"AAGA,MAEE,yBAA6B,CAC7B,6BAAiC,CACjC,8BAAkC,CAClC,6BAAiC,CACjC,4BAAgC,CAChC,6BAAiC,CACjC,+BAAmC,CACnC,8BAAkC,CAClC,6BAAiC,CACjC,iCAAkC,CAClC,+BAAmC,CACnC,8BAAkC,CAClC,6BAAiC,CACjC,8BAAkC,CAClC,gCAAoC,CACpC,yBAA6B,CAG7B,yDAA0D,CAC1D,8DAA+D,CAE/D,2DAA4D,CAC5D,yDAA0D,CAE1D,yDAA0D,CAC1D,4DAA6D,CAE7D,sDAAuD,CACvD,yDAA0D,CAE1D,yDAA0D,CAC1D,6DAA8D,CAE9D,wDAAyD,CACzD,yDAA0D,CAG1D,qBAAsB,CACtB,wBAAyB,CAGzB,0BAA2B,CAC3B,yBAA0B,CAC1B,4BAA6B,CAC7B,2BAA4B,CAC5B,0BAA2B,CAG3B,+CAAgD,CAChD,wDAAyD,CAGzD,4BACF,CC1DA,wCACE,6CAA8C,CAC9C,oCACF,CCHA,yBACE,mDAAoD,CACpD,+DAAgE,CAChE,qDAAsD,CACtD,oCAAwD,CACxD,0DAA2D,CAC3D,wDAAyD,CAEzD,yDAA0D,CAC1D,4DAA6D,CAE7D,2DAA4D,CAC5D,8DACF,CAEA,yBACE,mDAAoD,CACpD,8DAA+D,CAC/D,sDAAuD,CACvD,oCAAwD,CACxD,2DAA4D,CAC5D,wDAAyD,CAEzD,yDAA0D,CAC1D,4DAA6D,CAE7D,2DAA4D,CAC5D,yDACF,CC5BA,oCACE,oBACF,CAEA,iCAGE,kBAAmB,CAGnB,kDAAmD,CAQnD,0BAA2B,CAN3B,iBAAkB,CAKlB,qBAAsB,CARtB,yCAA0C,CAgB1C,cAAe,CApBf,mBAAoB,CAQpB,eAAiB,CAPjB,sBAAuB,CAKvB,cAAe,CAGf,cAAe,CASf,iBAAkB,CAPlB,iBAAkB,CAIlB,gDAAiD,CALjD,gBAWF,CAEA,wCAEE,OAAQ,CADR,iBAEF,CAEA,gCACE,YACF,CAEA,4HAEE,0BAA2B,CAD3B,UAAW,CAEX,cACF,CAEA,iHAEE,sFAKF,CAEA,6HAEE,0BAA2B,CAD3B,YAAa,CAEb,cACF,CAEA,mCAEE,cAAe,CADf,UAEF,CAEA,uCACE,WACF,CAEA,sCACE,WACF,CAEA,gCAEE,OAAQ,CADR,iBAEF,CAEA,iLAEE,4FAKF,CCnFA,wBACE,qBAAsB,CACtB,mCAAoC,CACpC,gBACF,CAQA,0DALE,qBAAsB,CACtB,sCAAuC,CACvC,gBAQF,CALA,+BAIE,eACF,CAQA,wDALE,qBAAsB,CACtB,qCAAsC,CACtC,gBAQF,CALA,8BAIE,eACF,CAGA,4BACE,qBAAsB,CACtB,qCAAsC,CACtC,eACF,CCrCA,oCACE,mEAAoE,CACpE,+DACF,CAEA,sCACE,qEAAsE,CACtE,iEACF,CAEA,iCACE,gEAAiE,CACjE,4DACF,CAEA,oCACE,mEAAoE,CACpE,+DACF,CAEA,oCACE,mEAAoE,CACpE,+DACF,CAEA,mCACE,kEAAmE,CACnE,8DACF,CC5BA,qCACE,aAAc,CAEd,qCAAsC,CADtC,oCAAqC,CAErC,iBACF,CAEA,iCAKE,0CAA2C,CAC3C,4BAIF,CAEA,mEAJE,eAAiB,CAJjB,QAAS,CAGT,qBAAsB,CANtB,aAAc,CACd,iBAAkB,CAClB,OAAQ,CAMR,SAaF,CAVA,kCAME,6BAA8B,CAD9B,yCAKF","file":"index.css","sourcesContent":["/*\n * Variables.\n */\n:root {\n /* Leet colors. */\n --ui89-palette-black: #000000;\n --ui89-palette-dark-blue: #0000aa;\n --ui89-palette-dark-green: #00aa00;\n --ui89-palette-dark-cyan: #00aaaa;\n --ui89-palette-dark-red: #aa0000;\n --ui89-palette-dark-pink: #aa00aa;\n --ui89-palette-dark-yellow: #aa5500;\n --ui89-palette-light-gray: #aaaaaa;\n --ui89-palette-dark-gray: #555555;\n --ui89-palette-light-blue: #5454ff;\n --ui89-palette-light-green: #55ff55;\n --ui89-palette-light-cyan: #55ffff;\n --ui89-palette-light-red: #ff5555;\n --ui89-palette-light-pink: #ff55ff;\n --ui89-palette-light-yellow: #ffff55;\n --ui89-palette-white: #ffffff;\n\n /* Themes */\n --ui89-theme-primary-text-color: var(--ui89-palette-black);\n --ui89-theme-primary-bg-color: var(--ui89-palette-light-yellow);\n\n --ui89-theme-secondary-text-color: var(--ui89-palette-black);\n --ui89-theme-secondary-bg-color: var(--ui89-palette-white);\n\n --ui89-theme-success-text-color: var(--ui89-palette-white);\n --ui89-theme-success-bg-color: var(--ui89-palette-dark-green);\n\n --ui89-theme-info-text-color: var(--ui89-palette-white);\n --ui89-theme-info-bg-color: var(--ui89-palette-light-blue);\n\n --ui89-theme-warning-text-color: var(--ui89-palette-white);\n --ui89-theme-warning-bg-color: var(--ui89-palette-dark-yellow);\n\n --ui89-theme-danger-text-color: var(--ui89-palette-white);\n --ui89-theme-danger-bg-color: var(--ui89-palette-dark-red);\n\n /* Size and alignment */\n --ui89-safe-space: 8px;\n --ui89-input-height: 32px;\n\n /* Typography */\n --ui89-font-size-huge: 32px;\n --ui89-font-size-big: 20px;\n --ui89-font-size-normal: 16px;\n --ui89-font-size-small: 14px;\n --ui89-font-size-tiny: 10px;\n\n /* Input box */\n --ui89-input-bg-color: var(--ui89-palette-black);\n --ui89-input-text-color: var(--ui89-palette-light-yellow);\n\n /* Animation */\n --ui89-animation-speed: 100ms;\n}\n",".container {\n background-color: var(--ui89-content-bg-color);\n color: var(--ui89-content-text-color);\n}\n",".main {\n --ui89-content-text-color: var(--ui89-palette-white);\n --ui89-content-text-subtle-color: var(--ui89-palette-light-gray);\n --ui89-content-bg-color: var(--ui89-palette-dark-blue);\n --ui89-content-highlight-color: rgba(255, 255, 255, 0.2);\n --ui89-content-card-bg-color: var(--ui89-palette-dark-blue);\n --ui89-content-card-text-color: var(--ui89-palette-white);\n\n --ui89-theme-primary-text-color: var(--ui89-palette-white);\n --ui89-theme-primary-bg-color: var(--ui89-palette-light-blue);\n\n --ui89-theme-secondary-text-color: var(--ui89-palette-black);\n --ui89-theme-secondary-bg-color: var(--ui89-palette-light-gray);\n}\n\n.side {\n --ui89-content-text-color: var(--ui89-palette-white);\n --ui89-content-text-subtle-color: var(--ui89-palette-dark-gray);\n --ui89-content-bg-color: var(--ui89-palette-light-gray);\n --ui89-content-highlight-color: rgba(255, 255, 255, 0.2);\n --ui89-content-card-bg-color: var(--ui89-palette-light-gray);\n --ui89-content-card-text-color: var(--ui89-palette-white);\n\n --ui89-theme-primary-text-color: var(--ui89-palette-white);\n --ui89-theme-primary-bg-color: var(--ui89-palette-light-blue);\n\n --ui89-theme-secondary-text-color: var(--ui89-palette-black);\n --ui89-theme-secondary-bg-color: var(--ui89-palette-white);\n}\n",".container {\n display: inline-block;\n}\n\n.button {\n display: inline-flex;\n justify-content: center;\n align-items: center; /* align vertical */\n border: 0;\n color: var(--ui89-chosen-theme-text-color);\n background-color: var(--ui89-chosen-theme-bg-color);\n min-width: 60px;\n border-radius: 1px;\n font-weight: bold;\n padding: 0 16px;\n user-select: none;\n text-align: center;\n box-sizing: border-box;\n border: 1px solid #00000010;\n\n transition: transform var(--ui89-animation-speed);\n\n /* For the button active/hover/focus state */\n position: relative;\n\n cursor: pointer;\n}\n\n.button:before {\n position: absolute;\n inset: 0;\n}\n\n.block {\n display: flex;\n}\n\n.button:hover:not(.disabled):not(.active):before {\n content: \"\";\n background-color: #ffffff40;\n cursor: pointer;\n}\n\n.button:active:not(.disabled),\n.active {\n transform: translate3d(\n calc(var(--ui89-safe-space) / 2),\n calc(var(--ui89-safe-space) / 2),\n 0\n );\n}\n\n.button:active:not(.disabled):not(.active):before {\n content: none;\n background-color: #00000040;\n cursor: pointer;\n}\n\n.disabled {\n opacity: 0.5;\n cursor: default;\n}\n\n.size--normal {\n height: 22px;\n}\n\n.size--small {\n height: 24px;\n}\n\n.click {\n position: absolute;\n inset: 0;\n}\n\n.button:active:not(.disabled) > .click,\n.active > .click {\n transform: translate3d(\n calc(var(--ui89-safe-space) / 2 * -1),\n calc(var(--ui89-safe-space) / 2 * -1),\n 0\n );\n}\n",".big {\n font-family: monospace;\n font-size: var(--ui89-font-size-big);\n line-height: 25px;\n}\n\n.normal {\n font-family: monospace;\n font-size: var(--ui89-font-size-normal);\n line-height: 24px;\n}\n\n.normalBold {\n font-family: monospace;\n font-size: var(--ui89-font-size-normal);\n line-height: 24px;\n font-weight: bold;\n}\n\n.small {\n font-family: monospace;\n font-size: var(--ui89-font-size-small);\n line-height: 16px;\n}\n\n.smallBold {\n font-family: monospace;\n font-size: var(--ui89-font-size-small);\n line-height: 16px;\n font-weight: bold;\n}\n\n/* For buttons and such. */\n.special {\n font-family: monospace;\n font-size: var(--ui89-font-size-small);\n font-weight: bold;\n}\n",".primary {\n --ui89-chosen-theme-text-color: var(--ui89-theme-primary-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-primary-bg-color);\n}\n\n.secondary {\n --ui89-chosen-theme-text-color: var(--ui89-theme-secondary-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-secondary-bg-color);\n}\n\n.info {\n --ui89-chosen-theme-text-color: var(--ui89-theme-info-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-info-bg-color);\n}\n\n.success {\n --ui89-chosen-theme-text-color: var(--ui89-theme-success-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-success-bg-color);\n}\n\n.warning {\n --ui89-chosen-theme-text-color: var(--ui89-theme-warning-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-warning-bg-color);\n}\n\n.danger {\n --ui89-chosen-theme-text-color: var(--ui89-theme-danger-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-danger-bg-color);\n}\n",".container {\n display: block;\n padding-right: var(--ui89-safe-space);\n padding-bottom: var(--ui89-safe-space);\n position: relative;\n}\n\n.right {\n display: block;\n position: absolute;\n right: 0;\n bottom: 0;\n height: calc(100% - var(--ui89-safe-space));\n width: var(--ui89-safe-space);\n box-sizing: border-box;\n background: black;\n z-index: 0;\n}\n\n.bottom {\n display: block;\n position: absolute;\n right: 0;\n bottom: 0;\n width: calc(100% - var(--ui89-safe-space));\n height: var(--ui89-safe-space);\n box-sizing: border-box;\n background: black;\n z-index: 0;\n}\n"]}
|
|
1
|
+
{"version":3,"sources":["global.css","Ui89Scene.module.css","look.module.css","typo.module.css","Ui89Button.module.css","chosen-theme.module.css","HoverShadow.module.css","Ui89Shortcut.module.css","Ui89TagBox.module.css"],"names":[],"mappings":"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","file":"index.css","sourcesContent":["/*\n * Variables.\n */\n:root {\n /* Leet colors. */\n --ui89-palette-black: #000000;\n --ui89-palette-dark-blue: #0000aa;\n --ui89-palette-dark-green: #00aa00;\n --ui89-palette-dark-cyan: #00aaaa;\n --ui89-palette-dark-red: #aa0000;\n --ui89-palette-dark-pink: #aa00aa;\n --ui89-palette-dark-yellow: #aa5500;\n --ui89-palette-light-gray: #aaaaaa;\n --ui89-palette-dark-gray: #555555;\n --ui89-palette-light-blue: #5454ff;\n --ui89-palette-light-green: #55ff55;\n --ui89-palette-light-cyan: #55ffff;\n --ui89-palette-light-red: #ff5555;\n --ui89-palette-light-pink: #ff55ff;\n --ui89-palette-light-yellow: #ffff55;\n --ui89-palette-white: #ffffff;\n\n /* Themes */\n --ui89-theme-primary-text-color: var(--ui89-palette-black);\n --ui89-theme-primary-bg-color: var(--ui89-palette-light-yellow);\n\n --ui89-theme-secondary-text-color: var(--ui89-palette-black);\n --ui89-theme-secondary-bg-color: var(--ui89-palette-white);\n\n --ui89-theme-success-text-color: var(--ui89-palette-white);\n --ui89-theme-success-bg-color: var(--ui89-palette-dark-green);\n\n --ui89-theme-info-text-color: var(--ui89-palette-white);\n --ui89-theme-info-bg-color: var(--ui89-palette-light-blue);\n\n --ui89-theme-warning-text-color: var(--ui89-palette-white);\n --ui89-theme-warning-bg-color: var(--ui89-palette-dark-yellow);\n\n --ui89-theme-danger-text-color: var(--ui89-palette-white);\n --ui89-theme-danger-bg-color: var(--ui89-palette-dark-red);\n\n /* Size and alignment */\n --ui89-safe-space: 8px;\n --ui89-input-height: 32px;\n\n /* Typography */\n --ui89-font-size-huge: 32px;\n --ui89-font-size-big: 20px;\n --ui89-font-size-normal: 16px;\n --ui89-font-size-small: 14px;\n --ui89-font-size-tiny: 10px;\n\n /* Input box */\n --ui89-input-bg-color: var(--ui89-palette-black);\n --ui89-input-text-color: var(--ui89-palette-light-yellow);\n\n /* Animation */\n --ui89-animation-speed: 100ms;\n}\n",".container {\n background-color: var(--ui89-scene-bg-color);\n color: var(--ui89-scene-text-color);\n}\n",".main {\n --ui89-scene-text-color: var(--ui89-palette-white);\n --ui89-scene-text-subtle-color: var(--ui89-palette-light-gray);\n --ui89-scene-bg-color: var(--ui89-palette-dark-blue);\n --ui89-scene-highlight-color: rgba(255, 255, 255, 0.2);\n --ui89-scene-card-bg-color: var(--ui89-palette-dark-blue);\n --ui89-scene-card-text-color: var(--ui89-palette-white);\n\n --ui89-theme-primary-text-color: var(--ui89-palette-white);\n --ui89-theme-primary-bg-color: var(--ui89-palette-light-blue);\n\n --ui89-theme-secondary-text-color: var(--ui89-palette-black);\n --ui89-theme-secondary-bg-color: var(--ui89-palette-light-gray);\n}\n\n.side {\n --ui89-scene-text-color: var(--ui89-palette-white);\n --ui89-scene-text-subtle-color: var(--ui89-palette-dark-gray);\n --ui89-scene-bg-color: var(--ui89-palette-light-gray);\n --ui89-scene-highlight-color: rgba(255, 255, 255, 0.2);\n --ui89-scene-card-bg-color: var(--ui89-palette-light-gray);\n --ui89-scene-card-text-color: var(--ui89-palette-white);\n\n --ui89-theme-primary-text-color: var(--ui89-palette-white);\n --ui89-theme-primary-bg-color: var(--ui89-palette-light-blue);\n\n --ui89-theme-secondary-text-color: var(--ui89-palette-black);\n --ui89-theme-secondary-bg-color: var(--ui89-palette-white);\n}\n",".big {\n font-family: monospace;\n font-size: var(--ui89-font-size-big);\n line-height: 25px;\n}\n\n.normal {\n font-family: monospace;\n font-size: var(--ui89-font-size-normal);\n line-height: 24px;\n}\n\n.normalBold {\n font-family: monospace;\n font-size: var(--ui89-font-size-normal);\n line-height: 24px;\n font-weight: bold;\n}\n\n.small {\n font-family: monospace;\n font-size: var(--ui89-font-size-small);\n line-height: 16px;\n}\n\n.smallBold {\n font-family: monospace;\n font-size: var(--ui89-font-size-small);\n line-height: 16px;\n font-weight: bold;\n}\n\n/* For buttons and such. */\n.special {\n font-family: monospace;\n font-size: var(--ui89-font-size-small);\n font-weight: bold;\n}\n",".container {\n display: inline-block;\n}\n\n.button {\n display: inline-flex;\n justify-content: center;\n align-items: center; /* align vertical */\n border: 0;\n color: var(--ui89-chosen-theme-text-color);\n background-color: var(--ui89-chosen-theme-bg-color);\n min-width: 60px;\n border-radius: 1px;\n font-weight: bold;\n padding: 0 16px;\n user-select: none;\n text-align: center;\n box-sizing: border-box;\n border: 1px solid #00000010;\n\n transition: transform var(--ui89-animation-speed);\n\n /* For the button active/hover/focus state */\n position: relative;\n\n cursor: pointer;\n}\n\n.button:before {\n position: absolute;\n inset: 0;\n}\n\n.block {\n display: flex;\n}\n\n.button:hover:not(.disabled):not(.active):before {\n content: \"\";\n background-color: #ffffff40;\n cursor: pointer;\n}\n\n.button:active:not(.disabled),\n.active {\n transform: translate3d(\n calc(var(--ui89-safe-space) / 2),\n calc(var(--ui89-safe-space) / 2),\n 0\n );\n}\n\n.button:active:not(.disabled):not(.active):before {\n content: none;\n background-color: #00000040;\n cursor: pointer;\n}\n\n.disabled {\n opacity: 0.5;\n cursor: default;\n}\n\n.size--normal {\n height: 22px;\n}\n\n.size--small {\n height: 24px;\n}\n\n.click {\n position: absolute;\n inset: 0;\n}\n\n.button:active:not(.disabled) > .click,\n.active > .click {\n transform: translate3d(\n calc(var(--ui89-safe-space) / 2 * -1),\n calc(var(--ui89-safe-space) / 2 * -1),\n 0\n );\n}\n",".primary {\n --ui89-chosen-theme-text-color: var(--ui89-theme-primary-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-primary-bg-color);\n}\n\n.secondary {\n --ui89-chosen-theme-text-color: var(--ui89-theme-secondary-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-secondary-bg-color);\n}\n\n.info {\n --ui89-chosen-theme-text-color: var(--ui89-theme-info-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-info-bg-color);\n}\n\n.success {\n --ui89-chosen-theme-text-color: var(--ui89-theme-success-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-success-bg-color);\n}\n\n.warning {\n --ui89-chosen-theme-text-color: var(--ui89-theme-warning-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-warning-bg-color);\n}\n\n.danger {\n --ui89-chosen-theme-text-color: var(--ui89-theme-danger-text-color);\n --ui89-chosen-theme-bg-color: var(--ui89-theme-danger-bg-color);\n}\n",".container {\n display: block;\n padding-right: var(--ui89-safe-space);\n padding-bottom: var(--ui89-safe-space);\n position: relative;\n}\n\n.right {\n display: block;\n position: absolute;\n right: 0;\n bottom: 0;\n height: calc(100% - var(--ui89-safe-space));\n width: var(--ui89-safe-space);\n box-sizing: border-box;\n background: black;\n z-index: 0;\n}\n\n.bottom {\n display: block;\n position: absolute;\n right: 0;\n bottom: 0;\n width: calc(100% - var(--ui89-safe-space));\n height: var(--ui89-safe-space);\n box-sizing: border-box;\n background: black;\n z-index: 0;\n}\n",".container {\n display: inline-block;\n width: 200px;\n height: 200px;\n\n position: relative;\n}\n\n.image {\n width: 150px;\n height: 160px;\n}\n\n.shortcutIcon {\n position: absolute;\n top: 140px;\n left: 130px;\n width: 24px;\n height: 24px;\n}\n",".container {\n color: var(--ui89-chosen-theme-text-color);\n background-color: var(--ui89-chosen-theme-bg-color);\n\n display: inline-block;\n padding: calc(var(--ui89-safe-space) / 2) calc(var(--ui89-safe-space) * 2);\n border-radius: var(--box-border-radius);\n line-height: 1;\n}\n"]}
|
package/dist/esm/index.d.ts
CHANGED
|
@@ -1,4 +1,7 @@
|
|
|
1
1
|
import "./style/global.css";
|
|
2
2
|
export { Ui89Theme, Ui89Look } from "./theme";
|
|
3
|
-
export {
|
|
3
|
+
export { Ui89Scene } from "./components/Ui89Scene";
|
|
4
4
|
export { Ui89Button } from "./components/Ui89Button";
|
|
5
|
+
export { Ui89Shortcut } from "./components/Ui89Shortcut";
|
|
6
|
+
export { Ui89SpaceVertical } from "./components/Ui89SpaceVertical";
|
|
7
|
+
export { Ui89TagBox } from "./components/Ui89TagBox";
|
package/dist/esm/index.js
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import React__default, { useState } from 'react';
|
|
2
3
|
|
|
3
4
|
var Ui89Theme;
|
|
4
5
|
(function (Ui89Theme) {
|
|
@@ -15,26 +16,26 @@ var Ui89Look;
|
|
|
15
16
|
Ui89Look["side"] = "side";
|
|
16
17
|
})(Ui89Look || (Ui89Look = {}));
|
|
17
18
|
|
|
18
|
-
var
|
|
19
|
+
var styles$3 = {"container":"Ui89Scene-module_container__J1AN5"};
|
|
19
20
|
|
|
20
|
-
var
|
|
21
|
+
var lookStyles = {"main":"look-module_main__dCtZk","side":"look-module_side__bCbry"};
|
|
21
22
|
|
|
22
|
-
|
|
23
|
-
return (React.createElement("div", { className: `${style.container} ${lookStyle[look]}` }, children));
|
|
24
|
-
}
|
|
23
|
+
var typoStyles = {"big":"typo-module_big__NWXQv","normal":"typo-module_normal__a1-s-","normalBold":"typo-module_normalBold__6Mx0C","small":"typo-module_small__cdnMc","smallBold":"typo-module_smallBold__BRDCu","special":"typo-module_special__PiPuc"};
|
|
25
24
|
|
|
26
|
-
|
|
25
|
+
function Ui89Scene({ look = Ui89Look.main, children, }) {
|
|
26
|
+
return (React__default.createElement("div", { className: `${styles$3.container} ${lookStyles[look]} ${typoStyles.normal}` }, children));
|
|
27
|
+
}
|
|
27
28
|
|
|
28
|
-
var
|
|
29
|
+
var styles$2 = {"container":"Ui89Button-module_container__V4tWM","button":"Ui89Button-module_button__wl9cp","block":"Ui89Button-module_block__3sGjT","disabled":"Ui89Button-module_disabled__I5nOu","active":"Ui89Button-module_active__ZN0AN","size--normal":"Ui89Button-module_size--normal__Pht3J","size--small":"Ui89Button-module_size--small__-4-4v","click":"Ui89Button-module_click__INMSh"};
|
|
29
30
|
|
|
30
31
|
var chosenThemeStyles = {"primary":"chosen-theme-module_primary__GwEqU","secondary":"chosen-theme-module_secondary__DI5Gk","info":"chosen-theme-module_info__KYP2h","success":"chosen-theme-module_success__l3hFS","warning":"chosen-theme-module_warning__A7IOL","danger":"chosen-theme-module_danger__CZ3Iq"};
|
|
31
32
|
|
|
32
|
-
var styles = {"container":"HoverShadow-module_container__4noUA","right":"HoverShadow-module_right__p6LK8","bottom":"HoverShadow-module_bottom__7Hhnr"};
|
|
33
|
+
var styles$1 = {"container":"HoverShadow-module_container__4noUA","right":"HoverShadow-module_right__p6LK8","bottom":"HoverShadow-module_bottom__7Hhnr"};
|
|
33
34
|
|
|
34
35
|
function HoverShadow({ children, }) {
|
|
35
|
-
return (
|
|
36
|
-
|
|
37
|
-
|
|
36
|
+
return (React__default.createElement("span", { className: styles$1.container },
|
|
37
|
+
React__default.createElement("span", { className: styles$1.bottom }),
|
|
38
|
+
React__default.createElement("span", { className: styles$1.right }),
|
|
38
39
|
children));
|
|
39
40
|
}
|
|
40
41
|
|
|
@@ -88,30 +89,72 @@ function Ui89Button({ theme = Ui89Theme.primary, size = "normal", block, onClick
|
|
|
88
89
|
}
|
|
89
90
|
}
|
|
90
91
|
let buttonClass = [
|
|
91
|
-
styles$
|
|
92
|
+
styles$2.button,
|
|
92
93
|
typoStyles.special,
|
|
93
94
|
chosenThemeStyles[theme],
|
|
94
|
-
styles$
|
|
95
|
-
activated ? styles$
|
|
96
|
-
block ? styles$
|
|
97
|
-
disabled ? styles$
|
|
98
|
-
clicking ? styles$
|
|
95
|
+
styles$2["size--" + size],
|
|
96
|
+
activated ? styles$2.active : undefined,
|
|
97
|
+
block ? styles$2.block : undefined,
|
|
98
|
+
disabled ? styles$2.disabled : undefined,
|
|
99
|
+
clicking ? styles$2.active : undefined,
|
|
99
100
|
].join(" ");
|
|
100
101
|
if (href) {
|
|
101
|
-
return (
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
102
|
+
return (React__default.createElement("span", { className: styles$2.container },
|
|
103
|
+
React__default.createElement(HoverShadow, null,
|
|
104
|
+
React__default.createElement("a", { className: buttonClass, href: href, onClick: onAnchorClick },
|
|
105
|
+
React__default.createElement("span", { className: styles$2.click }),
|
|
105
106
|
children))));
|
|
106
107
|
}
|
|
107
108
|
else {
|
|
108
|
-
return (
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
109
|
+
return (React__default.createElement("span", { className: styles$2.container },
|
|
110
|
+
React__default.createElement(HoverShadow, null,
|
|
111
|
+
React__default.createElement("button", { className: buttonClass, type: "button", onClick: onButtonClick, disabled: localDisabled },
|
|
112
|
+
React__default.createElement("span", { className: styles$2.click }),
|
|
112
113
|
children))));
|
|
113
114
|
}
|
|
114
115
|
}
|
|
115
116
|
|
|
116
|
-
|
|
117
|
+
var _path, _path2;
|
|
118
|
+
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
119
|
+
const SvgShortcut = props => /*#__PURE__*/React.createElement("svg", _extends({
|
|
120
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
121
|
+
width: 100,
|
|
122
|
+
height: 100
|
|
123
|
+
}, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
|
|
124
|
+
stroke: "#000",
|
|
125
|
+
strokeWidth: 15,
|
|
126
|
+
d: "M80 80 20 20"
|
|
127
|
+
})), _path2 || (_path2 = /*#__PURE__*/React.createElement("path", {
|
|
128
|
+
stroke: "#000",
|
|
129
|
+
strokeLinecap: "round",
|
|
130
|
+
strokeWidth: 15,
|
|
131
|
+
d: "M20 20h30M20 20v30"
|
|
132
|
+
})));
|
|
133
|
+
|
|
134
|
+
var styles = {"container":"Ui89Shortcut-module_container__L07CL","image":"Ui89Shortcut-module_image__f4Hsg","shortcutIcon":"Ui89Shortcut-module_shortcutIcon__SjZkr"};
|
|
135
|
+
|
|
136
|
+
function Ui89Shortcut({ imageUrl, label, onClick = () => { }, }) {
|
|
137
|
+
function onNativeClick() {
|
|
138
|
+
onClick();
|
|
139
|
+
}
|
|
140
|
+
return (React__default.createElement("div", { className: styles.container },
|
|
141
|
+
React__default.createElement("img", { className: styles.image, src: imageUrl, onClick: onNativeClick }),
|
|
142
|
+
React__default.createElement(SvgShortcut, { className: styles.shortcutIcon, width: 16, height: 16 }),
|
|
143
|
+
React__default.createElement("div", { className: `${typoStyles.smallBold}` }, label)));
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
function Ui89SpaceVertical({ gap = 1 }) {
|
|
147
|
+
const style = {
|
|
148
|
+
paddingTop: `calc(var(--ui89-safe-space) * ${gap})`,
|
|
149
|
+
};
|
|
150
|
+
return React__default.createElement("div", { style: style });
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
var style = {"container":"Ui89TagBox-module_container__2GXMj"};
|
|
154
|
+
|
|
155
|
+
function Ui89TagBox({ theme, children, }) {
|
|
156
|
+
return (React__default.createElement("div", { className: `${style.container} ${typoStyles.special} ${chosenThemeStyles[theme]}` }, children));
|
|
157
|
+
}
|
|
158
|
+
|
|
159
|
+
export { Ui89Button, Ui89Look, Ui89Scene, Ui89Shortcut, Ui89SpaceVertical, Ui89TagBox, Ui89Theme };
|
|
117
160
|
//# sourceMappingURL=index.js.map
|
package/dist/esm/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../src/theme.ts","../../src/components/Ui89Background.tsx","../../src/components/HoverShadow.tsx","../../src/components/Ui89Button.tsx"],"sourcesContent":["export enum Ui89Theme {\n primary = \"primary\",\n secondary = \"secondary\",\n info = \"info\",\n success = \"success\",\n warning = \"warning\",\n danger = \"danger\",\n}\n\nexport enum Ui89Look {\n main = \"main\",\n side = \"side\",\n}\n","import React from \"react\"\n\nimport { Ui89Look } from \"../theme\"\n\nimport style from \"./Ui89Background.module.css\"\nimport lookStyle from \"../style/look.module.css\"\n\nexport function Ui89Background({\n look,\n children,\n}: {\n look: Ui89Look | string\n children: React.ReactNode\n}) {\n return (\n <div className={`${style.container} ${lookStyle[look]}`}>{children}</div>\n )\n}\n","import React from \"react\"\nimport styles from \"./HoverShadow.module.css\"\n\nexport default function HoverShadow({\n children,\n}: {\n children: React.ReactNode\n}) {\n return (\n <span className={styles.container}>\n <span className={styles.bottom}></span>\n <span className={styles.right}></span>\n {children}\n </span>\n )\n}\n","import React, { useState } from \"react\"\n\nimport styles from \"./Ui89Button.module.css\"\nimport typoStyles from \"../style/typo.module.css\"\nimport chosenThemeStyles from \"../style/chosen-theme.module.css\"\n\nimport HoverShadow from \"./HoverShadow\"\n\nimport { Ui89Theme } from \"../theme\"\n\ninterface Ui89ButtonProps {\n theme?: Ui89Theme | string\n size?: string\n block?: boolean\n onClick?: () => void | Promise<void>\n href?: string\n children: React.ReactNode\n autoDisableOnClick?: boolean\n disabled?: boolean\n activated?: boolean\n routerPush?: (url: string) => void\n}\n\nexport function Ui89Button({\n theme = Ui89Theme.primary,\n size = \"normal\",\n block,\n onClick,\n href,\n children,\n autoDisableOnClick = true,\n disabled,\n activated,\n routerPush,\n}: Ui89ButtonProps) {\n //const router = useRouter()\n const [clicking, setClicking] = useState(false)\n\n let localDisabled = disabled || (autoDisableOnClick && clicking)\n\n async function onAnchorClick(e: React.MouseEvent<HTMLAnchorElement>) {\n if (localDisabled) {\n // The anchor tag does not support the disabled attribute so we do this.\n return\n }\n\n if (clicking) {\n // No double clicking allowed.\n return\n }\n\n try {\n setClicking(true)\n\n if (href !== undefined) {\n if (href.startsWith(\"/\")) {\n if (routerPush !== undefined) {\n e.preventDefault()\n routerPush(href)\n }\n }\n }\n } finally {\n setClicking(false)\n }\n }\n\n async function onButtonClick(e: React.MouseEvent<HTMLButtonElement>) {\n if (localDisabled) {\n // The anchor tag does not support the disabled attribute so we do this.\n return\n }\n\n if (clicking) {\n // No double clicking allowed.\n return\n }\n\n try {\n setClicking(true)\n\n if (onClick === undefined) {\n // No handler.\n return\n }\n\n await onClick()\n } finally {\n setClicking(false)\n }\n }\n\n let buttonClass = [\n styles.button,\n typoStyles.special,\n chosenThemeStyles[theme],\n styles[\"size--\" + size],\n activated ? styles.active : undefined,\n block ? styles.block : undefined,\n disabled ? styles.disabled : undefined,\n clicking ? styles.active : undefined,\n ].join(\" \")\n\n if (href) {\n return (\n <span className={styles.container}>\n <HoverShadow>\n <a className={buttonClass} href={href} onClick={onAnchorClick}>\n <span className={styles.click}></span>\n {children}\n </a>\n </HoverShadow>\n </span>\n )\n } else {\n return (\n <span className={styles.container}>\n <HoverShadow>\n <button\n className={buttonClass}\n type=\"button\"\n onClick={onButtonClick}\n disabled={localDisabled}\n >\n <span className={styles.click}></span>\n {children}\n </button>\n </HoverShadow>\n </span>\n )\n }\n}\n"],"names":["styles"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../src/theme.ts","../../src/components/Ui89Scene.tsx","../../src/components/HoverShadow.tsx","../../src/components/Ui89Button.tsx","../../src/images/shortcut.svg","../../src/components/Ui89Shortcut.tsx","../../src/components/Ui89SpaceVertical.tsx","../../src/components/Ui89TagBox.tsx"],"sourcesContent":["export enum Ui89Theme {\n primary = \"primary\",\n secondary = \"secondary\",\n info = \"info\",\n success = \"success\",\n warning = \"warning\",\n danger = \"danger\",\n}\n\nexport enum Ui89Look {\n main = \"main\",\n side = \"side\",\n}\n","import React from \"react\"\n\nimport { Ui89Look } from \"../theme\"\n\nimport styles from \"./Ui89Scene.module.css\"\nimport lookStyles from \"../style/look.module.css\"\nimport typoStyles from \"../style/typo.module.css\"\n\nexport function Ui89Scene({\n look = Ui89Look.main,\n children,\n}: {\n look?: Ui89Look | string\n children: React.ReactNode\n}) {\n return (\n <div\n className={`${styles.container} ${lookStyles[look]} ${typoStyles.normal}`}\n >\n {children}\n </div>\n )\n}\n","import React from \"react\"\nimport styles from \"./HoverShadow.module.css\"\n\nexport default function HoverShadow({\n children,\n}: {\n children: React.ReactNode\n}) {\n return (\n <span className={styles.container}>\n <span className={styles.bottom}></span>\n <span className={styles.right}></span>\n {children}\n </span>\n )\n}\n","import React, { useState } from \"react\"\n\nimport styles from \"./Ui89Button.module.css\"\nimport typoStyles from \"../style/typo.module.css\"\nimport chosenThemeStyles from \"../style/chosen-theme.module.css\"\n\nimport HoverShadow from \"./HoverShadow\"\n\nimport { Ui89Theme } from \"../theme\"\n\ninterface Ui89ButtonProps {\n theme?: Ui89Theme | string\n size?: string\n block?: boolean\n onClick?: () => void | Promise<void>\n href?: string\n children: React.ReactNode\n autoDisableOnClick?: boolean\n disabled?: boolean\n activated?: boolean\n routerPush?: (url: string) => void\n}\n\nexport function Ui89Button({\n theme = Ui89Theme.primary,\n size = \"normal\",\n block,\n onClick,\n href,\n children,\n autoDisableOnClick = true,\n disabled,\n activated,\n routerPush,\n}: Ui89ButtonProps) {\n //const router = useRouter()\n const [clicking, setClicking] = useState(false)\n\n let localDisabled = disabled || (autoDisableOnClick && clicking)\n\n async function onAnchorClick(e: React.MouseEvent<HTMLAnchorElement>) {\n if (localDisabled) {\n // The anchor tag does not support the disabled attribute so we do this.\n return\n }\n\n if (clicking) {\n // No double clicking allowed.\n return\n }\n\n try {\n setClicking(true)\n\n if (href !== undefined) {\n if (href.startsWith(\"/\")) {\n if (routerPush !== undefined) {\n e.preventDefault()\n routerPush(href)\n }\n }\n }\n } finally {\n setClicking(false)\n }\n }\n\n async function onButtonClick(e: React.MouseEvent<HTMLButtonElement>) {\n if (localDisabled) {\n // The anchor tag does not support the disabled attribute so we do this.\n return\n }\n\n if (clicking) {\n // No double clicking allowed.\n return\n }\n\n try {\n setClicking(true)\n\n if (onClick === undefined) {\n // No handler.\n return\n }\n\n await onClick()\n } finally {\n setClicking(false)\n }\n }\n\n let buttonClass = [\n styles.button,\n typoStyles.special,\n chosenThemeStyles[theme],\n styles[\"size--\" + size],\n activated ? styles.active : undefined,\n block ? styles.block : undefined,\n disabled ? styles.disabled : undefined,\n clicking ? styles.active : undefined,\n ].join(\" \")\n\n if (href) {\n return (\n <span className={styles.container}>\n <HoverShadow>\n <a className={buttonClass} href={href} onClick={onAnchorClick}>\n <span className={styles.click}></span>\n {children}\n </a>\n </HoverShadow>\n </span>\n )\n } else {\n return (\n <span className={styles.container}>\n <HoverShadow>\n <button\n className={buttonClass}\n type=\"button\"\n onClick={onButtonClick}\n disabled={localDisabled}\n >\n <span className={styles.click}></span>\n {children}\n </button>\n </HoverShadow>\n </span>\n )\n }\n}\n","<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100\" height=\"100\" viewBox=\"0 0 100 100\">\n <!-- Main arrow line -->\n <line x1=\"80\" y1=\"80\" x2=\"20\" y2=\"20\" stroke=\"black\" stroke-width=\"15\" />\n <!-- Left arrowhead -->\n <line x1=\"20\" y1=\"20\" x2=\"50\" y2=\"20\" stroke=\"black\" stroke-width=\"15\" stroke-linecap=\"round\"/>\n <!-- Top arrowhead -->\n <line x1=\"20\" y1=\"20\" x2=\"20\" y2=\"50\" stroke=\"black\" stroke-width=\"15\" stroke-linecap=\"round\"/>\n</svg>\n","import React from \"react\"\n\nimport ShortcutSvg from \"../images/shortcut.svg\"\n\nimport styles from \"./Ui89Shortcut.module.css\"\nimport typoStyles from \"../style/typo.module.css\"\n\nexport function Ui89Shortcut({\n imageUrl,\n label,\n onClick = () => {},\n}: {\n imageUrl: string\n label: string\n onClick?: () => void\n}) {\n function onNativeClick() {\n onClick()\n }\n\n return (\n <div className={styles.container}>\n <img className={styles.image} src={imageUrl} onClick={onNativeClick} />\n\n <ShortcutSvg className={styles.shortcutIcon} width={16} height={16} />\n\n <div className={`${typoStyles.smallBold}`}>{label}</div>\n </div>\n )\n}\n","import React from \"react\"\n\nexport function Ui89SpaceVertical({ gap = 1 }: { gap?: number }) {\n const style = {\n paddingTop: `calc(var(--ui89-safe-space) * ${gap})`,\n }\n\n return <div style={style}></div>\n}\n","import React from \"react\"\n\nimport { Ui89Theme } from \"../theme\"\nimport typoStyles from \"../style/typo.module.css\"\nimport chosenThemeStyles from \"../style/chosen-theme.module.css\"\n\nimport style from \"./Ui89TagBox.module.css\"\n\nexport function Ui89TagBox({\n theme,\n children,\n}: {\n theme: Ui89Theme | string\n children: React.ReactNode\n}) {\n return (\n <div\n className={`${style.container} ${typoStyles.special} ${chosenThemeStyles[theme]}`}\n >\n {children}\n </div>\n )\n}\n"],"names":["React","styles","ShortcutSvg"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-ui89",
|
|
3
3
|
"description": "A collection of components that mimic a style of user interfaces from the 80s.",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.5.0",
|
|
5
5
|
"author": "Daniel Araujo",
|
|
6
6
|
"module": "dist/esm/index.js",
|
|
7
7
|
"files": [
|
|
@@ -51,6 +51,7 @@
|
|
|
51
51
|
"@storybook/react": "^8.4.2",
|
|
52
52
|
"@storybook/react-vite": "^8.4.2",
|
|
53
53
|
"@storybook/test": "^8.4.2",
|
|
54
|
+
"@svgr/rollup": "^8.1.0",
|
|
54
55
|
"@types/react": "^18.3.12",
|
|
55
56
|
"eslint-plugin-storybook": "^0.11.0",
|
|
56
57
|
"prettier": "^3.3.3",
|
|
@@ -60,6 +61,7 @@
|
|
|
60
61
|
"storybook": "^8.4.2",
|
|
61
62
|
"tslib": "^2.8.1",
|
|
62
63
|
"typescript": "^5.6.3",
|
|
63
|
-
"typescript-plugin-css-modules": "^5.1.0"
|
|
64
|
+
"typescript-plugin-css-modules": "^5.1.0",
|
|
65
|
+
"vite-plugin-svgr": "^4.3.0"
|
|
64
66
|
}
|
|
65
67
|
}
|