@phila/phila-ui-app-footer 0.0.32 → 1.1.0-beta.2

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/README.md CHANGED
@@ -1,48 +1,140 @@
1
- # AppFooter Component
1
+ # Phila AppFooter Component
2
2
 
3
- A simple, customizable Vue 3. AppFooter component built with TypeScript and Vite.
4
- A footer vue component for site info and related links.
3
+ A Vue component for displaying site footer information with navigation links, social media icons, and legal links.
5
4
 
6
5
  ## Features
7
6
 
7
+ - 🎨 Three customizable navigation sections with default content
8
+ - 📱 Responsive design with mobile breakpoint
9
+ - 🔗 Social media icons with FontAwesome integration
8
10
  - 🎯 TypeScript support with full type definitions
11
+ - ♿ Accessibility features: semantic HTML, proper link structure
12
+ - 🔄 Flexible slots for custom content
9
13
 
10
14
  ## Installation
11
15
 
12
16
  ```bash
13
17
  npm install @phila/phila-ui-app-footer
14
18
  # or
15
- yarn add @phila/phila-ui-app-footer
16
- # or
17
19
  pnpm add @phila/phila-ui-app-footer
18
20
  ```
19
21
 
22
+ Import core styles in your main entry file (e.g., `main.js|ts`):
23
+
24
+ ```typescript
25
+ import "@phila/core/styles/template-light.css";
26
+ ```
27
+
20
28
  ## Usage
21
29
 
30
+ ### Basic Usage
31
+
32
+ Use the `AppFooter` component with default content:
33
+
34
+ ```vue
35
+ <template>
36
+ <AppFooter />
37
+ </template>
38
+
39
+ <script setup lang="ts">
40
+ import { AppFooter } from "@phila/phila-ui-app-footer";
41
+ </script>
42
+ ```
43
+
44
+ ### Custom Content with Slots
45
+
46
+ Customize any section using named slots:
47
+
22
48
  ```vue
49
+ <template>
50
+ <AppFooter>
51
+ <template #firstNavSlot>
52
+ <div>
53
+ <h4>Custom Section</h4>
54
+ <ul>
55
+ <li><a href="/about">About Us</a></li>
56
+ <li><a href="/contact">Contact</a></li>
57
+ </ul>
58
+ </div>
59
+ </template>
60
+
61
+ <template #secondNavSlot>
62
+ <div>
63
+ <h4>Resources</h4>
64
+ <ul>
65
+ <li><a href="/docs">Documentation</a></li>
66
+ <li><a href="/help">Help Center</a></li>
67
+ </ul>
68
+ </div>
69
+ </template>
70
+
71
+ <template #thirdNavSlot>
72
+ <div>
73
+ <h4>Connect</h4>
74
+ <!-- Custom social media links -->
75
+ </div>
76
+ </template>
77
+ </AppFooter>
78
+ </template>
79
+
80
+ <script setup lang="ts">
81
+ import { AppFooter } from "@phila/phila-ui-app-footer";
82
+ </script>
83
+ ```
84
+
85
+ ### Sub-Footer Only
86
+
87
+ Display only the legal links section:
88
+
89
+ ```vue
90
+ <template>
91
+ <AppFooter :subFooterOnly="true" />
92
+ </template>
93
+
23
94
  <script setup lang="ts">
24
95
  import { AppFooter } from "@phila/phila-ui-app-footer";
25
96
  </script>
26
- <template>...Add basic component template here...</template>
27
97
  ```
28
98
 
29
99
  ## Props
30
100
 
31
- | Prop | Type | Default | Description |
32
- | ---- | ---- | ------- | ----------- |
101
+ | Prop | Type | Default | Description |
102
+ | --------------- | ------- | ------- | -------------------------------------------------------- |
103
+ | `subFooterOnly` | boolean | `false` | When true, only displays the sub-footer with legal links |
104
+ | `className` | string | `""` | Additional CSS classes to apply to the footer |
33
105
 
34
- | ...Add props here...
106
+ ## Slots
35
107
 
36
- ## Events
108
+ | Slot Name | Description |
109
+ | --------------- | ------------------------------------------------------- |
110
+ | `firstNavSlot` | First navigation section (default: City services links) |
111
+ | `secondNavSlot` | Second navigation section (default: Government links) |
112
+ | `thirdNavSlot` | Third navigation section (default: Social media icons) |
37
113
 
38
- | Event | Payload | Description |
39
- | ----- | ------- | ----------- |
114
+ ## Default Content
40
115
 
41
- | ...Add events here...
116
+ The component includes default content for all three navigation sections:
42
117
 
43
- ## Examples
118
+ - **First Section**: Links to SEPTA and Visit Philadelphia
119
+ - **Second Section**: Government and city service links
120
+ - **Third Section**: Social media icons (Facebook, Twitter, Instagram, GovTV, YouTube, Flickr, GitHub, LinkedIn)
44
121
 
45
- ...Add examples here...
122
+ The sub-footer always displays links to Terms of Use, Right to Know, Privacy Policy, and Accessibility.
123
+
124
+ ## Responsive Behavior
125
+
126
+ - **Desktop (>X)**: Three columns displayed horizontally with vertical dividers
127
+ - **Mobile (<X))**: Stacked layout with horizontal dividers between sections
128
+
129
+ ## FontAwesome Icons
130
+
131
+ The footer uses FontAwesome icons for social media links. The component requires:
132
+
133
+ ```bash
134
+ pnpm add @fortawesome/vue-fontawesome @fortawesome/free-brands-svg-icons
135
+ ```
136
+
137
+ These are listed as peer dependencies and should be installed in your application.
46
138
 
47
139
  ## Development
48
140
 
@@ -52,24 +144,37 @@ import { AppFooter } from "@phila/phila-ui-app-footer";
52
144
  pnpm install
53
145
  ```
54
146
 
55
- ### Run Demo
147
+ ### Run Storybook demo
56
148
 
57
149
  ```bash
58
- pnpm dev
150
+ npm run storybook
59
151
  ```
60
152
 
61
- ### Build Library
153
+ ### Run lint
62
154
 
63
155
  ```bash
64
- pnpm build
156
+ npm run lint
65
157
  ```
66
158
 
67
- ### Type Check
159
+ ### Create Production Build
68
160
 
69
161
  ```bash
70
- pnpm type-check
162
+ npm run build
71
163
  ```
72
164
 
165
+ ## Test locally in your development environment
166
+
167
+ ```bash
168
+ npm pack
169
+ cp ./dist/*.tgz ~/path/to/your/local/npm/repo
170
+ cd ~/path/to/your/local/npm/repo
171
+ npm install *.tgz
172
+ ```
173
+
174
+ ## Publishing to NPM
175
+
176
+ Follow the [release instructions](../../RELEASE.md) using changesets.
177
+
73
178
  ## License
74
179
 
75
180
  MIT
@@ -1,4 +1,23 @@
1
1
  import { AppFooterProps } from './index';
2
- declare const _default: import('vue').DefineComponent<AppFooterProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<AppFooterProps> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLSpanElement>;
2
+ declare function __VLS_template(): {
3
+ attrs: Partial<{}>;
4
+ slots: {
5
+ firstNavSlot?(_: {}): any;
6
+ secondNavSlot?(_: {}): any;
7
+ thirdNavSlot?(_: {}): any;
8
+ };
9
+ refs: {};
10
+ rootEl: HTMLElement;
11
+ };
12
+ type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
13
+ declare const __VLS_component: import('vue').DefineComponent<AppFooterProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<AppFooterProps> & Readonly<{}>, {
14
+ subFooterOnly: boolean;
15
+ }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLElement>;
16
+ declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
3
17
  export default _default;
18
+ type __VLS_WithTemplateSlots<T, S> = T & {
19
+ new (): {
20
+ $slots: S;
21
+ };
22
+ };
4
23
  //# sourceMappingURL=AppFooter.vue.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"AppFooter.vue.d.ts","sourceRoot":"","sources":["../src/AppFooter.vue"],"names":[],"mappings":"AAgCA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;;AA+D9C,wBASG"}
1
+ {"version":3,"file":"AppFooter.vue.d.ts","sourceRoot":"","sources":["../src/AppFooter.vue"],"names":[],"mappings":"AAuHA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAmB9C,iBAAS,cAAc;WA6IT,OAAO,IAA6B;;8BAZhB,GAAG;+BACF,GAAG;8BACH,GAAG;;;;EAerC;AAcD,KAAK,oBAAoB,GAAG,UAAU,CAAC,OAAO,cAAc,CAAC,CAAC;AAC9D,QAAA,MAAM,eAAe;;qFAQnB,CAAC;wBACkB,uBAAuB,CAAC,OAAO,eAAe,EAAE,oBAAoB,CAAC,OAAO,CAAC,CAAC;AAAnG,wBAAoG;AAapG,KAAK,uBAAuB,CAAC,CAAC,EAAE,CAAC,IAAI,CAAC,GAAG;IACxC,QAAO;QACN,MAAM,EAAE,CAAC,CAAC;KAEV,CAAA;CACD,CAAC"}
@@ -0,0 +1,3 @@
1
+ declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
2
+ export default _default;
3
+ //# sourceMappingURL=FirstNavSlotContent.vue.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"FirstNavSlotContent.vue.d.ts","sourceRoot":"","sources":["../../src/DefaultContent/FirstNavSlotContent.vue"],"names":[],"mappings":";AAoMA,wBAMG"}
@@ -0,0 +1,3 @@
1
+ declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
2
+ export default _default;
3
+ //# sourceMappingURL=SecondNavSlotContent.vue.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"SecondNavSlotContent.vue.d.ts","sourceRoot":"","sources":["../../src/DefaultContent/SecondNavSlotContent.vue"],"names":[],"mappings":";AA2NA,wBAMG"}
@@ -0,0 +1,3 @@
1
+ declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
2
+ export default _default;
3
+ //# sourceMappingURL=ThirdNavSlotContent.vue.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"ThirdNavSlotContent.vue.d.ts","sourceRoot":"","sources":["../../src/DefaultContent/ThirdNavSlotContent.vue"],"names":[],"mappings":";AAwVA,wBAMG"}
package/dist/index.css CHANGED
@@ -0,0 +1 @@
1
+ .phila-footer-icon-list[data-v-08d51492]{display:flex;flex-wrap:wrap;gap:.5rem}.phila-footer-icon-list li a[data-v-08d51492]{display:flex;align-items:center;justify-content:center}.phila-footer[data-v-a57cdbbc]{color:var(--Schemes-On-Primary-Container)}.phila-footer [data-v-a57cdbbc] ul{list-style:none;padding:0}.phila-footer [data-v-a57cdbbc] li{margin-bottom:var(--scale-small)}.phila-main-footer[data-v-a57cdbbc]{display:flex;justify-content:center;padding:var(--spacing-3xl);background-color:var(--Schemes-Primary-Container)}.phila-main-footer-content[data-v-a57cdbbc]{display:flex;max-width:60rem;gap:var(--spacing-3xl)}.phila-main-footer-slot[data-v-a57cdbbc]{display:flex;min-width:6.25rem;flex:1 0 0}[data-v-a57cdbbc]:root{--phila-main-footer-divider-size: .0625rem}.phila-main-footer-divider[data-v-a57cdbbc]{width:var(--phila-main-footer-divider-size);background-color:var(--Schemes-On-Primary-Container)}@media(max-width:40rem){.phila-main-footer-content[data-v-a57cdbbc]{flex-direction:column}.phila-footer-divider[data-v-a57cdbbc]{height:var(--phila-footer-divider-size);width:100%}}.phila-sub-footer[data-v-a57cdbbc]{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--scale-small);padding:var(--spacing-l);background-color:var(--Schemes-On-Surface)}
package/dist/index.d.ts CHANGED
@@ -1,5 +1,6 @@
1
1
  import { BaseProps } from '@phila/phila-ui-core';
2
2
  export { default as AppFooter } from './AppFooter.vue';
3
3
  export interface AppFooterProps extends BaseProps {
4
+ subFooterOnly?: boolean;
4
5
  }
5
6
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAIvD,MAAM,WAAW,cAAe,SAAQ,SAAS;CAEhD"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AACtD,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAEvD,MAAM,WAAW,cAAe,SAAQ,SAAS;IAC/C,aAAa,CAAC,EAAE,OAAO,CAAC;CACzB"}
package/dist/index.js CHANGED
@@ -1 +1,12 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./index.css');const e=require("vue"),n=require("@phila/phila-ui-core"),a=e.defineComponent({__name:"AppFooter",props:{className:{}},setup(o,{emit:c}){const t=o,s=e.computed(()=>n.cn("default-class",t.className));return(r,u)=>(e.openBlock(),e.createElementBlock("span",{class:e.normalizeClass(s.value)}," Hello world! I am AppFooter ",2))}}),p=(o,c)=>{const t=o.__vccOpts||o;for(const[s,r]of c)t[s]=r;return t},l=p(a,[["__scopeId","data-v-f636e62c"]]);exports.AppFooter=l;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require('./index.css');const e=require("vue"),s=require("@phila/phila-ui-core"),o=e.defineComponent({inheritAttrs:!1,__name:"Link",props:{to:{},href:{},target:{},rel:{},disabled:{type:Boolean,default:!1},ariaLabel:{},className:{},iconRight:{type:Boolean},iconOnly:{type:Boolean,default:!1},text:{},size:{},iconDefinition:{},iconClass:{},src:{},svgRaw:{},variant:{default:"default"},isExternal:{type:Boolean,default:!1}},setup(n){const l=n,t=e.computed(()=>!(!l.isExternal||l.iconDefinition||l.iconClass||l.src||l.svgRaw)),r=e.computed(()=>s.cn("phila-link",l.variant&&`phila-link--${l.variant}`,l.size&&`is-${l.size}`,l.iconOnly&&"icon-link",l.disabled&&"is-disabled",l.className)),i=e.computed(()=>{const a={disabled:l.disabled,ariaLabel:l.ariaLabel,className:r.value};return s.isRouterLink(l)?{to:l.to,...a}:{href:l.href,target:l.target,rel:l.rel,...a}}),c=e.computed(()=>({iconDefinition:l.iconDefinition,iconClass:l.iconClass||(t.value?"external-link":void 0),src:l.src,svgRaw:l.svgRaw,iconRight:t.value?!0:l.iconRight,iconOnly:l.iconOnly,text:l.text,size:l.size}));return(a,B)=>(e.openBlock(),e.createBlock(e.unref(s.BaseLink),e.normalizeProps(e.guardReactiveProps({...i.value,...a.$attrs})),{default:e.withCtx(()=>[e.createVNode(e.unref(s.ActionContent),e.normalizeProps(e.guardReactiveProps(c.value)),{default:e.withCtx(()=>[e.renderSlot(a.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(l.text),1)])]),_:3},16)]),_:3},16))}}),f=e.defineComponent({__name:"FirstNavSlotContent",setup(n){return(l,t)=>(e.openBlock(),e.createElementBlock("div",null,[t[8]||(t[8]=e.createElementVNode("h4",null,"Elected officials",-1)),e.createElementVNode("nav",null,[e.createElementVNode("ul",null,[e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/departments/mayor/"},{default:e.withCtx(()=>[...t[0]||(t[0]=[e.createTextVNode("Mayor",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"http://phlcouncil.com/","is-external":""},{default:e.withCtx(()=>[...t[1]||(t[1]=[e.createTextVNode("City Council",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"http://www.courts.phila.gov/"},{default:e.withCtx(()=>[...t[2]||(t[2]=[e.createTextVNode("Courts",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://phillyda.org/","is-external":""},{default:e.withCtx(()=>[...t[3]||(t[3]=[e.createTextVNode("District Attorney",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://controller.phila.gov/"},{default:e.withCtx(()=>[...t[4]||(t[4]=[e.createTextVNode("City Controller",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://phillysheriff.com/","is-external":""},{default:e.withCtx(()=>[...t[5]||(t[5]=[e.createTextVNode("Sheriff",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://vote.phila.gov/"},{default:e.withCtx(()=>[...t[6]||(t[6]=[e.createTextVNode("City Commissioners",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/departments/register-of-wills/"},{default:e.withCtx(()=>[...t[7]||(t[7]=[e.createTextVNode("Register of Wills",-1)])]),_:1})])])])]))}}),u=e.defineComponent({__name:"SecondNavSlotContent",setup(n){return(l,t)=>(e.openBlock(),e.createElementBlock("div",null,[t[8]||(t[8]=e.createElementVNode("h4",null,"Open government",-1)),e.createElementVNode("nav",null,[e.createElementVNode("ul",null,[e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://codelibrary.amlegal.com/codes/philadelphia/latest/overview","is-external":""},{default:e.withCtx(()=>[...t[0]||(t[0]=[e.createTextVNode(" Philadelphia Code & Charter ",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/departments/department-of-records/"},{default:e.withCtx(()=>[...t[1]||(t[1]=[e.createTextVNode(" City records ",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/departments/department-of-records/proposed-regulations/#/"},{default:e.withCtx(()=>[...t[2]||(t[2]=[e.createTextVNode(" City agency regulations ",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/departments/mayor/executive-orders/"},{default:e.withCtx(()=>[...t[3]||(t[3]=[e.createTextVNode(" Executive orders ",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/programs/integrity-works/"},{default:e.withCtx(()=>[...t[4]||(t[4]=[e.createTextVNode(" Honesty in government ",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://vote.phila.gov/"},{default:e.withCtx(()=>[...t[5]||(t[5]=[e.createTextVNode(" Voting & elections ",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/programs/open-data-program/"},{default:e.withCtx(()=>[...t[6]||(t[6]=[e.createTextVNode(" Open data ",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/documents/city-of-philadelphia-organization-chart/"},{default:e.withCtx(()=>[...t[7]||(t[7]=[e.createTextVNode(" City organization chart ",-1)])]),_:1})])])])]))}});var m={prefix:"fab",iconName:"facebook-f",icon:[320,512,[],"f39e","M80 299.3l0 212.7 116 0 0-212.7 86.5 0 18-97.8-104.5 0 0-34.6c0-51.7 20.3-71.5 72.7-71.5 16.3 0 29.4 .4 37 1.2l0-88.7C291.4 4 256.4 0 236.2 0 129.3 0 80 50.5 80 159.4l0 42.1-66 0 0 97.8 66 0z"]},p={prefix:"fab",iconName:"youtube",icon:[576,512,[61802],"f167","M549.7 124.1C543.5 100.4 524.9 81.8 501.4 75.5 458.9 64 288.1 64 288.1 64S117.3 64 74.7 75.5C51.2 81.8 32.7 100.4 26.4 124.1 15 167 15 256.4 15 256.4s0 89.4 11.4 132.3c6.3 23.6 24.8 41.5 48.3 47.8 42.6 11.5 213.4 11.5 213.4 11.5s170.8 0 213.4-11.5c23.5-6.3 42-24.2 48.3-47.8 11.4-42.9 11.4-132.3 11.4-132.3s0-89.4-11.4-132.3zM232.2 337.6l0-162.4 142.7 81.2-142.7 81.2z"]},h={prefix:"fab",iconName:"github",icon:[512,512,[],"f09b","M173.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM252.8 8c-138.7 0-244.8 105.3-244.8 244 0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1 100-33.2 167.8-128.1 167.8-239 0-138.7-112.5-244-251.2-244zM105.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9s4.3 3.3 5.6 2.3c1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"]},N={prefix:"fab",iconName:"flickr",icon:[448,512,[],"f16e","M400 32L48 32C21.5 32 0 53.5 0 80L0 432c0 26.5 21.5 48 48 48l352 0c26.5 0 48-21.5 48-48l0-352c0-26.5-21.5-48-48-48zM144.5 192a63.5 63.5 0 1 1 0 127 63.5 63.5 0 1 1 0-127zm159 0a63.5 63.5 0 1 1 0 127 63.5 63.5 0 1 1 0-127z"]},V={prefix:"fab",iconName:"instagram",icon:[448,512,[],"f16d","M224.3 141a115 115 0 1 0 -.6 230 115 115 0 1 0 .6-230zm-.6 40.4a74.6 74.6 0 1 1 .6 149.2 74.6 74.6 0 1 1 -.6-149.2zm93.4-45.1a26.8 26.8 0 1 1 53.6 0 26.8 26.8 0 1 1 -53.6 0zm129.7 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM399 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"]},w={prefix:"fab",iconName:"x-twitter",icon:[448,512,[],"e61b","M357.2 48L427.8 48 273.6 224.2 455 464 313 464 201.7 318.6 74.5 464 3.8 464 168.7 275.5-5.2 48 140.4 48 240.9 180.9 357.2 48zM332.4 421.8l39.1 0-252.4-333.8-42 0 255.3 333.8z"]},C={prefix:"fab",iconName:"linkedin-in",icon:[448,512,[],"f0e1","M100.3 448l-92.9 0 0-299.1 92.9 0 0 299.1zM53.8 108.1C24.1 108.1 0 83.5 0 53.8 0 39.5 5.7 25.9 15.8 15.8s23.8-15.8 38-15.8 27.9 5.7 38 15.8 15.8 23.8 15.8 38c0 29.7-24.1 54.3-53.8 54.3zM447.9 448l-92.7 0 0-145.6c0-34.7-.7-79.2-48.3-79.2-48.3 0-55.7 37.7-55.7 76.7l0 148.1-92.8 0 0-299.1 89.1 0 0 40.8 1.3 0c12.4-23.5 42.7-48.3 87.9-48.3 94 0 111.3 61.9 111.3 142.3l0 164.3-.1 0z"]};const v=`<svg width="31" height="25" viewBox="0 0 31 25" fill="none" xmlns="http://www.w3.org/2000/svg">
2
+ <g clip-path="url(#clip0_745_1378)">
3
+ <path d="M28 3.125H3.1V17H28V3.125ZM0 17.1875V3.125C0 1.40137 1.39016 0 3.1 0H27.9C29.6098 0 31 1.40137 31 3.125V17.1875C31 18.9111 29.6098 20.3125 27.9 20H3.1C1.39016 20.3125 0 18.9111 0 17.1875ZM4.65 23.4375C4.65 22.5732 5.34266 21.875 6.2 21.875H24.8C25.6573 21.875 26.35 22.5732 26.35 23.4375C26.35 24.3018 25.6573 25 24.8 25H6.2C5.34266 25 4.65 24.3018 4.65 23.4375Z" fill="#ECFDFF"/>
4
+ <path d="M8.76074 10.4209V9.69727H10.6299V11.4082C10.4482 11.584 10.1846 11.7393 9.83887 11.874C9.49512 12.0068 9.14648 12.0732 8.79297 12.0732C8.34375 12.0732 7.95215 11.9795 7.61816 11.792C7.28418 11.6025 7.0332 11.333 6.86523 10.9834C6.69727 10.6318 6.61328 10.25 6.61328 9.83789C6.61328 9.39062 6.70703 8.99316 6.89453 8.64551C7.08203 8.29785 7.35645 8.03125 7.71777 7.8457C7.99316 7.70312 8.33594 7.63184 8.74609 7.63184C9.2793 7.63184 9.69531 7.74414 9.99414 7.96875C10.2949 8.19141 10.4883 8.5 10.5742 8.89453L9.71289 9.05566C9.65234 8.84473 9.53809 8.67871 9.37012 8.55762C9.2041 8.43457 8.99609 8.37305 8.74609 8.37305C8.36719 8.37305 8.06543 8.49316 7.84082 8.7334C7.61816 8.97363 7.50684 9.33008 7.50684 9.80273C7.50684 10.3125 7.62012 10.6953 7.84668 10.9512C8.07324 11.2051 8.37012 11.332 8.7373 11.332C8.91895 11.332 9.10059 11.2969 9.28223 11.2266C9.46582 11.1543 9.62305 11.0674 9.75391 10.9658V10.4209H8.76074ZM11.2363 10.4004C11.2363 10.127 11.3037 9.8623 11.4385 9.60645C11.5732 9.35059 11.7637 9.15527 12.0098 9.02051C12.2578 8.88574 12.5342 8.81836 12.8389 8.81836C13.3096 8.81836 13.6953 8.97168 13.9961 9.27832C14.2969 9.58301 14.4473 9.96875 14.4473 10.4355C14.4473 10.9062 14.2949 11.2969 13.9902 11.6074C13.6875 11.916 13.3057 12.0703 12.8447 12.0703C12.5596 12.0703 12.2871 12.0059 12.0273 11.877C11.7695 11.748 11.5732 11.5596 11.4385 11.3115C11.3037 11.0615 11.2363 10.7578 11.2363 10.4004ZM12.0801 10.4443C12.0801 10.7529 12.1533 10.9893 12.2998 11.1533C12.4463 11.3174 12.627 11.3994 12.8418 11.3994C13.0566 11.3994 13.2363 11.3174 13.3809 11.1533C13.5273 10.9893 13.6006 10.751 13.6006 10.4385C13.6006 10.1338 13.5273 9.89941 13.3809 9.73535C13.2363 9.57129 13.0566 9.48926 12.8418 9.48926C12.627 9.48926 12.4463 9.57129 12.2998 9.73535C12.1533 9.89941 12.0801 10.1357 12.0801 10.4443ZM15.9502 12L14.6963 8.88867H15.5605L16.1465 10.4766L16.3164 11.0068C16.3613 10.8721 16.3896 10.7832 16.4014 10.7402C16.4287 10.6523 16.458 10.5645 16.4893 10.4766L17.0811 8.88867H17.9277L16.6914 12H15.9502ZM19.4072 12V8.43164H18.1328V7.70508H21.5459V8.43164H20.2744V12H19.4072ZM23.2041 12L21.6689 7.70508H22.6094L23.6963 10.8838L24.748 7.70508H25.668L24.1299 12H23.2041Z" fill="#ECFDFF"/>
5
+ </g>
6
+ <defs>
7
+ <clipPath id="clip0_745_1378">
8
+ <rect width="31" height="25" fill="white"/>
9
+ </clipPath>
10
+ </defs>
11
+ </svg>
12
+ `,x={class:"phila-footer-icon-list"},g=e.defineComponent({__name:"ThirdNavSlotContent",setup(n){return(l,t)=>(e.openBlock(),e.createElementBlock("div",null,[t[2]||(t[2]=e.createElementVNode("h4",null,"Explore Philadelphia",-1)),e.createElementVNode("nav",null,[e.createElementVNode("ul",null,[e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://www.septa.org/","is-external":""},{default:e.withCtx(()=>[...t[0]||(t[0]=[e.createTextVNode("SEPTA",-1)])]),_:1})]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{size:"small",href:"https://www.visitphilly.com/","is-external":""},{default:e.withCtx(()=>[...t[1]||(t[1]=[e.createTextVNode("Visit Philadelphia",-1)])]),_:1})])])]),e.createElementVNode("nav",null,[e.createElementVNode("ul",x,[e.createElementVNode("li",null,[e.createVNode(e.unref(o),{"icon-only":"",size:"medium","icon-definition":e.unref(m),href:"https://www.facebook.com/cityofphiladelphia"},null,8,["icon-definition"])]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{"icon-only":"",size:"medium","icon-definition":e.unref(w),href:"https://twitter.com/PhiladelphiaGov"},null,8,["icon-definition"])]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{"icon-only":"",size:"medium","icon-definition":e.unref(V),href:"https://www.instagram.com/cityofphiladelphia/"},null,8,["icon-definition"])]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{"icon-only":"",size:"medium","svg-raw":e.unref(v),href:"https://www.phila.gov/departments/office-of-innovation-and-technology/phlgovtv/"},null,8,["svg-raw"])]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{"icon-only":"",size:"medium","icon-definition":e.unref(p),href:"https://www.youtube.com/user/PhilaGov"},null,8,["icon-definition"])]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{"icon-only":"",size:"medium","icon-definition":e.unref(N),href:"https://www.flickr.com/photos/phillycityrep"},null,8,["icon-definition"])]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{"icon-only":"",size:"medium","icon-definition":e.unref(h),href:"https://github.com/CityOfPhiladelphia"},null,8,["icon-definition"])]),e.createElementVNode("li",null,[e.createVNode(e.unref(o),{"icon-only":"",size:"medium","icon-definition":e.unref(C),href:"https://www.linkedin.com/showcase/phlcitycareers"},null,8,["icon-definition"])])])])]))}}),d=(n,l)=>{const t=n.__vccOpts||n;for(const[r,i]of l)t[r]=i;return t},z=d(g,[["__scopeId","data-v-08d51492"]]),y={key:0,id:"mainFooter",class:"phila-main-footer has-background-primary"},E={class:"phila-main-footer-content"},b={class:"phila-main-footer-slot"},k={class:"phila-main-footer-slot"},T={class:"phila-main-footer-slot"},M={id:"subFooter",class:"phila-sub-footer has-background-primary"},_=e.defineComponent({__name:"AppFooter",props:{subFooterOnly:{type:Boolean,default:!1},className:{}},setup(n){const l=n,t=e.computed(()=>s.cn("phila-footer content",l.className));return(r,i)=>(e.openBlock(),e.createElementBlock("footer",{class:e.normalizeClass(t.value)},[n.subFooterOnly?e.createCommentVNode("",!0):(e.openBlock(),e.createElementBlock("div",y,[e.createElementVNode("div",E,[e.createElementVNode("nav",b,[e.renderSlot(r.$slots,"firstNavSlot",{},()=>[e.createVNode(f)],!0)]),i[0]||(i[0]=e.createElementVNode("div",{class:"phila-footer-divider"},null,-1)),e.createElementVNode("nav",k,[e.renderSlot(r.$slots,"secondNavSlot",{},()=>[e.createVNode(u)],!0)]),i[1]||(i[1]=e.createElementVNode("div",{class:"phila-footer-divider"},null,-1)),e.createElementVNode("nav",T,[e.renderSlot(r.$slots,"thirdNavSlot",{},()=>[e.createVNode(z)],!0)])])])),e.createElementVNode("div",M,[e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/terms-of-use/"},{default:e.withCtx(()=>[...i[2]||(i[2]=[e.createTextVNode("Terms of use",-1)])]),_:1}),e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/open-records-policy/"},{default:e.withCtx(()=>[...i[3]||(i[3]=[e.createTextVNode("Right to know",-1)])]),_:1}),e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/privacypolicy/"},{default:e.withCtx(()=>[...i[4]||(i[4]=[e.createTextVNode("Privacy Policy",-1)])]),_:1}),e.createVNode(e.unref(o),{size:"small",href:"https://www.phila.gov/accessibility-policy/"},{default:e.withCtx(()=>[...i[5]||(i[5]=[e.createTextVNode("Accessibility",-1)])]),_:1})])],2))}}),L=d(_,[["__scopeId","data-v-a57cdbbc"]]);exports.AppFooter=L;
package/dist/index.mjs CHANGED
@@ -1,22 +1,507 @@
1
- import { defineComponent as r, computed as a, createElementBlock as n, openBlock as p, normalizeClass as l } from "vue";
2
- import { cn as m } from "@phila/phila-ui-core";
3
- import './index.css';const _ = /* @__PURE__ */ r({
1
+ import { defineComponent as h, computed as m, createBlock as b, openBlock as u, unref as t, normalizeProps as w, guardReactiveProps as C, withCtx as s, createVNode as o, renderSlot as v, createTextVNode as a, toDisplayString as x, createElementBlock as c, createElementVNode as i, normalizeClass as k, createCommentVNode as M } from "vue";
2
+ import { cn as g, isRouterLink as N, BaseLink as _, ActionContent as L } from "@phila/phila-ui-core";
3
+ import './index.css';const n = /* @__PURE__ */ h({
4
+ inheritAttrs: !1,
5
+ __name: "Link",
6
+ props: {
7
+ to: {},
8
+ href: {},
9
+ target: {},
10
+ rel: {},
11
+ disabled: { type: Boolean, default: !1 },
12
+ ariaLabel: {},
13
+ className: {},
14
+ iconRight: { type: Boolean },
15
+ iconOnly: { type: Boolean, default: !1 },
16
+ text: {},
17
+ size: {},
18
+ iconDefinition: {},
19
+ iconClass: {},
20
+ src: {},
21
+ svgRaw: {},
22
+ variant: { default: "default" },
23
+ isExternal: { type: Boolean, default: !1 }
24
+ },
25
+ setup(f) {
26
+ const e = f, l = m(() => !(!e.isExternal || e.iconDefinition || e.iconClass || e.src || e.svgRaw)), p = m(() => g(
27
+ "phila-link",
28
+ e.variant && `phila-link--${e.variant}`,
29
+ e.size && `is-${e.size}`,
30
+ e.iconOnly && "icon-link",
31
+ e.disabled && "is-disabled",
32
+ e.className
33
+ )), r = m(() => {
34
+ const d = {
35
+ disabled: e.disabled,
36
+ ariaLabel: e.ariaLabel,
37
+ className: p.value
38
+ };
39
+ return N(e) ? {
40
+ to: e.to,
41
+ ...d
42
+ } : {
43
+ href: e.href,
44
+ target: e.target,
45
+ rel: e.rel,
46
+ ...d
47
+ };
48
+ }), y = m(
49
+ () => ({
50
+ iconDefinition: e.iconDefinition,
51
+ iconClass: e.iconClass || (l.value ? "external-link" : void 0),
52
+ src: e.src,
53
+ svgRaw: e.svgRaw,
54
+ iconRight: l.value ? !0 : e.iconRight,
55
+ iconOnly: e.iconOnly,
56
+ text: e.text,
57
+ size: e.size
58
+ })
59
+ );
60
+ return (d, q) => (u(), b(t(_), w(C({ ...r.value, ...d.$attrs })), {
61
+ default: s(() => [
62
+ o(t(L), w(C(y.value)), {
63
+ default: s(() => [
64
+ v(d.$slots, "default", {}, () => [
65
+ a(x(e.text), 1)
66
+ ])
67
+ ]),
68
+ _: 3
69
+ }, 16)
70
+ ]),
71
+ _: 3
72
+ }, 16));
73
+ }
74
+ }), H = /* @__PURE__ */ h({
75
+ __name: "FirstNavSlotContent",
76
+ setup(f) {
77
+ return (e, l) => (u(), c("div", null, [
78
+ l[8] || (l[8] = i("h4", null, "Elected officials", -1)),
79
+ i("nav", null, [
80
+ i("ul", null, [
81
+ i("li", null, [
82
+ o(t(n), {
83
+ size: "small",
84
+ href: "https://www.phila.gov/departments/mayor/"
85
+ }, {
86
+ default: s(() => [...l[0] || (l[0] = [
87
+ a("Mayor", -1)
88
+ ])]),
89
+ _: 1
90
+ })
91
+ ]),
92
+ i("li", null, [
93
+ o(t(n), {
94
+ size: "small",
95
+ href: "http://phlcouncil.com/",
96
+ "is-external": ""
97
+ }, {
98
+ default: s(() => [...l[1] || (l[1] = [
99
+ a("City Council", -1)
100
+ ])]),
101
+ _: 1
102
+ })
103
+ ]),
104
+ i("li", null, [
105
+ o(t(n), {
106
+ size: "small",
107
+ href: "http://www.courts.phila.gov/"
108
+ }, {
109
+ default: s(() => [...l[2] || (l[2] = [
110
+ a("Courts", -1)
111
+ ])]),
112
+ _: 1
113
+ })
114
+ ]),
115
+ i("li", null, [
116
+ o(t(n), {
117
+ size: "small",
118
+ href: "https://phillyda.org/",
119
+ "is-external": ""
120
+ }, {
121
+ default: s(() => [...l[3] || (l[3] = [
122
+ a("District Attorney", -1)
123
+ ])]),
124
+ _: 1
125
+ })
126
+ ]),
127
+ i("li", null, [
128
+ o(t(n), {
129
+ size: "small",
130
+ href: "https://controller.phila.gov/"
131
+ }, {
132
+ default: s(() => [...l[4] || (l[4] = [
133
+ a("City Controller", -1)
134
+ ])]),
135
+ _: 1
136
+ })
137
+ ]),
138
+ i("li", null, [
139
+ o(t(n), {
140
+ size: "small",
141
+ href: "https://phillysheriff.com/",
142
+ "is-external": ""
143
+ }, {
144
+ default: s(() => [...l[5] || (l[5] = [
145
+ a("Sheriff", -1)
146
+ ])]),
147
+ _: 1
148
+ })
149
+ ]),
150
+ i("li", null, [
151
+ o(t(n), {
152
+ size: "small",
153
+ href: "https://vote.phila.gov/"
154
+ }, {
155
+ default: s(() => [...l[6] || (l[6] = [
156
+ a("City Commissioners", -1)
157
+ ])]),
158
+ _: 1
159
+ })
160
+ ]),
161
+ i("li", null, [
162
+ o(t(n), {
163
+ size: "small",
164
+ href: "https://www.phila.gov/departments/register-of-wills/"
165
+ }, {
166
+ default: s(() => [...l[7] || (l[7] = [
167
+ a("Register of Wills", -1)
168
+ ])]),
169
+ _: 1
170
+ })
171
+ ])
172
+ ])
173
+ ])
174
+ ]));
175
+ }
176
+ }), V = /* @__PURE__ */ h({
177
+ __name: "SecondNavSlotContent",
178
+ setup(f) {
179
+ return (e, l) => (u(), c("div", null, [
180
+ l[8] || (l[8] = i("h4", null, "Open government", -1)),
181
+ i("nav", null, [
182
+ i("ul", null, [
183
+ i("li", null, [
184
+ o(t(n), {
185
+ size: "small",
186
+ href: "https://codelibrary.amlegal.com/codes/philadelphia/latest/overview",
187
+ "is-external": ""
188
+ }, {
189
+ default: s(() => [...l[0] || (l[0] = [
190
+ a(" Philadelphia Code & Charter ", -1)
191
+ ])]),
192
+ _: 1
193
+ })
194
+ ]),
195
+ i("li", null, [
196
+ o(t(n), {
197
+ size: "small",
198
+ href: "https://www.phila.gov/departments/department-of-records/"
199
+ }, {
200
+ default: s(() => [...l[1] || (l[1] = [
201
+ a(" City records ", -1)
202
+ ])]),
203
+ _: 1
204
+ })
205
+ ]),
206
+ i("li", null, [
207
+ o(t(n), {
208
+ size: "small",
209
+ href: "https://www.phila.gov/departments/department-of-records/proposed-regulations/#/"
210
+ }, {
211
+ default: s(() => [...l[2] || (l[2] = [
212
+ a(" City agency regulations ", -1)
213
+ ])]),
214
+ _: 1
215
+ })
216
+ ]),
217
+ i("li", null, [
218
+ o(t(n), {
219
+ size: "small",
220
+ href: "https://www.phila.gov/departments/mayor/executive-orders/"
221
+ }, {
222
+ default: s(() => [...l[3] || (l[3] = [
223
+ a(" Executive orders ", -1)
224
+ ])]),
225
+ _: 1
226
+ })
227
+ ]),
228
+ i("li", null, [
229
+ o(t(n), {
230
+ size: "small",
231
+ href: "https://www.phila.gov/programs/integrity-works/"
232
+ }, {
233
+ default: s(() => [...l[4] || (l[4] = [
234
+ a(" Honesty in government ", -1)
235
+ ])]),
236
+ _: 1
237
+ })
238
+ ]),
239
+ i("li", null, [
240
+ o(t(n), {
241
+ size: "small",
242
+ href: "https://vote.phila.gov/"
243
+ }, {
244
+ default: s(() => [...l[5] || (l[5] = [
245
+ a(" Voting & elections ", -1)
246
+ ])]),
247
+ _: 1
248
+ })
249
+ ]),
250
+ i("li", null, [
251
+ o(t(n), {
252
+ size: "small",
253
+ href: "https://www.phila.gov/programs/open-data-program/"
254
+ }, {
255
+ default: s(() => [...l[6] || (l[6] = [
256
+ a(" Open data ", -1)
257
+ ])]),
258
+ _: 1
259
+ })
260
+ ]),
261
+ i("li", null, [
262
+ o(t(n), {
263
+ size: "small",
264
+ href: "https://www.phila.gov/documents/city-of-philadelphia-organization-chart/"
265
+ }, {
266
+ default: s(() => [...l[7] || (l[7] = [
267
+ a(" City organization chart ", -1)
268
+ ])]),
269
+ _: 1
270
+ })
271
+ ])
272
+ ])
273
+ ])
274
+ ]));
275
+ }
276
+ });
277
+ var F = {
278
+ prefix: "fab",
279
+ iconName: "facebook-f",
280
+ icon: [320, 512, [], "f39e", "M80 299.3l0 212.7 116 0 0-212.7 86.5 0 18-97.8-104.5 0 0-34.6c0-51.7 20.3-71.5 72.7-71.5 16.3 0 29.4 .4 37 1.2l0-88.7C291.4 4 256.4 0 236.2 0 129.3 0 80 50.5 80 159.4l0 42.1-66 0 0 97.8 66 0z"]
281
+ }, P = {
282
+ prefix: "fab",
283
+ iconName: "youtube",
284
+ icon: [576, 512, [61802], "f167", "M549.7 124.1C543.5 100.4 524.9 81.8 501.4 75.5 458.9 64 288.1 64 288.1 64S117.3 64 74.7 75.5C51.2 81.8 32.7 100.4 26.4 124.1 15 167 15 256.4 15 256.4s0 89.4 11.4 132.3c6.3 23.6 24.8 41.5 48.3 47.8 42.6 11.5 213.4 11.5 213.4 11.5s170.8 0 213.4-11.5c23.5-6.3 42-24.2 48.3-47.8 11.4-42.9 11.4-132.3 11.4-132.3s0-89.4-11.4-132.3zM232.2 337.6l0-162.4 142.7 81.2-142.7 81.2z"]
285
+ }, S = {
286
+ prefix: "fab",
287
+ iconName: "github",
288
+ icon: [512, 512, [], "f09b", "M173.9 397.4c0 2-2.3 3.6-5.2 3.6-3.3 .3-5.6-1.3-5.6-3.6 0-2 2.3-3.6 5.2-3.6 3-.3 5.6 1.3 5.6 3.6zm-31.1-4.5c-.7 2 1.3 4.3 4.3 4.9 2.6 1 5.6 0 6.2-2s-1.3-4.3-4.3-5.2c-2.6-.7-5.5 .3-6.2 2.3zm44.2-1.7c-2.9 .7-4.9 2.6-4.6 4.9 .3 2 2.9 3.3 5.9 2.6 2.9-.7 4.9-2.6 4.6-4.6-.3-1.9-3-3.2-5.9-2.9zM252.8 8c-138.7 0-244.8 105.3-244.8 244 0 110.9 69.8 205.8 169.5 239.2 12.8 2.3 17.3-5.6 17.3-12.1 0-6.2-.3-40.4-.3-61.4 0 0-70 15-84.7-29.8 0 0-11.4-29.1-27.8-36.6 0 0-22.9-15.7 1.6-15.4 0 0 24.9 2 38.6 25.8 21.9 38.6 58.6 27.5 72.9 20.9 2.3-16 8.8-27.1 16-33.7-55.9-6.2-112.3-14.3-112.3-110.5 0-27.5 7.6-41.3 23.6-58.9-2.6-6.5-11.1-33.3 2.6-67.9 20.9-6.5 69 27 69 27 20-5.6 41.5-8.5 62.8-8.5s42.8 2.9 62.8 8.5c0 0 48.1-33.6 69-27 13.7 34.7 5.2 61.4 2.6 67.9 16 17.7 25.8 31.5 25.8 58.9 0 96.5-58.9 104.2-114.8 110.5 9.2 7.9 17 22.9 17 46.4 0 33.7-.3 75.4-.3 83.6 0 6.5 4.6 14.4 17.3 12.1 100-33.2 167.8-128.1 167.8-239 0-138.7-112.5-244-251.2-244zM105.2 352.9c-1.3 1-1 3.3 .7 5.2 1.6 1.6 3.9 2.3 5.2 1 1.3-1 1-3.3-.7-5.2-1.6-1.6-3.9-2.3-5.2-1zm-10.8-8.1c-.7 1.3 .3 2.9 2.3 3.9 1.6 1 3.6 .7 4.3-.7 .7-1.3-.3-2.9-2.3-3.9-2-.6-3.6-.3-4.3 .7zm32.4 35.6c-1.6 1.3-1 4.3 1.3 6.2 2.3 2.3 5.2 2.6 6.5 1 1.3-1.3 .7-4.3-1.3-6.2-2.2-2.3-5.2-2.6-6.5-1zm-11.4-14.7c-1.6 1-1.6 3.6 0 5.9s4.3 3.3 5.6 2.3c1.6-1.3 1.6-3.9 0-6.2-1.4-2.3-4-3.3-5.6-2z"]
289
+ }, R = {
290
+ prefix: "fab",
291
+ iconName: "flickr",
292
+ icon: [448, 512, [], "f16e", "M400 32L48 32C21.5 32 0 53.5 0 80L0 432c0 26.5 21.5 48 48 48l352 0c26.5 0 48-21.5 48-48l0-352c0-26.5-21.5-48-48-48zM144.5 192a63.5 63.5 0 1 1 0 127 63.5 63.5 0 1 1 0-127zm159 0a63.5 63.5 0 1 1 0 127 63.5 63.5 0 1 1 0-127z"]
293
+ }, $ = {
294
+ prefix: "fab",
295
+ iconName: "instagram",
296
+ icon: [448, 512, [], "f16d", "M224.3 141a115 115 0 1 0 -.6 230 115 115 0 1 0 .6-230zm-.6 40.4a74.6 74.6 0 1 1 .6 149.2 74.6 74.6 0 1 1 -.6-149.2zm93.4-45.1a26.8 26.8 0 1 1 53.6 0 26.8 26.8 0 1 1 -53.6 0zm129.7 27.2c-1.7-35.9-9.9-67.7-36.2-93.9-26.2-26.2-58-34.4-93.9-36.2-37-2.1-147.9-2.1-184.9 0-35.8 1.7-67.6 9.9-93.9 36.1s-34.4 58-36.2 93.9c-2.1 37-2.1 147.9 0 184.9 1.7 35.9 9.9 67.7 36.2 93.9s58 34.4 93.9 36.2c37 2.1 147.9 2.1 184.9 0 35.9-1.7 67.7-9.9 93.9-36.2 26.2-26.2 34.4-58 36.2-93.9 2.1-37 2.1-147.8 0-184.8zM399 388c-7.8 19.6-22.9 34.7-42.6 42.6-29.5 11.7-99.5 9-132.1 9s-102.7 2.6-132.1-9c-19.6-7.8-34.7-22.9-42.6-42.6-11.7-29.5-9-99.5-9-132.1s-2.6-102.7 9-132.1c7.8-19.6 22.9-34.7 42.6-42.6 29.5-11.7 99.5-9 132.1-9s102.7-2.6 132.1 9c19.6 7.8 34.7 22.9 42.6 42.6 11.7 29.5 9 99.5 9 132.1s2.7 102.7-9 132.1z"]
297
+ }, B = {
298
+ prefix: "fab",
299
+ iconName: "x-twitter",
300
+ icon: [448, 512, [], "e61b", "M357.2 48L427.8 48 273.6 224.2 455 464 313 464 201.7 318.6 74.5 464 3.8 464 168.7 275.5-5.2 48 140.4 48 240.9 180.9 357.2 48zM332.4 421.8l39.1 0-252.4-333.8-42 0 255.3 333.8z"]
301
+ }, E = {
302
+ prefix: "fab",
303
+ iconName: "linkedin-in",
304
+ icon: [448, 512, [], "f0e1", "M100.3 448l-92.9 0 0-299.1 92.9 0 0 299.1zM53.8 108.1C24.1 108.1 0 83.5 0 53.8 0 39.5 5.7 25.9 15.8 15.8s23.8-15.8 38-15.8 27.9 5.7 38 15.8 15.8 23.8 15.8 38c0 29.7-24.1 54.3-53.8 54.3zM447.9 448l-92.7 0 0-145.6c0-34.7-.7-79.2-48.3-79.2-48.3 0-55.7 37.7-55.7 76.7l0 148.1-92.8 0 0-299.1 89.1 0 0 40.8 1.3 0c12.4-23.5 42.7-48.3 87.9-48.3 94 0 111.3 61.9 111.3 142.3l0 164.3-.1 0z"]
305
+ };
306
+ const O = `<svg width="31" height="25" viewBox="0 0 31 25" fill="none" xmlns="http://www.w3.org/2000/svg">
307
+ <g clip-path="url(#clip0_745_1378)">
308
+ <path d="M28 3.125H3.1V17H28V3.125ZM0 17.1875V3.125C0 1.40137 1.39016 0 3.1 0H27.9C29.6098 0 31 1.40137 31 3.125V17.1875C31 18.9111 29.6098 20.3125 27.9 20H3.1C1.39016 20.3125 0 18.9111 0 17.1875ZM4.65 23.4375C4.65 22.5732 5.34266 21.875 6.2 21.875H24.8C25.6573 21.875 26.35 22.5732 26.35 23.4375C26.35 24.3018 25.6573 25 24.8 25H6.2C5.34266 25 4.65 24.3018 4.65 23.4375Z" fill="#ECFDFF"/>
309
+ <path d="M8.76074 10.4209V9.69727H10.6299V11.4082C10.4482 11.584 10.1846 11.7393 9.83887 11.874C9.49512 12.0068 9.14648 12.0732 8.79297 12.0732C8.34375 12.0732 7.95215 11.9795 7.61816 11.792C7.28418 11.6025 7.0332 11.333 6.86523 10.9834C6.69727 10.6318 6.61328 10.25 6.61328 9.83789C6.61328 9.39062 6.70703 8.99316 6.89453 8.64551C7.08203 8.29785 7.35645 8.03125 7.71777 7.8457C7.99316 7.70312 8.33594 7.63184 8.74609 7.63184C9.2793 7.63184 9.69531 7.74414 9.99414 7.96875C10.2949 8.19141 10.4883 8.5 10.5742 8.89453L9.71289 9.05566C9.65234 8.84473 9.53809 8.67871 9.37012 8.55762C9.2041 8.43457 8.99609 8.37305 8.74609 8.37305C8.36719 8.37305 8.06543 8.49316 7.84082 8.7334C7.61816 8.97363 7.50684 9.33008 7.50684 9.80273C7.50684 10.3125 7.62012 10.6953 7.84668 10.9512C8.07324 11.2051 8.37012 11.332 8.7373 11.332C8.91895 11.332 9.10059 11.2969 9.28223 11.2266C9.46582 11.1543 9.62305 11.0674 9.75391 10.9658V10.4209H8.76074ZM11.2363 10.4004C11.2363 10.127 11.3037 9.8623 11.4385 9.60645C11.5732 9.35059 11.7637 9.15527 12.0098 9.02051C12.2578 8.88574 12.5342 8.81836 12.8389 8.81836C13.3096 8.81836 13.6953 8.97168 13.9961 9.27832C14.2969 9.58301 14.4473 9.96875 14.4473 10.4355C14.4473 10.9062 14.2949 11.2969 13.9902 11.6074C13.6875 11.916 13.3057 12.0703 12.8447 12.0703C12.5596 12.0703 12.2871 12.0059 12.0273 11.877C11.7695 11.748 11.5732 11.5596 11.4385 11.3115C11.3037 11.0615 11.2363 10.7578 11.2363 10.4004ZM12.0801 10.4443C12.0801 10.7529 12.1533 10.9893 12.2998 11.1533C12.4463 11.3174 12.627 11.3994 12.8418 11.3994C13.0566 11.3994 13.2363 11.3174 13.3809 11.1533C13.5273 10.9893 13.6006 10.751 13.6006 10.4385C13.6006 10.1338 13.5273 9.89941 13.3809 9.73535C13.2363 9.57129 13.0566 9.48926 12.8418 9.48926C12.627 9.48926 12.4463 9.57129 12.2998 9.73535C12.1533 9.89941 12.0801 10.1357 12.0801 10.4443ZM15.9502 12L14.6963 8.88867H15.5605L16.1465 10.4766L16.3164 11.0068C16.3613 10.8721 16.3896 10.7832 16.4014 10.7402C16.4287 10.6523 16.458 10.5645 16.4893 10.4766L17.0811 8.88867H17.9277L16.6914 12H15.9502ZM19.4072 12V8.43164H18.1328V7.70508H21.5459V8.43164H20.2744V12H19.4072ZM23.2041 12L21.6689 7.70508H22.6094L23.6963 10.8838L24.748 7.70508H25.668L24.1299 12H23.2041Z" fill="#ECFDFF"/>
310
+ </g>
311
+ <defs>
312
+ <clipPath id="clip0_745_1378">
313
+ <rect width="31" height="25" fill="white"/>
314
+ </clipPath>
315
+ </defs>
316
+ </svg>
317
+ `, Z = { class: "phila-footer-icon-list" }, D = /* @__PURE__ */ h({
318
+ __name: "ThirdNavSlotContent",
319
+ setup(f) {
320
+ return (e, l) => (u(), c("div", null, [
321
+ l[2] || (l[2] = i("h4", null, "Explore Philadelphia", -1)),
322
+ i("nav", null, [
323
+ i("ul", null, [
324
+ i("li", null, [
325
+ o(t(n), {
326
+ size: "small",
327
+ href: "https://www.septa.org/",
328
+ "is-external": ""
329
+ }, {
330
+ default: s(() => [...l[0] || (l[0] = [
331
+ a("SEPTA", -1)
332
+ ])]),
333
+ _: 1
334
+ })
335
+ ]),
336
+ i("li", null, [
337
+ o(t(n), {
338
+ size: "small",
339
+ href: "https://www.visitphilly.com/",
340
+ "is-external": ""
341
+ }, {
342
+ default: s(() => [...l[1] || (l[1] = [
343
+ a("Visit Philadelphia", -1)
344
+ ])]),
345
+ _: 1
346
+ })
347
+ ])
348
+ ])
349
+ ]),
350
+ i("nav", null, [
351
+ i("ul", Z, [
352
+ i("li", null, [
353
+ o(t(n), {
354
+ "icon-only": "",
355
+ size: "medium",
356
+ "icon-definition": t(F),
357
+ href: "https://www.facebook.com/cityofphiladelphia"
358
+ }, null, 8, ["icon-definition"])
359
+ ]),
360
+ i("li", null, [
361
+ o(t(n), {
362
+ "icon-only": "",
363
+ size: "medium",
364
+ "icon-definition": t(B),
365
+ href: "https://twitter.com/PhiladelphiaGov"
366
+ }, null, 8, ["icon-definition"])
367
+ ]),
368
+ i("li", null, [
369
+ o(t(n), {
370
+ "icon-only": "",
371
+ size: "medium",
372
+ "icon-definition": t($),
373
+ href: "https://www.instagram.com/cityofphiladelphia/"
374
+ }, null, 8, ["icon-definition"])
375
+ ]),
376
+ i("li", null, [
377
+ o(t(n), {
378
+ "icon-only": "",
379
+ size: "medium",
380
+ "svg-raw": t(O),
381
+ href: "https://www.phila.gov/departments/office-of-innovation-and-technology/phlgovtv/"
382
+ }, null, 8, ["svg-raw"])
383
+ ]),
384
+ i("li", null, [
385
+ o(t(n), {
386
+ "icon-only": "",
387
+ size: "medium",
388
+ "icon-definition": t(P),
389
+ href: "https://www.youtube.com/user/PhilaGov"
390
+ }, null, 8, ["icon-definition"])
391
+ ]),
392
+ i("li", null, [
393
+ o(t(n), {
394
+ "icon-only": "",
395
+ size: "medium",
396
+ "icon-definition": t(R),
397
+ href: "https://www.flickr.com/photos/phillycityrep"
398
+ }, null, 8, ["icon-definition"])
399
+ ]),
400
+ i("li", null, [
401
+ o(t(n), {
402
+ "icon-only": "",
403
+ size: "medium",
404
+ "icon-definition": t(S),
405
+ href: "https://github.com/CityOfPhiladelphia"
406
+ }, null, 8, ["icon-definition"])
407
+ ]),
408
+ i("li", null, [
409
+ o(t(n), {
410
+ "icon-only": "",
411
+ size: "medium",
412
+ "icon-definition": t(E),
413
+ href: "https://www.linkedin.com/showcase/phlcitycareers"
414
+ }, null, 8, ["icon-definition"])
415
+ ])
416
+ ])
417
+ ])
418
+ ]));
419
+ }
420
+ }), z = (f, e) => {
421
+ const l = f.__vccOpts || f;
422
+ for (const [p, r] of e)
423
+ l[p] = r;
424
+ return l;
425
+ }, A = /* @__PURE__ */ z(D, [["__scopeId", "data-v-08d51492"]]), T = {
426
+ key: 0,
427
+ id: "mainFooter",
428
+ class: "phila-main-footer has-background-primary"
429
+ }, I = { class: "phila-main-footer-content" }, G = { class: "phila-main-footer-slot" }, W = { class: "phila-main-footer-slot" }, X = { class: "phila-main-footer-slot" }, Y = {
430
+ id: "subFooter",
431
+ class: "phila-sub-footer has-background-primary"
432
+ }, j = /* @__PURE__ */ h({
4
433
  __name: "AppFooter",
5
434
  props: {
435
+ subFooterOnly: { type: Boolean, default: !1 },
6
436
  className: {}
7
437
  },
8
- setup(e, { emit: s }) {
9
- const o = e, t = a(() => m("default-class", o.className));
10
- return (c, u) => (p(), n("span", {
11
- class: l(t.value)
12
- }, " Hello world! I am AppFooter ", 2));
438
+ setup(f) {
439
+ const e = f, l = m(() => g("phila-footer content", e.className));
440
+ return (p, r) => (u(), c("footer", {
441
+ class: k(l.value)
442
+ }, [
443
+ f.subFooterOnly ? M("", !0) : (u(), c("div", T, [
444
+ i("div", I, [
445
+ i("nav", G, [
446
+ v(p.$slots, "firstNavSlot", {}, () => [
447
+ o(H)
448
+ ], !0)
449
+ ]),
450
+ r[0] || (r[0] = i("div", { class: "phila-footer-divider" }, null, -1)),
451
+ i("nav", W, [
452
+ v(p.$slots, "secondNavSlot", {}, () => [
453
+ o(V)
454
+ ], !0)
455
+ ]),
456
+ r[1] || (r[1] = i("div", { class: "phila-footer-divider" }, null, -1)),
457
+ i("nav", X, [
458
+ v(p.$slots, "thirdNavSlot", {}, () => [
459
+ o(A)
460
+ ], !0)
461
+ ])
462
+ ])
463
+ ])),
464
+ i("div", Y, [
465
+ o(t(n), {
466
+ size: "small",
467
+ href: "https://www.phila.gov/terms-of-use/"
468
+ }, {
469
+ default: s(() => [...r[2] || (r[2] = [
470
+ a("Terms of use", -1)
471
+ ])]),
472
+ _: 1
473
+ }),
474
+ o(t(n), {
475
+ size: "small",
476
+ href: "https://www.phila.gov/open-records-policy/"
477
+ }, {
478
+ default: s(() => [...r[3] || (r[3] = [
479
+ a("Right to know", -1)
480
+ ])]),
481
+ _: 1
482
+ }),
483
+ o(t(n), {
484
+ size: "small",
485
+ href: "https://www.phila.gov/privacypolicy/"
486
+ }, {
487
+ default: s(() => [...r[4] || (r[4] = [
488
+ a("Privacy Policy", -1)
489
+ ])]),
490
+ _: 1
491
+ }),
492
+ o(t(n), {
493
+ size: "small",
494
+ href: "https://www.phila.gov/accessibility-policy/"
495
+ }, {
496
+ default: s(() => [...r[5] || (r[5] = [
497
+ a("Accessibility", -1)
498
+ ])]),
499
+ _: 1
500
+ })
501
+ ])
502
+ ], 2));
13
503
  }
14
- }), f = (e, s) => {
15
- const o = e.__vccOpts || e;
16
- for (const [t, c] of s)
17
- o[t] = c;
18
- return o;
19
- }, v = /* @__PURE__ */ f(_, [["__scopeId", "data-v-f636e62c"]]);
504
+ }), Q = /* @__PURE__ */ z(j, [["__scopeId", "data-v-a57cdbbc"]]);
20
505
  export {
21
- v as AppFooter
506
+ Q as AppFooter
22
507
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@phila/phila-ui-app-footer",
3
- "version": "0.0.32",
3
+ "version": "1.1.0-beta.2",
4
4
  "type": "module",
5
5
  "description": "A footer vue component for site info and related links.",
6
6
  "main": "./dist/index.js",
@@ -25,10 +25,13 @@
25
25
  "author": "",
26
26
  "license": "MIT",
27
27
  "peerDependencies": {
28
+ "@fortawesome/vue-fontawesome": "^3.1.2",
28
29
  "vue": "^3.0.0"
29
30
  },
30
31
  "dependencies": {
31
- "@phila/phila-ui-core": "2.1.2"
32
+ "@fortawesome/free-brands-svg-icons": "^7.1.0",
33
+ "@phila/phila-ui-core": "2.2.0-beta.2",
34
+ "@phila/phila-ui-link": "1.0.0-beta.0"
32
35
  },
33
36
  "devDependencies": {
34
37
  "@types/node": "^24.0.0",