Big News: Socket raises $60M Series C at a $1B valuation to secure software supply chains for AI-driven development.Announcement →
Sign In

@leveluptuts/bookit

Package Overview
Dependencies
Maintainers
1
Versions
4
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@leveluptuts/bookit - npm Package Compare versions

Comparing version
0.0.16
 to
0.0.20
+47
docs/Callout.svelte
<script>import BookIcon from '../BookIcon.svelte';
export let type = 'info';
</script>
<div class={type}>
<BookIcon name={type} />
<p>
<slot />
</p>
</div>
<style>
div {
border: 1px solid #82d8d8;
border-radius: 15px;
padding: 20px;
margin-bottom: 20px;
background-color: #82d8d811;
display: flex;
gap: 20px;
}
.info :global(svg) :global(path) {
fill: #82d8d8;
}
.correct {
border: 1px solid #a8fe39;
background-color: #a8fe3911;
}
.correct :global(svg) :global(path) {
fill: #a8fe39;
}
.warning {
border: 1px solid #eb5757;
background-color: #eb575711;
}
.warning :global(svg) :global(path) {
fill: #eb5757;
}
div p {
line-height: 1.5;
}
</style>
+18
docs/Callout.svelte.d.ts
import { SvelteComponentTyped } from "svelte";
declare const __propDef: {
props: {
type?: "warning" | "info" | "correct" | undefined;
};
events: {
[evt: string]: CustomEvent<any>;
};
slots: {
default: {};
};
};
export declare type CalloutProps = typeof __propDef.props;
export declare type CalloutEvents = typeof __propDef.events;
export declare type CalloutSlots = typeof __propDef.slots;
export default class Callout extends SvelteComponentTyped<CalloutProps, CalloutEvents, CalloutSlots> {
}
export {};
+40
docs/Docs.svelte
<div class="bookit-docs">
<slot />
</div>
<style>.bookit-docs {
width: 100%;
color: #fff;
}
:global(h1, h2, h3, h4, h5) {
margin: 3rem 0 1.38rem;
line-height: 1.3;
}
:global(.bookit-docs > h1) {
margin-top: 0;
font-size: 3.052rem;
}
:global(.bookit-docs > h2) {
font-size: 2.441rem;
}
:global(.bookit-docs > h3) {
font-size: 1.953rem;
}
:global(.bookit-docs > h4) {
font-size: 1.563rem;
}
:global(.bookit-docs > h5) {
font-size: 1.25rem;
}
:global(.bookit-docs > p) {
margin-bottom: 1rem;
max-width: 680px;
line-height: 1.5;
}</style>
+23
docs/Docs.svelte.d.ts
/** @typedef {typeof __propDef.props} DocsProps */
/** @typedef {typeof __propDef.events} DocsEvents */
/** @typedef {typeof __propDef.slots} DocsSlots */
export default class Docs extends SvelteComponentTyped<{}, {
[evt: string]: CustomEvent<any>;
}, {
default: {};
}> {
}
export type DocsProps = typeof __propDef.props;
export type DocsEvents = typeof __propDef.events;
export type DocsSlots = typeof __propDef.slots;
import { SvelteComponentTyped } from "svelte";
declare const __propDef: {
props: {};
events: {
[evt: string]: CustomEvent<any>;
};
slots: {
default: {};
};
};
export {};
+103
docs/PropTable.svelte
<script>export let props = {};
export let title = 'Props';
</script>
{#if title}
<h4>{title}</h4>
{/if}
<table>
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th>Description</th>
<th>Default</th>
</tr>
</thead>
<tbody>
{#each Object.entries(props) as [key, data] (key)}
<tr>
<td>
{key}
{#if !data.default}
<svg
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
xmlns="http://www.w3.org/2000/svg"
>
<path d="M9 21.5L17.5 13L13 10L15 2.5L6.5 11L11 14L9 21.5Z" fill="currentColor" />
</svg>
{/if}
</td>
<td>{data.type || ''}</td>
<td>{data.text || ''}</td>
<td>{data.default || ''}</td>
</tr>
{/each}
</tbody>
</table>
<style>
table {
--table_line: inset 0 -1px var(--bookit_line_color);
border: solid 1px var(--bookit_line_color);
border-spacing: 0;
font-family: var(--bodyFont);
font-size: var(--smallFontSize);
border-radius: 5px;
overflow: hidden;
}
td,
th {
font-weight: normal;
padding: 10px;
text-align: left;
}
thead tr {
background-color: var(--bookit_line_color);
box-shadow: var(--table_line);
}
th + th {
border-left: solid 1px var(--bookit_line_color);
}
td + td {
border-left: solid 1px var(--bookit_line_color);
}
td {
position: relative;
}
tr td:first-child {
padding-left: 30px;
}
svg {
position: absolute;
left: 2px;
top: 8px;
}
svg path {
fill: var(--bookit_accent, #f0c05e);
}
tr {
box-shadow: var(--table_line);
transition: 0.3s ease background;
}
tbody tr:last-child {
box-shadow: 0;
}
tr:hover {
background-color: var(--bookit_line_color);
}
</style>
+23
docs/PropTable.svelte.d.ts
import { SvelteComponentTyped } from "svelte";
declare const __propDef: {
props: {
props?: {
[key: string]: {
text: string;
default?: any;
type: string;
};
} | undefined;
title?: string | boolean | undefined;
};
events: {
[evt: string]: CustomEvent<any>;
};
slots: {};
};
export declare type PropTableProps = typeof __propDef.props;
export declare type PropTableEvents = typeof __propDef.events;
export declare type PropTableSlots = typeof __propDef.slots;
export default class PropTable extends SvelteComponentTyped<PropTableProps, PropTableEvents, PropTableSlots> {
}
export {};
+4
-3
index.d.ts

@@ -5,5 +5,6 @@ import Book from './Book.svelte';

import Bookit from './Bookit.svelte';
import Docs from './Docs.svelte';
import Docs from './docs/Docs.svelte';
import Canvas from './Canvas.svelte';
import Callout from './Callout.svelte';
import Callout from './docs/Callout.svelte';
import PropTable from './docs/PropTable.svelte';
export * from './get_story';

@@ -13,2 +14,2 @@ export * from './state';

export * from './layout_load';
export { Book, BookInput, Frame, Bookit, Docs, Canvas, Callout };
export { Book, BookInput, Frame, Bookit, Docs, PropTable, Canvas, Callout };
+4
-3
index.js

@@ -6,5 +6,6 @@ // This file choose what is exposed from Bookit

import Bookit from './Bookit.svelte';
import Docs from './Docs.svelte';
import Docs from './docs/Docs.svelte';
import Canvas from './Canvas.svelte';
import Callout from './Callout.svelte';
import Callout from './docs/Callout.svelte';
import PropTable from './docs/PropTable.svelte';
export * from './get_story';

@@ -14,2 +15,2 @@ export * from './state';

export * from './layout_load';
export { Book, BookInput, Frame, Bookit, Docs, Canvas, Callout };
export { Book, BookInput, Frame, Bookit, Docs, PropTable, Canvas, Callout };
+9
-9
package.json
{
"author": "Scott Tolinski",
"author": "Scott Tolinski | Level Up Tutorials",
"bugs": {

@@ -7,2 +7,4 @@ "url": "https://github.com/leveluptuts/bookit/issues"

"dependencies": {
"@leveluptuts/svelte-side-menu": "1.0.2",
"@leveluptuts/svelte-toy": "2.0.2",
"just-safe-set": "^4.0.2",

@@ -13,3 +15,3 @@ "svelte-splitpanes": "^0.7.1"

"@sveltejs/adapter-static": "1.0.0-next.38",
"@sveltejs/kit": "1.0.0-next.390",
"@sveltejs/kit": "1.0.0-next.392",
"@typescript-eslint/eslint-plugin": "^5.30.7",

@@ -22,3 +24,3 @@ "@typescript-eslint/parser": "^5.30.7",

"prettier-plugin-svelte": "^2.7.0",
"sass": "^1.52.3",
"sass": "^1.54.0",
"svelte": "3.49.0",

@@ -34,8 +36,5 @@ "svelte-check": "^2.7.2",

"name": "@leveluptuts/bookit",
"optionalDependencies": {
"@leveluptuts/svelte-toy": "^2.0.2"
},
"repository": "@leveluptuts/bookit",
"type": "module",
"version": "0.0.16",
"version": "0.0.20",
"exports": {

@@ -50,3 +49,2 @@ "./package.json": "./package.json",

"./Bookit.svelte": "./Bookit.svelte",
"./Callout.svelte": "./Callout.svelte",
"./Canvas.svelte": "./Canvas.svelte",

@@ -56,6 +54,8 @@ "./Code.svelte": "./Code.svelte",

"./ControlsRow.svelte": "./ControlsRow.svelte",
"./Docs.svelte": "./Docs.svelte",
"./Frame.svelte": "./Frame.svelte",
"./FrameControls.svelte": "./FrameControls.svelte",
"./create_tree": "./create_tree.js",
"./docs/Callout.svelte": "./docs/Callout.svelte",
"./docs/Docs.svelte": "./docs/Docs.svelte",
"./docs/PropTable.svelte": "./docs/PropTable.svelte",
"./elements/SideBarHeading.svelte": "./elements/SideBarHeading.svelte",

@@ -62,0 +62,0 @@ "./get_story": "./get_story.js",

+1
-1
README.md

@@ -1,2 +0,2 @@

![Gangsta Boo](./static/lilboo.png)
![Gangsta Boo](./static/icon.png)

@@ -3,0 +3,0 @@ # Bookit

-47
Callout.svelte
<script>import BookIcon from './BookIcon.svelte';
export let type = 'info';
</script>
<div class={type}>
<BookIcon name={type} />
<p>
<slot />
</p>
</div>
<style>
div {
border: 1px solid #82d8d8;
border-radius: 15px;
padding: 20px;
margin-bottom: 20px;
background-color: #82d8d811;
display: flex;
gap: 20px;
}
.info :global(svg) :global(path) {
fill: #82d8d8;
}
.correct {
border: 1px solid #a8fe39;
background-color: #a8fe3911;
}
.correct :global(svg) :global(path) {
fill: #a8fe39;
}
.warning {
border: 1px solid #eb5757;
background-color: #eb575711;
}
.warning :global(svg) :global(path) {
fill: #eb5757;
}
div p {
line-height: 1.5;
}
</style>
-18
Callout.svelte.d.ts
import { SvelteComponentTyped } from "svelte";
declare const __propDef: {
props: {
type?: "warning" | "info" | "correct" | undefined;
};
events: {
[evt: string]: CustomEvent<any>;
};
slots: {
default: {};
};
};
export declare type CalloutProps = typeof __propDef.props;
export declare type CalloutEvents = typeof __propDef.events;
export declare type CalloutSlots = typeof __propDef.slots;
export default class Callout extends SvelteComponentTyped<CalloutProps, CalloutEvents, CalloutSlots> {
}
export {};
-40
Docs.svelte
<div class="bookit-docs">
<slot />
</div>
<style>.bookit-docs {
width: 100%;
color: #fff;
}
:global(h1, h2, h3, h4, h5) {
margin: 3rem 0 1.38rem;
line-height: 1.3;
}
:global(.bookit-docs > h1) {
margin-top: 0;
font-size: 3.052rem;
}
:global(.bookit-docs > h2) {
font-size: 2.441rem;
}
:global(.bookit-docs > h3) {
font-size: 1.953rem;
}
:global(.bookit-docs > h4) {
font-size: 1.563rem;
}
:global(.bookit-docs > h5) {
font-size: 1.25rem;
}
:global(.bookit-docs > p) {
margin-bottom: 1rem;
max-width: 680px;
line-height: 1.5;
}</style>
-23
Docs.svelte.d.ts
/** @typedef {typeof __propDef.props} DocsProps */
/** @typedef {typeof __propDef.events} DocsEvents */
/** @typedef {typeof __propDef.slots} DocsSlots */
export default class Docs extends SvelteComponentTyped<{}, {
[evt: string]: CustomEvent<any>;
}, {
default: {};
}> {
}
export type DocsProps = typeof __propDef.props;
export type DocsEvents = typeof __propDef.events;
export type DocsSlots = typeof __propDef.slots;
import { SvelteComponentTyped } from "svelte";
declare const __propDef: {
props: {};
events: {
[evt: string]: CustomEvent<any>;
};
slots: {
default: {};
};
};
export {};