@bexis2/bexis2-core-ui 0.0.27 → 0.0.28

package/README.md

@@ -1,5 +1,12 @@
 # bexis-core-ui
 
+## v0.0.28
+#### components
+- Page
+  
+#### types
+- Link
+
 ## v0.0.27
 
 ### add

package/dist/components/page/Page.svelte

@@ -1,3 +1,23 @@
-<div class="px-5 grid gap-5">
- <slot/>
-</div>
+<script>export let title = "";
+export let note = "";
+export let links = [];
+</script>
+ 
+ <div class="px-5 grid gap-5" >
+  <h1>{title}</h1>
+  {#if note}
+    <blockquote class="blockquote">{note}</blockquote>
+  {/if}
+
+  <slot name="description" />
+ 
+  {#if links.length>0}
+  <div class="py-5">
+    {#each	links as link}
+     <a class="chip variant-ringed" href={link.url}>{link.label}</a>
+    {/each}
+  </div>
+  {/if}
+  <slot/>
+ </div>
+ 

package/dist/components/page/Page.svelte.d.ts

@@ -1,27 +1,22 @@
-/** @typedef {typeof __propDef.props}  PageProps */
-/** @typedef {typeof __propDef.events}  PageEvents */
-/** @typedef {typeof __propDef.slots}  PageSlots */
-export default class Page extends SvelteComponentTyped<{
-    [x: string]: never;
-}, {
-    [evt: string]: CustomEvent<any>;
-}, {
-    default: {};
-}> {
-}
-export type PageProps = typeof __propDef.props;
-export type PageEvents = typeof __propDef.events;
-export type PageSlots = typeof __propDef.slots;
 import { SvelteComponentTyped } from "svelte";
+import type { Link } from "../../models/Models";
 declare const __propDef: {
     props: {
-        [x: string]: never;
+        title?: string | undefined;
+        note?: string | undefined;
+        links?: Link[] | undefined;
     };
     events: {
         [evt: string]: CustomEvent<any>;
     };
     slots: {
+        description: {};
         default: {};
     };
 };
+export type PageProps = typeof __propDef.props;
+export type PageEvents = typeof __propDef.events;
+export type PageSlots = typeof __propDef.slots;
+export default class Page extends SvelteComponentTyped<PageProps, PageEvents, PageSlots> {
+}
 export {};

package/dist/css/core.ui.postcss

@@ -0,0 +1,10 @@
+/*place global styles here */
+html, body { @apply h-full}
+
+h1{
+ @apply text-primary-500;
+}
+
+:root {
+	--background:rgb(var(--color-surface-200))
+ }

package/dist/index.d.ts

@@ -4,6 +4,7 @@ import FileIcon from './components/file/FileIcon.svelte';
 import FileInfo from './components/file/FileInfo.svelte';
 import FileUploader from './components/file/FileUploader.svelte';
 import Spinner from './components/spinner/Spinner.svelte';
+import Page from './components/page/Page.svelte';
 import Checkbox from './components/form/Checkbox.svelte';
 import CheckboxKVPList from './components/form/CheckboxKvPList.svelte';
 import CheckboxList from './components/form/CheckboxList.svelte';
@@ -19,7 +20,7 @@ import { columnFilter, searchFilter } from './components/Table/filter';
 import type { TableConfig, Columns, Column } from './models/Models';
 export { Checkbox, CheckboxKVPList, CheckboxList, DateInput, DropdownKVP, MultiSelect, NumberInput, TextArea, TextInput };
 export { FileInfo, FileIcon, FileUploader };
-export { ListView, TableView, Spinner };
+export { ListView, TableView, Spinner, Page };
 export { Api } from './services/Api.js';
 export { host, username, password, setApiConfig } from './stores/apistore.js';
 export type { user, Input, FileUploaderModel } from './models/Models.js';

package/dist/index.js

@@ -4,7 +4,10 @@ import TableView from './TableView.svelte';
 import FileIcon from './components/file/FileIcon.svelte';
 import FileInfo from './components/file/FileInfo.svelte';
 import FileUploader from './components/file/FileUploader.svelte';
+//page
 import Spinner from './components/spinner/Spinner.svelte';
+import Page from './components/page/Page.svelte';
+// input 
 import Checkbox from './components/form/Checkbox.svelte';
 import CheckboxKVPList from './components/form/CheckboxKvPList.svelte';
 import CheckboxList from './components/form/CheckboxList.svelte';
@@ -22,7 +25,7 @@ export { Checkbox, CheckboxKVPList, CheckboxList, DateInput, DropdownKVP, MultiS
 //File
 export { FileInfo, FileIcon, FileUploader };
 //others
-export { ListView, TableView, Spinner };
+export { ListView, TableView, Spinner, Page };
 //Api
 export { Api } from './services/Api.js';
 export { host, username, password, setApiConfig } from './stores/apistore.js';

package/dist/models/Models.d.ts

@@ -1,6 +1,10 @@
 import type { SvelteComponent } from 'svelte';
 import type { ColumnFilterFn } from 'svelte-headless-table/lib/plugins';
 import type { Writable } from 'svelte/store';
+export interface Link {
+    label: string;
+    url: string;
+}
 export interface Input {
     id: string;
     label: string;

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@bexis2/bexis2-core-ui",
-  "version": "0.0.27",
+  "version": "0.0.28",
   "private": false,
   "scripts": {
-    "dev": "vite dev --host",
+    "dev": "vite dev",
     "package": "svelte-package --watch",
     "build": "vite build",
     "build package": "svelte-kit sync && svelte-package --watch",
@@ -20,7 +20,7 @@
   },
   "devDependencies": {
     "@playwright/test": "^1.28.1",
-    "@skeletonlabs/skeleton": "^1.2.5",
+    "@skeletonlabs/skeleton": "^1.6.0",
     "@sveltejs/adapter-auto": "^2.0.0",
     "@sveltejs/adapter-static": "^2.0.2",
     "@sveltejs/kit": "^1.5.0",

package/src/lib/components/page/Page.svelte

@@ -1,3 +1,28 @@
-<div class="px-5 grid gap-5">
- <slot/>
-</div>
+<script lang="ts">
+
+  import type { Link } from "$lib/models/Models";
+ 
+  export let title = "";
+  export let note = "";
+  export let links:Link[]=[];
+ 
+ </script>
+ 
+ <div class="px-5 grid gap-5" >
+  <h1>{title}</h1>
+  {#if note}
+    <blockquote class="blockquote">{note}</blockquote>
+  {/if}
+
+  <slot name="description" />
+ 
+  {#if links.length>0}
+  <div class="py-5">
+    {#each	links as link}
+     <a class="chip variant-ringed" href={link.url}>{link.label}</a>
+    {/each}
+  </div>
+  {/if}
+  <slot/>
+ </div>
+ 

package/src/lib/css/core.ui.postcss

@@ -0,0 +1,10 @@
+/*place global styles here */
+html, body { @apply h-full}
+
+h1{
+ @apply text-primary-500;
+}
+
+:root {
+	--background:rgb(var(--color-surface-200))
+ }

package/src/lib/index.ts

@@ -6,8 +6,11 @@ import FileIcon from './components/file/FileIcon.svelte';
 import FileInfo from './components/file/FileInfo.svelte';
 import FileUploader from './components/file/FileUploader.svelte';
 
+//page
 import Spinner from './components/spinner/Spinner.svelte';
+import Page from './components/page/Page.svelte';
 
+// input 
 import Checkbox from './components/form/Checkbox.svelte';
 import CheckboxKVPList from './components/form/CheckboxKvPList.svelte';
 import CheckboxList from './components/form/CheckboxList.svelte';
@@ -40,7 +43,7 @@ export {
 export { FileInfo, FileIcon, FileUploader };
 
 //others
-export { ListView, TableView, Spinner };
+export { ListView, TableView, Spinner, Page };
 
 //Api
 export { Api } from './services/Api.js';

package/src/lib/models/Models.ts

@@ -2,6 +2,14 @@ import type { SvelteComponent } from 'svelte';
 import type { ColumnFilterFn } from 'svelte-headless-table/lib/plugins';
 import type { Writable } from 'svelte/store';
 
+// page
+export interface Link
+{
+	label:string,
+	url:string
+}
+
+// Form
 export interface Input {
 	id: string;
 	label: string;

package/dist/css/core.ui.css

@@ -1,5 +0,0 @@
-/*place global styles here */
-html,
-body {
-	@apply h-full;
-}

package/src/lib/css/core.ui.css

@@ -1,5 +0,0 @@
-/*place global styles here */
-html,
-body {
-	@apply h-full;
-}