pdap-design-system 1.1.0 → 2.0.1

Sign up to get free protection for your applications and to get access to all the features.
Files changed (63) hide show
  1. package/CONTRIBUTING.md +34 -0
  2. package/README.md +35 -49
  3. package/bin/pdap-design-system-cli.js +12 -8
  4. package/dist/components/Button/PdapButton.vue.d.ts +36 -0
  5. package/dist/components/Button/index.d.ts +2 -0
  6. package/dist/components/Button/types.d.ts +4 -0
  7. package/dist/components/FlexContainer/FlexContainer.vue.d.ts +36 -0
  8. package/dist/components/FlexContainer/index.d.ts +2 -0
  9. package/dist/components/FlexContainer/types.d.ts +4 -0
  10. package/dist/components/Footer/PdapFooter.vue.d.ts +29 -0
  11. package/dist/components/Footer/index.d.ts +2 -0
  12. package/dist/components/Footer/types.d.ts +9 -0
  13. package/dist/components/Form/InputsGenerator/FormInputsGenerator.vue.d.ts +37 -0
  14. package/dist/components/Form/InputsGenerator/index.d.ts +2 -0
  15. package/dist/components/Form/PdapForm.vue.d.ts +39 -0
  16. package/dist/components/Form/index.d.ts +2 -0
  17. package/dist/components/Form/types.d.ts +35 -0
  18. package/dist/components/GridContainer/GridContainer.vue.d.ts +39 -0
  19. package/dist/components/GridContainer/index.d.ts +2 -0
  20. package/dist/components/GridContainer/types.d.ts +7 -0
  21. package/dist/components/GridItem/GridItem.vue.d.ts +39 -0
  22. package/dist/components/GridItem/index.d.ts +2 -0
  23. package/dist/components/GridItem/types.d.ts +5 -0
  24. package/dist/components/Header/PdapHeader.vue.d.ts +29 -0
  25. package/dist/components/Header/index.d.ts +2 -0
  26. package/dist/components/Header/types.d.ts +4 -0
  27. package/dist/components/Input/Checkbox/InputCheckbox.vue.d.ts +24 -0
  28. package/dist/components/Input/Checkbox/index.d.ts +2 -0
  29. package/dist/components/Input/PdapInput.vue.d.ts +19 -0
  30. package/dist/components/Input/Text/InputText.vue.d.ts +24 -0
  31. package/dist/components/Input/Text/index.d.ts +2 -0
  32. package/dist/components/Input/index.d.ts +2 -0
  33. package/dist/components/Input/types.d.ts +20 -0
  34. package/dist/components/Input/utils.d.ts +4 -0
  35. package/dist/components/Nav/PdapNav.vue.d.ts +12 -0
  36. package/dist/components/Nav/index.d.ts +2 -0
  37. package/dist/components/Nav/types.d.ts +12 -0
  38. package/dist/components/TileIcon/TileIcon.vue.d.ts +12 -0
  39. package/dist/components/TileIcon/index.d.ts +2 -0
  40. package/dist/components/TileIcon/types.d.ts +4 -0
  41. package/dist/components/index.d.ts +12 -0
  42. package/dist/index.cjs +2 -0
  43. package/dist/index.d.ts +12 -0
  44. package/dist/index.js +1728 -0
  45. package/dist/styles.css +1 -0
  46. package/dist/tools/testing/serializer.d.ts +7 -0
  47. package/dist/tools/testing/setup.d.ts +1 -0
  48. package/dist/utils/vuelidate.d.ts +36 -0
  49. package/package.json +50 -20
  50. package/dist/css/global-styles.css +0 -2133
  51. package/system/README.md +0 -1
  52. package/system/css/global-styles.css +0 -735
  53. package/system/css/normalize.css +0 -349
  54. package/system/images/acronym.svg +0 -16
  55. package/system/images/favicon.png +0 -0
  56. package/system/images/icons/automation.svg +0 -50
  57. package/system/images/icons/community.svg +0 -38
  58. package/system/images/icons/scrapers.svg +0 -64
  59. package/system/images/icons/sources.svg +0 -43
  60. package/system/images/icons/standard.svg +0 -38
  61. package/system/images/lockup.svg +0 -68
  62. package/system/images/logo.svg +0 -8
  63. package/system/images/webclip.gif +0 -0
@@ -0,0 +1,34 @@
1
+ # Contributing
2
+
3
+ ## Tech Stack
4
+
5
+ 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`
6
+ Some helpful resources and reading:
7
+
8
+ [Vue.js docs](https://vuejs.org/guide/introduction.html)
9
+ [Vite docs](https://vitejs.dev/guide/)
10
+ [Vitest docs](https://vitest.dev/guide/)
11
+ [Vue Testing Handbook](https://lmiller1990.github.io/vue-testing-handbook/v3/)
12
+ [Tailwind docs](https://tailwindui.com/documentation)
13
+ [TypeScript docs](https://www.typescriptlang.org/docs/)
14
+
15
+ ### Etiquette
16
+
17
+ 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.
18
+
19
+ Test your changes **locally first**, if possible. Include **screenshots with your PR** if you're changing something visual.
20
+
21
+ ### Setup
22
+
23
+ 1. [Clone the repository](https://docs.github.com/en/repositories/creating-and-managing-repositories/cloning-a-repository).
24
+
25
+ For PDAP staff: Make changes as needed, but consider how widely this is used. Don't merge things until we test the changes.
26
+
27
+ 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.
28
+
29
+ To test the package locally:
30
+
31
+ 1. Run `npm link` from the root of the project directory.
32
+ 2. `cd` into the local directory of the app you want to test importing into, then run `npm link pdap-design-system`
33
+ 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.
34
+ 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 CHANGED
@@ -1,60 +1,50 @@
1
1
  # Design System
2
2
 
3
- These are styling resources like CSS and templates for new PDAP microservices or branded web projects.
4
-
5
- Open `src/demo.html` to see how things look.
6
-
7
- `src/css/global-styles.css` are the styles used across all PDAP applications.
8
-
9
- `src/images` are icons and brand assets.
10
-
11
- CSS and assets are built to the `dist` directory before each release, so you will access them from there.
3
+ This is a `Vue` component library, styling system, and image asset repository for PDAP-branded client apps.
12
4
 
13
5
  ## Usage
14
6
 
15
- 1. In the project's root directory:
7
+ 1. Install the package
16
8
 
17
9
  ```
18
10
  npm install pdap-design-system
19
11
  ```
20
12
 
21
- ### To import and use CSS from the package
22
-
23
- After installing the package, include PDAP styles in a project using one of two strategies.
13
+ 2. Import the stylesheet in the app's entrypoint (usually `index.js` or `main.js`, at the root of your project)
24
14
 
25
- 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:
26
-
27
- ```
28
- import 'pdap-design-system'
29
15
  ```
16
+ // index.js
30
17
 
31
- And voila! You have access to PDAP's design system CSS / images to use in your templates / components:
32
-
33
- ```
34
- <button class="button">Say Hello</button>
18
+ import 'pdap-design-system/styles';
35
19
  ```
36
20
 
21
+ 3. Import and use the components
22
+
37
23
  ```
38
- <img src=node_modules/pdap-design-system/dist/images/{name-of-image}.{png | svg | gif} alt="some descriptive alt text" />
24
+ import { Button, Form } from 'pdap-design-system';
39
25
  ```
40
26
 
41
- 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:
27
+ 4. If your project is using `TypeScript`, the component props definitions and other types are exposed for import as well.
28
+ _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._
42
29
 
43
30
  ```
44
- <link href="node_modules/pdap-design-system/dist/css/global-styles.css" rel="stylesheet" type="text/css">
31
+ import { PdapInputTypes } from 'pdap-design-system';
45
32
  ```
46
33
 
47
- ### To import and use images from the package
34
+ 5. See [the component documentation](./doc/components.md) for details on each component's API.
48
35
 
49
- There are also two strategies for including PDAP image assets.
36
+ ### About images
50
37
 
51
- 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:
38
+ PDAP image assets contained in this repo are built to the `/dist` folder. For convenience an importing alias `/images` has been added.
52
39
 
53
- 2. You can then reference images directly from the `node_modules` directory in the same way CSS is imported
54
- _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_
40
+ ```
41
+ import 'pdap-design-system/images/acronym.svg';
42
+ ```
43
+
44
+ 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.
55
45
 
56
46
  ```
57
- <img src='node_modules/pdap-design-system/dist/images/{name-of-image}.{png | svg | gif}' alt='some descriptive alt text'>
47
+ import `pdap-design-system/images`;
58
48
  ```
59
49
 
60
50
  ### Using the CLI to copy assets to your local project directory
@@ -98,35 +88,31 @@ npm i
98
88
  npm run build
99
89
  ```
100
90
 
101
- - To watch for changes and update css as you make changes:
91
+ - To watch for changes and update the build as you make changes:
102
92
 
103
93
  ```
104
- npm run styles:watch
94
+ npm run build:watch
105
95
  ```
106
96
 
107
97
  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.
108
98
 
109
99
  5. Read the [contributing guide](./CONTRIBUTING.md) for development requirements and tips.
110
100
 
111
- ## Principles
112
-
113
- This is a first pass, so they're not etched in stone. Open to suggestions.
114
-
115
- We are making tools for transparency about a serious subject. We should be focused, friendly, and open.
116
-
117
- - Our design should take accessibility seriously.
118
- - Keep it simple: things should not do anything they don't need to do.
119
- - We should keep our users informed and in control with timely, relevant feedback.
120
- - Things that look the same should behave in the same way, and an action should always produce the same result.
121
- - Don't reinvent the wheel: use standard conventions and cues.
122
- - Provide help to people in context, not in the docs.
123
- - Establish good visual hierarchy by ensuring each page and object has a primary function.
124
-
125
101
  ## Assets
126
102
 
127
103
  Use these [brand assets](https://docs.pdap.io/meta/about/staff/brand-assets).
128
104
  Use this [terminology](https://docs.pdap.io/activities/terms-and-definitions).
129
105
 
130
- ## Other notes
131
-
132
- This is based on the PDAP website, which was originally created in Webflow. That might explain some of the CSS browser compatibility choices.
106
+ ## Scripts reference
107
+
108
+ | Script | What it does |
109
+ | -------------- | ----------------------------------------------- |
110
+ | `build` | Builds the library |
111
+ | `build:watch` | Builds the library and watches for file changes |
112
+ | `clean` | Removes testing coverage reports after build |
113
+ | `lint` | Lint `ts` and `css` |
114
+ | `lint:es` | Lint `ts` |
115
+ | `lint:css` | Lint `css` |
116
+ | `test` | Runs full test suite |
117
+ | `test:changed` | Runs only test suites affected by changed files |
118
+ | `types` | Runs type check on all `ts` and `vue` files |
@@ -1,23 +1,27 @@
1
1
  #!/usr/bin/env node
2
+ import minimist from 'minimist';
3
+ import cli from '../src/cli/index.js';
2
4
 
3
- const cli = require('../src/cli');
4
-
5
- // Convert argv to object keyed by arg name where --{argName}
6
- const args = require('minimist')(process.argv);
5
+ // Convert argv to object keyed by argName where --argName is what is passed to CLI
6
+ const args = minimist(process.argv);
7
7
 
8
8
  switch (true) {
9
9
  case args['copy-assets']:
10
- return cli.copyAllAssets(args);
10
+ cli.copyAllAssets(args);
11
+ break;
11
12
  case args['copy-images']:
12
- return cli.copyImageAssets(args);
13
+ cli.copyImageAssets(args);
14
+ break;
13
15
  case args['copy-styles']:
14
- return cli.copyStyleAssets(args);
16
+ cli.copyStyleAssets(args);
17
+ break;
15
18
  default:
16
- return console.log(
19
+ console.log(
17
20
  'No option argument was passed to pdap-design-system CLI.',
18
21
  '\n Current options are:',
19
22
  '\n --copy-assets: Copy all assets to assets/ (default) or custom path passed to optional --to argument.',
20
23
  '\n --copy-images: Copy only image assets to assets/ (default) or custom path passed to optional --to argument.',
21
24
  '\n --copy-styles: Copy only CSS assets to assets/ (default) or custom path passed to optional --to argument.'
22
25
  );
26
+ break;
23
27
  }
@@ -0,0 +1,36 @@
1
+ import { PdapButtonProps } from './types';
2
+ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapButtonProps>, {
3
+ intent: string;
4
+ isLoading: boolean;
5
+ }>, {}, 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>, {
6
+ intent: string;
7
+ isLoading: boolean;
8
+ }>>>, {
9
+ intent: "primary" | "secondary";
10
+ isLoading: boolean;
11
+ }, {}>, {
12
+ default?(_: {}): any;
13
+ }>;
14
+ export default _default;
15
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
16
+ type __VLS_TypePropsToRuntimeProps<T> = {
17
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
18
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
19
+ } : {
20
+ type: import('vue').PropType<T[K]>;
21
+ required: true;
22
+ };
23
+ };
24
+ type __VLS_WithDefaults<P, D> = {
25
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
26
+ default: D[K];
27
+ }> : P[K];
28
+ };
29
+ type __VLS_Prettify<T> = {
30
+ [K in keyof T]: T[K];
31
+ } & {};
32
+ type __VLS_WithTemplateSlots<T, S> = T & {
33
+ new (): {
34
+ $slots: S;
35
+ };
36
+ };
@@ -0,0 +1,2 @@
1
+ import PdapButton from './PdapButton.vue';
2
+ export { PdapButton as Button };
@@ -0,0 +1,4 @@
1
+ export interface PdapButtonProps {
2
+ intent?: 'primary' | 'secondary';
3
+ isLoading?: boolean;
4
+ }
@@ -0,0 +1,36 @@
1
+ import { PdapFlexContainerProps } from './types';
2
+ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapFlexContainerProps>, {
3
+ alignment: string;
4
+ component: string;
5
+ }>, {}, 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>, {
6
+ alignment: string;
7
+ component: string;
8
+ }>>>, {
9
+ alignment: "center" | "start";
10
+ component: string;
11
+ }, {}>, {
12
+ default?(_: {}): any;
13
+ }>;
14
+ export default _default;
15
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
16
+ type __VLS_TypePropsToRuntimeProps<T> = {
17
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
18
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
19
+ } : {
20
+ type: import('vue').PropType<T[K]>;
21
+ required: true;
22
+ };
23
+ };
24
+ type __VLS_WithDefaults<P, D> = {
25
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
26
+ default: D[K];
27
+ }> : P[K];
28
+ };
29
+ type __VLS_Prettify<T> = {
30
+ [K in keyof T]: T[K];
31
+ } & {};
32
+ type __VLS_WithTemplateSlots<T, S> = T & {
33
+ new (): {
34
+ $slots: S;
35
+ };
36
+ };
@@ -0,0 +1,2 @@
1
+ import FlexContainer from './FlexContainer.vue';
2
+ export { FlexContainer };
@@ -0,0 +1,4 @@
1
+ export interface PdapFlexContainerProps {
2
+ alignment?: 'center' | 'start';
3
+ component?: string;
4
+ }
@@ -0,0 +1,29 @@
1
+ import { PdapFooterProps } from './types';
2
+ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapFooterProps>, {
3
+ logoImageSrc: string;
4
+ logoImageAnchorPath: string;
5
+ }>, {}, 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>, {
6
+ logoImageSrc: string;
7
+ logoImageAnchorPath: string;
8
+ }>>>, {
9
+ logoImageSrc: string;
10
+ logoImageAnchorPath: string;
11
+ }, {}>;
12
+ export default _default;
13
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
14
+ type __VLS_TypePropsToRuntimeProps<T> = {
15
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
16
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
17
+ } : {
18
+ type: import('vue').PropType<T[K]>;
19
+ required: true;
20
+ };
21
+ };
22
+ type __VLS_WithDefaults<P, D> = {
23
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
24
+ default: D[K];
25
+ }> : P[K];
26
+ };
27
+ type __VLS_Prettify<T> = {
28
+ [K in keyof T]: T[K];
29
+ } & {};
@@ -0,0 +1,2 @@
1
+ import PdapFooter from './PdapFooter.vue';
2
+ export { PdapFooter as Footer };
@@ -0,0 +1,9 @@
1
+ export interface PdapFooterSocialLinks {
2
+ href?: string;
3
+ path?: string;
4
+ text: string;
5
+ }
6
+ export interface PdapFooterProps {
7
+ logoImageSrc?: string;
8
+ logoImageAnchorPath?: string;
9
+ }
@@ -0,0 +1,37 @@
1
+ import { PropType } from 'vue';
2
+ import { PdapFormSchema } from '../types.ts';
3
+ declare const _default: import("vue").DefineComponent<{
4
+ schema: {
5
+ type: PropType<PdapFormSchema>;
6
+ };
7
+ values: {
8
+ type: PropType<Record<string, unknown>>;
9
+ };
10
+ v$: {
11
+ type: PropType<import("@vuelidate/core").Validation<{}, Record<string, unknown>>>;
12
+ };
13
+ }, void, {
14
+ formData: Record<string, unknown>;
15
+ INPUT_COMPONENT_MAP: {
16
+ checkbox: string;
17
+ text: string;
18
+ };
19
+ v: import("@vuelidate/core").Validation<{}, Record<string, unknown>> | undefined;
20
+ }, {}, {
21
+ updateForm(fieldName: string, value: unknown): void;
22
+ updateValidations(fieldName: string): void;
23
+ }, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("input" | "blur")[], "input" | "blur", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
24
+ schema: {
25
+ type: PropType<PdapFormSchema>;
26
+ };
27
+ values: {
28
+ type: PropType<Record<string, unknown>>;
29
+ };
30
+ v$: {
31
+ type: PropType<import("@vuelidate/core").Validation<{}, Record<string, unknown>>>;
32
+ };
33
+ }>> & {
34
+ onBlur?: ((...args: any[]) => any) | undefined;
35
+ onInput?: ((...args: any[]) => any) | undefined;
36
+ }, {}, {}>;
37
+ export default _default;
@@ -0,0 +1,2 @@
1
+ import FormInputsGenerator from './FormInputsGenerator.vue';
2
+ export { FormInputsGenerator };
@@ -0,0 +1,39 @@
1
+ import { PdapFormProps } from './types';
2
+ declare const v$: import("vue").Ref<import("@vuelidate/core").Validation<{}, Record<string, unknown>>>;
3
+ export type VuelidateInstance = typeof v$.value;
4
+ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapFormProps>, {
5
+ error: null;
6
+ }>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
7
+ submit: (...args: any[]) => void;
8
+ }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapFormProps>, {
9
+ error: null;
10
+ }>>> & {
11
+ onSubmit?: ((...args: any[]) => any) | undefined;
12
+ }, {
13
+ error: string | null;
14
+ }, {}>, {
15
+ default?(_: {}): any;
16
+ }>;
17
+ export default _default;
18
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
19
+ type __VLS_TypePropsToRuntimeProps<T> = {
20
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
21
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
22
+ } : {
23
+ type: import('vue').PropType<T[K]>;
24
+ required: true;
25
+ };
26
+ };
27
+ type __VLS_WithDefaults<P, D> = {
28
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
29
+ default: D[K];
30
+ }> : P[K];
31
+ };
32
+ type __VLS_Prettify<T> = {
33
+ [K in keyof T]: T[K];
34
+ } & {};
35
+ type __VLS_WithTemplateSlots<T, S> = T & {
36
+ new (): {
37
+ $slots: S;
38
+ };
39
+ };
@@ -0,0 +1,2 @@
1
+ import PdapForm from './PdapForm.vue';
2
+ export { PdapForm as Form };
@@ -0,0 +1,35 @@
1
+ import { PdapInputCheckboxProps, PdapInputTextProps } from '../Input/types';
2
+ export type PdapLengthRules = 'maxLength' | 'minLength';
3
+ export interface PdapFormValidator<T> {
4
+ message?: string;
5
+ value: T;
6
+ }
7
+ /**
8
+ * Keyed by currently used validators.
9
+ * Add any Vuelidate validators or custom ones here as we need them.
10
+ * See https://vuelidate-next.netlify.app/validators.html#using-builtin-validators for more.
11
+ *
12
+ */
13
+ export interface PdapFormValidators {
14
+ maxLength: PdapFormValidator<number>;
15
+ minLength: PdapFormValidator<number>;
16
+ required: PdapFormValidator<boolean>;
17
+ }
18
+ export interface PdapFormSchemaEntryInputCheckbox extends PdapInputCheckboxProps {
19
+ validators?: Partial<PdapFormValidators>;
20
+ }
21
+ export interface PdapFormSchemaEntryInputText extends PdapInputTextProps {
22
+ validators?: Partial<PdapFormValidators>;
23
+ }
24
+ export type PdapFormSchemaEntry = PdapFormSchemaEntryInputCheckbox | PdapFormSchemaEntryInputText;
25
+ export type PdapFormSchema = PdapFormSchemaEntry[];
26
+ export type PdapFormData = Record<string, unknown>;
27
+ /**
28
+ * PDAP Form props interface.
29
+ */
30
+ export interface PdapFormProps {
31
+ error?: string | undefined | null;
32
+ id: string;
33
+ name: string;
34
+ schema: PdapFormSchema;
35
+ }
@@ -0,0 +1,39 @@
1
+ import { PdapGridContainerProps } from './types';
2
+ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapGridContainerProps>, {
3
+ columns: string;
4
+ component: string;
5
+ rows: string;
6
+ }>, {}, 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>, {
7
+ columns: string;
8
+ component: string;
9
+ rows: string;
10
+ }>>>, {
11
+ component: string;
12
+ columns: 1 | 2 | 3 | "auto";
13
+ rows: number | "auto";
14
+ }, {}>, {
15
+ default?(_: {}): any;
16
+ }>;
17
+ export default _default;
18
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
19
+ type __VLS_TypePropsToRuntimeProps<T> = {
20
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
21
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
22
+ } : {
23
+ type: import('vue').PropType<T[K]>;
24
+ required: true;
25
+ };
26
+ };
27
+ type __VLS_WithDefaults<P, D> = {
28
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
29
+ default: D[K];
30
+ }> : P[K];
31
+ };
32
+ type __VLS_Prettify<T> = {
33
+ [K in keyof T]: T[K];
34
+ } & {};
35
+ type __VLS_WithTemplateSlots<T, S> = T & {
36
+ new (): {
37
+ $slots: S;
38
+ };
39
+ };
@@ -0,0 +1,2 @@
1
+ import GridContainer from './GridContainer.vue';
2
+ export { GridContainer };
@@ -0,0 +1,7 @@
1
+ export interface PdapGridContainerProps {
2
+ columns?: 1 | 2 | 3 | 'auto';
3
+ component?: string;
4
+ rows?: number | 'auto';
5
+ templateColumns?: string;
6
+ templateRows?: string;
7
+ }
@@ -0,0 +1,39 @@
1
+ import { PdapGridItemProps } from './types';
2
+ declare const _default: __VLS_WithTemplateSlots<import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapGridItemProps>, {
3
+ component: string;
4
+ spanColumn: number;
5
+ spanRow: number;
6
+ }>, {}, 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>, {
7
+ component: string;
8
+ spanColumn: number;
9
+ spanRow: number;
10
+ }>>>, {
11
+ component: string;
12
+ spanColumn: 1 | 2 | 3;
13
+ spanRow: number;
14
+ }, {}>, {
15
+ default?(_: {}): any;
16
+ }>;
17
+ export default _default;
18
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
19
+ type __VLS_TypePropsToRuntimeProps<T> = {
20
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
21
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
22
+ } : {
23
+ type: import('vue').PropType<T[K]>;
24
+ required: true;
25
+ };
26
+ };
27
+ type __VLS_WithDefaults<P, D> = {
28
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
29
+ default: D[K];
30
+ }> : P[K];
31
+ };
32
+ type __VLS_Prettify<T> = {
33
+ [K in keyof T]: T[K];
34
+ } & {};
35
+ type __VLS_WithTemplateSlots<T, S> = T & {
36
+ new (): {
37
+ $slots: S;
38
+ };
39
+ };
@@ -0,0 +1,2 @@
1
+ import GridItem from './GridItem.vue';
2
+ export { GridItem };
@@ -0,0 +1,5 @@
1
+ export interface PdapGridItemProps {
2
+ component?: string;
3
+ spanColumn?: 1 | 2 | 3;
4
+ spanRow?: number;
5
+ }
@@ -0,0 +1,29 @@
1
+ import { PdapHeaderProps } from './types';
2
+ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapHeaderProps>, {
3
+ logoImageSrc: string;
4
+ logoImageAnchorPath: string;
5
+ }>, {}, 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>, {
6
+ logoImageSrc: string;
7
+ logoImageAnchorPath: string;
8
+ }>>>, {
9
+ logoImageSrc: string;
10
+ logoImageAnchorPath: string;
11
+ }, {}>;
12
+ export default _default;
13
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
14
+ type __VLS_TypePropsToRuntimeProps<T> = {
15
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
16
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
17
+ } : {
18
+ type: import('vue').PropType<T[K]>;
19
+ required: true;
20
+ };
21
+ };
22
+ type __VLS_WithDefaults<P, D> = {
23
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
24
+ default: D[K];
25
+ }> : P[K];
26
+ };
27
+ type __VLS_Prettify<T> = {
28
+ [K in keyof T]: T[K];
29
+ } & {};
@@ -0,0 +1,2 @@
1
+ import PdapHeader from './PdapHeader.vue';
2
+ export { PdapHeader as Header };
@@ -0,0 +1,4 @@
1
+ export interface PdapHeaderProps {
2
+ logoImageSrc?: string;
3
+ logoImageAnchorPath?: string;
4
+ }
@@ -0,0 +1,24 @@
1
+ import { PdapInputCheckboxProps } from '../types';
2
+ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapInputCheckboxProps>, {}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
3
+ change: (val: string) => void;
4
+ }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<PdapInputCheckboxProps>, {}>>> & {
5
+ onChange?: ((val: string) => any) | undefined;
6
+ }, {}, {}>;
7
+ export default _default;
8
+ type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
9
+ type __VLS_TypePropsToRuntimeProps<T> = {
10
+ [K in keyof T]-?: {} extends Pick<T, K> ? {
11
+ type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
12
+ } : {
13
+ type: import('vue').PropType<T[K]>;
14
+ required: true;
15
+ };
16
+ };
17
+ type __VLS_WithDefaults<P, D> = {
18
+ [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
19
+ default: D[K];
20
+ }> : P[K];
21
+ };
22
+ type __VLS_Prettify<T> = {
23
+ [K in keyof T]: T[K];
24
+ } & {};
@@ -0,0 +1,2 @@
1
+ import InputCheckbox from './InputCheckbox.vue';
2
+ export { InputCheckbox };