pdap-design-system 1.1.0 → 2.0.0

package/CONTRIBUTING.md

@@ -0,0 +1,34 @@
+# Contributing
+
+## Tech Stack
+
+This is a `Vue` component library. It is built using `Vue3` and the `composition` API with TypeScript. Styles are created using `TailwindCSS`. The library is built using `Vite`. For testing, we use `Vitest`, for linting `eslint`, for formatting `prettier`
+Some helpful resources and reading:
+
+[Vue.js docs](https://vuejs.org/guide/introduction.html)  
+[Vite docs](https://vitejs.dev/guide/)  
+[Vitest docs](https://vitest.dev/guide/)  
+[Vue Testing Handbook](https://lmiller1990.github.io/vue-testing-handbook/v3/)  
+[Tailwind docs](https://tailwindui.com/documentation)  
+[TypeScript docs](https://www.typescriptlang.org/docs/)
+
+### Etiquette
+
+Head to [\#outreach](https://discord.com/channels/828274060034965575/853442226034442260/) in our [Discord](https://discord.gg/vKhDv7nC8B) if you'd like to collect feedback from the wider group.
+
+Test your changes **locally first**, if possible. Include **screenshots with your PR** if you're changing something visual.
+
+### Setup
+
+1. [Clone the repository](https://docs.github.com/en/repositories/creating-and-managing-repositories/cloning-a-repository).
+
+For PDAP staff: Make changes as needed, but consider how widely this is used. Don't merge things until we test the changes.
+
+For the public: This is an internal system, but it could easily be forked and altered to meet your needs. Feel free to share potentially useful things back to us in a Pull Request.
+
+To test the package locally:
+
+1. Run `npm link` from the root of the project directory.
+2. `cd` into the local directory of the app you want to test importing into, then run `npm link pdap-design-system`
+3. This will create a symlink between your local directories, allowing you to test changes in real time without actually publishing to the `npm` registry.
+4. To test publishing your changes, run `npm publish --dry-run`. The console will output the result of the `publish` method, if you had actually called it.

package/README.md

@@ -1,60 +1,50 @@
 # Design System
 
-These are styling resources like CSS and templates for new PDAP microservices or branded web projects.
-
-Open `src/demo.html` to see how things look.
-
-`src/css/global-styles.css` are the styles used across all PDAP applications.
-
-`src/images` are icons and brand assets.
-
-CSS and assets are built to the `dist` directory before each release, so you will access them from there.
+This is a `Vue` component library, styling system, and image asset repository for PDAP-branded client apps.
 
 ## Usage
 
-1. In the project's root directory:
+1. Install the package
 
 ```
 npm install pdap-design-system
 ```
 
-### To import and use CSS from the package
-
-After installing the package, include PDAP styles in a project using one of two strategies.
+2. Import the stylesheet in the app's entrypoint (usually `index.js` or `main.js`, at the root of your project)
 
-1. If the project uses `Vue.js` or another framework that bundles CSS via a build tool like Webpack or Vite, you can import the package directly in your entrypoint js file. So, if your entrypoint is `main.js`, import it in that file like so:
-
-```
-import 'pdap-design-system'
 ```
+// index.js
 
-And voila! You have access to PDAP's design system CSS / images to use in your templates / components:
-
-```
-<button class="button">Say Hello</button>
+import 'pdap-design-system/styles';
 ```
 
+3. Import and use the components
+
 ```
-<img src=node_modules/pdap-design-system/dist/images/{name-of-image}.{png | svg | gif} alt="some descriptive alt text" />
+import { Button, Form } from 'pdap-design-system';
 ```
 
-2. If the project does not have a build tool that bundles CSS for you, you can still include PDAP styles via HTML `link` tags:
+4. If your project is using `TypeScript`, the component props definitions and other types are exposed for import as well.  
+   _n.b. This can be particularly useful for composing `Form` schemas, where `Input` schema objects are defined differently depending on the `type` of input desired._
 
 ```
-  <link href="node_modules/pdap-design-system/dist/css/global-styles.css" rel="stylesheet" type="text/css">
+import { PdapInputTypes } from 'pdap-design-system';
 ```
 
-### To import and use images from the package
+5. See [the component documentation](./doc/components.md) for details on each component's API.
 
-There are also two strategies for including PDAP image assets.
+### About images
 
-1. If the project bundles images via a build tool like Webpack or Vite, you can import the package directly in your entrypoint js file. So, if your entrypoint is `main.js`, import it in that file like so:
+PDAP image assets contained in this repo are built to the `/dist` folder. For convenience an importing alias `/images` has been added.
 
-2. You can then reference images directly from the `node_modules` directory in the same way CSS is imported  
-   _note: If using a bundled framework like Vue.js, images must be imported into the bundle either individually or by importing this entire package, otherwise your app will not know where to look for the path you pass to src_
+```
+import 'pdap-design-system/images/acronym.svg';
+```
+
+Or, if you need them all, you can import all images at the app level. Just remember that if it's imported it gets bundled with your production app, so take care not to import unneeded images.
 
 ```
-  <img src='node_modules/pdap-design-system/dist/images/{name-of-image}.{png | svg | gif}' alt='some descriptive alt text'>
+import `pdap-design-system/images`;
 ```
 
 ### Using the CLI to copy assets to your local project directory
@@ -98,35 +88,31 @@ npm i
 npm run build
 ```
 
-- To watch for changes and update css as you make changes:
+- To watch for changes and update the build as you make changes:
 
 ```
-npm run styles:watch
+npm run build:watch
 ```
 
 4. If you use VS Code as your editor, you may want to install the [tailwind VS Code extension](https://marketplace.visualstudio.com/items?itemName=bradlc.vscode-tailwindcss), which helps with intellisense and the custom at-rules used by TailwindCSS.
 
 5. Read the [contributing guide](./CONTRIBUTING.md) for development requirements and tips.
 
-## Principles
-
-This is a first pass, so they're not etched in stone. Open to suggestions.
-
-We are making tools for transparency about a serious subject. We should be focused, friendly, and open.
-
-- Our design should take accessibility seriously.
-- Keep it simple: things should not do anything they don't need to do.
-- We should keep our users informed and in control with timely, relevant feedback.
-- Things that look the same should behave in the same way, and an action should always produce the same result.
-- Don't reinvent the wheel: use standard conventions and cues.
-- Provide help to people in context, not in the docs.
-- Establish good visual hierarchy by ensuring each page and object has a primary function.
-
 ## Assets
 
 Use these [brand assets](https://docs.pdap.io/meta/about/staff/brand-assets).
 Use this [terminology](https://docs.pdap.io/activities/terms-and-definitions).
 
-## Other notes
-
-This is based on the PDAP website, which was originally created in Webflow. That might explain some of the CSS browser compatibility choices.
+## Scripts reference
+
+| Script         | What it does                                    |
+| -------------- | ----------------------------------------------- |
+| `build`        | Builds the library                              |
+| `build:watch`  | Builds the library and watches for file changes |
+| `clean`        | Removes testing coverage reports after build    |
+| `lint`         | Lint `ts` and `css`                             |
+| `lint:es`      | Lint `ts`                                       |
+| `lint:css`     | Lint `css`                                      |
+| `test`         | Runs full test suite                            |
+| `test:changed` | Runs only test suites affected by changed files |
+| `types`        | Runs type check on all `ts` and `vue` files     |

package/bin/pdap-design-system-cli.js

@@ -1,23 +1,27 @@
 #!/usr/bin/env node
+import minimist from 'minimist';
+import cli from '../src/cli/index.js';
 
-const cli = require('../src/cli');
-
-// Convert argv to object keyed by arg name where --{argName}
-const args = require('minimist')(process.argv);
+// Convert argv to object keyed by argName where --argName is what is passed to CLI
+const args = minimist(process.argv);
 
 switch (true) {
 	case args['copy-assets']:
-		return cli.copyAllAssets(args);
+		cli.copyAllAssets(args);
+		break;
 	case args['copy-images']:
-		return cli.copyImageAssets(args);
+		cli.copyImageAssets(args);
+		break;
 	case args['copy-styles']:
-		return cli.copyStyleAssets(args);
+		cli.copyStyleAssets(args);
+		break;
 	default:
-		return console.log(
+		console.log(
 			'No option argument was passed to pdap-design-system CLI.',
 			'\n Current options are:',
 			'\n --copy-assets: Copy all assets to assets/ (default) or custom path passed to optional --to argument.',
 			'\n --copy-images: Copy only image assets to assets/ (default) or custom path passed to optional --to argument.',
 			'\n --copy-styles: Copy only CSS assets to assets/ (default) or custom path passed to optional --to argument.'
 		);
+		break;
 }

package/dist/components/Button/PdapButton.vue.d.ts

@@ -0,0 +1,36 @@
+import { PdapButtonProps } from './types';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapButtonProps>, {
+    intent: string;
+    isLoading: boolean;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapButtonProps>, {
+    intent: string;
+    isLoading: boolean;
+}>>>, {
+    intent: "primary" | "secondary";
+    isLoading: boolean;
+}, {}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Button/index.d.ts

@@ -0,0 +1,2 @@
+import PdapButton from './PdapButton.vue';
+export { PdapButton as Button };

package/dist/components/Button/types.d.ts

@@ -0,0 +1,4 @@
+export interface PdapButtonProps {
+    intent?: 'primary' | 'secondary';
+    isLoading?: boolean;
+}

package/dist/components/FlexContainer/FlexContainer.vue.d.ts

@@ -0,0 +1,36 @@
+import { PdapFlexContainerProps } from './types';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapFlexContainerProps>, {
+    alignment: string;
+    component: string;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapFlexContainerProps>, {
+    alignment: string;
+    component: string;
+}>>>, {
+    alignment: "center" | "start";
+    component: string;
+}, {}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/FlexContainer/index.d.ts

@@ -0,0 +1,2 @@
+import FlexContainer from './FlexContainer.vue';
+export { FlexContainer };

package/dist/components/FlexContainer/types.d.ts

@@ -0,0 +1,4 @@
+export interface PdapFlexContainerProps {
+    alignment?: 'center' | 'start';
+    component?: string;
+}

package/dist/components/Footer/PdapFooter.vue.d.ts

@@ -0,0 +1,29 @@
+import { PdapFooterProps } from './types';
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapFooterProps>, {
+    logoImageSrc: string;
+    logoImageAnchorPath: string;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapFooterProps>, {
+    logoImageSrc: string;
+    logoImageAnchorPath: string;
+}>>>, {
+    logoImageSrc: string;
+    logoImageAnchorPath: string;
+}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/components/Footer/index.d.ts

@@ -0,0 +1,2 @@
+import PdapFooter from './PdapFooter.vue';
+export { PdapFooter as Footer };

package/dist/components/Footer/types.d.ts

@@ -0,0 +1,9 @@
+export interface PdapFooterSocialLinks {
+    href?: string;
+    path?: string;
+    text: string;
+}
+export interface PdapFooterProps {
+    logoImageSrc?: string;
+    logoImageAnchorPath?: string;
+}

package/dist/components/Form/InputsGenerator/FormInputsGenerator.vue.d.ts

@@ -0,0 +1,37 @@
+import { PropType } from 'vue';
+import { PdapFormSchema } from '../types.ts';
+declare const _default: import("vue").DefineComponent<{
+    schema: {
+        type: PropType<PdapFormSchema>;
+    };
+    values: {
+        type: PropType<Record<string, unknown>>;
+    };
+    v$: {
+        type: PropType<import("@vuelidate/core").Validation<{}, Record<string, unknown>>>;
+    };
+}, void, {
+    formData: Record<string, unknown>;
+    INPUT_COMPONENT_MAP: {
+        checkbox: string;
+        text: string;
+    };
+    v: import("@vuelidate/core").Validation<{}, Record<string, unknown>> | undefined;
+}, {}, {
+    updateForm(fieldName: string, value: unknown): void;
+    updateValidations(fieldName: string): void;
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("input" | "blur")[], "input" | "blur", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    schema: {
+        type: PropType<PdapFormSchema>;
+    };
+    values: {
+        type: PropType<Record<string, unknown>>;
+    };
+    v$: {
+        type: PropType<import("@vuelidate/core").Validation<{}, Record<string, unknown>>>;
+    };
+}>> & {
+    onBlur?: ((...args: any[]) => any) | undefined;
+    onInput?: ((...args: any[]) => any) | undefined;
+}, {}, {}>;
+export default _default;

package/dist/components/Form/InputsGenerator/index.d.ts

@@ -0,0 +1,2 @@
+import FormInputsGenerator from './FormInputsGenerator.vue';
+export { FormInputsGenerator };

package/dist/components/Form/PdapForm.vue.d.ts

@@ -0,0 +1,39 @@
+import { PdapFormProps } from './types';
+declare const v$: import("vue").Ref<import("@vuelidate/core").Validation<{}, Record<string, unknown>>>;
+export type VuelidateInstance = typeof v$.value;
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapFormProps>, {
+    error: null;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    submit: (...args: any[]) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapFormProps>, {
+    error: null;
+}>>> & {
+    onSubmit?: ((...args: any[]) => any) | undefined;
+}, {
+    error: string | null;
+}, {}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/Form/index.d.ts

@@ -0,0 +1,2 @@
+import PdapForm from './PdapForm.vue';
+export { PdapForm as Form };

package/dist/components/Form/types.d.ts

@@ -0,0 +1,35 @@
+import { PdapInputCheckboxProps, PdapInputTextProps } from '../Input/types';
+export type PdapLengthRules = 'maxLength' | 'minLength';
+export interface PdapFormValidator<T> {
+    message?: string;
+    value: T;
+}
+/**
+ * Keyed by currently used validators.
+ * Add any Vuelidate validators or custom ones here as we need them.
+ * See https://vuelidate-next.netlify.app/validators.html#using-builtin-validators for more.
+ *
+ */
+export interface PdapFormValidators {
+    maxLength: PdapFormValidator<number>;
+    minLength: PdapFormValidator<number>;
+    required: PdapFormValidator<boolean>;
+}
+export interface PdapFormSchemaEntryInputCheckbox extends PdapInputCheckboxProps {
+    validators?: Partial<PdapFormValidators>;
+}
+export interface PdapFormSchemaEntryInputText extends PdapInputTextProps {
+    validators?: Partial<PdapFormValidators>;
+}
+export type PdapFormSchemaEntry = PdapFormSchemaEntryInputCheckbox | PdapFormSchemaEntryInputText;
+export type PdapFormSchema = PdapFormSchemaEntry[];
+export type PdapFormData = Record<string, unknown>;
+/**
+ * PDAP Form props interface.
+ */
+export interface PdapFormProps {
+    error?: string | undefined | null;
+    id: string;
+    name: string;
+    schema: PdapFormSchema;
+}

package/dist/components/GridContainer/GridContainer.vue.d.ts

@@ -0,0 +1,39 @@
+import { PdapGridContainerProps } from './types';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapGridContainerProps>, {
+    columns: string;
+    component: string;
+    rows: string;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapGridContainerProps>, {
+    columns: string;
+    component: string;
+    rows: string;
+}>>>, {
+    component: string;
+    columns: 1 | 2 | 3 | "auto";
+    rows: number | "auto";
+}, {}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/GridContainer/index.d.ts

@@ -0,0 +1,2 @@
+import GridContainer from './GridContainer.vue';
+export { GridContainer };

package/dist/components/GridContainer/types.d.ts

@@ -0,0 +1,7 @@
+export interface PdapGridContainerProps {
+    columns?: 1 | 2 | 3 | 'auto';
+    component?: string;
+    rows?: number | 'auto';
+    templateColumns?: string;
+    templateRows?: string;
+}

package/dist/components/GridItem/GridItem.vue.d.ts

@@ -0,0 +1,39 @@
+import { PdapGridItemProps } from './types';
+declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapGridItemProps>, {
+    component: string;
+    spanColumn: number;
+    spanRow: number;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapGridItemProps>, {
+    component: string;
+    spanColumn: number;
+    spanRow: number;
+}>>>, {
+    component: string;
+    spanColumn: 1 | 2 | 3;
+    spanRow: number;
+}, {}>, {
+    default?(_: {}): any;
+}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};
+type __VLS_WithTemplateSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/GridItem/index.d.ts

@@ -0,0 +1,2 @@
+import GridItem from './GridItem.vue';
+export { GridItem };

package/dist/components/GridItem/types.d.ts

@@ -0,0 +1,5 @@
+export interface PdapGridItemProps {
+    component?: string;
+    spanColumn?: 1 | 2 | 3;
+    spanRow?: number;
+}

package/dist/components/Header/PdapHeader.vue.d.ts

@@ -0,0 +1,29 @@
+import { PdapHeaderProps } from './types';
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapHeaderProps>, {
+    logoImageSrc: string;
+    logoImageAnchorPath: string;
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapHeaderProps>, {
+    logoImageSrc: string;
+    logoImageAnchorPath: string;
+}>>>, {
+    logoImageSrc: string;
+    logoImageAnchorPath: string;
+}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/components/Header/index.d.ts

@@ -0,0 +1,2 @@
+import PdapHeader from './PdapHeader.vue';
+export { PdapHeader as Header };

package/dist/components/Header/types.d.ts

@@ -0,0 +1,4 @@
+export interface PdapHeaderProps {
+    logoImageSrc?: string;
+    logoImageAnchorPath?: string;
+}

package/dist/components/Input/Checkbox/InputCheckbox.vue.d.ts

@@ -0,0 +1,24 @@
+import { PdapInputCheckboxProps } from '../types';
+declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapInputCheckboxProps>, {}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    change: (val: string) => void;
+}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapInputCheckboxProps>, {}>>> & {
+    onChange?: ((val: string) => any) | undefined;
+}, {}, {}>;
+export default _default;
+type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
+type __VLS_TypePropsToRuntimeProps<T> = {
+    [K in keyof T]-?: {} extends Pick<T, K> ? {
+        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
+    } : {
+        type: import('vue').PropType<T[K]>;
+        required: true;
+    };
+};
+type __VLS_WithDefaults<P, D> = {
+    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
+        default: D[K];
+    }> : P[K];
+};
+type __VLS_Prettify<T> = {
+    [K in keyof T]: T[K];
+} & {};

package/dist/components/Input/Checkbox/index.d.ts

@@ -0,0 +1,2 @@
+import InputCheckbox from './InputCheckbox.vue';
+export { InputCheckbox };